Otimizar páginas com Meta Tags

Como deixar sua página mais visível aos mecanismos de busca

Herly Crisaldo
Jaguaribe Tech
6 min readAug 19, 2017

--

Depois de um longo trabalho e dedicação na criação de uma nova página, vem a grande pergunta: será que verei meu site entre os primeiros do ranking de busca do google?

Mas, por que este buscador em particular? Porque é o mais requisitado nas consultas da Web desde o ano de 2010 até o presente ano de 2017, como mostra o gráfico abaixo:

fonte:https://www.statista.com/statistics/216573/worldwide-market-share-of-search-engines/

Uma chave para essa resposta pode estar no o uso de meta tags, contudo esse recurso isoladamente não fará milagres trazendo sua página ao topo do ranking. Nos dias atuais os buscadores levam muitos parâmetros em consideração nos resultados de busca, tal como a qualidade do conteúdo.

Esse processo têm mais facilidade com o Google Adwords (ferramenta de patrocínio de links, anúncios pagos). Mas aqui veremos algumas dicas de como alavancar sua página sem tirar dinheiro do bolso.

Meta tag

São configurações realizados no HTML, no Head do site para dar instruções aos programas externos sobre informações ou ações. Certas Meta Tags passam informações de descrição a serem exibidas nos resultados de busca, páginas que devem ser indexadas ou não, autor da página, entre outras instruções.

Sua importância para o SEO

As Meta tags são uma grande ferramenta de comunicação entre o desenvolvedor e os sites de busca. O algoritmo do Google utiliza de diversas variáveis para determinar os seus resultados de busca, e as meta tags são apenas algumas delas. Por isso todo desenvolvedor Web precisa ter ao menos conhecimento das principais Meta tags, tornando seu conteúdo visível para os motores de busca, gerando assim um boa demanda de visitas no site para a empresa ou serviço.

SEO

O termo SEO (Search Engine Optimization) pode ser compreendido como otimização para motores de busca, e para que este tratamento tenha eficácia é necessário que a página esteja indexada.

E de que forma funciona esta tal indexação? As maquinas virtuais de rastreamento do google (Googlebots),”robôs”, fazem uma varredura descobrindo novas páginas para serem incluídas no índice do google. São estes googlebots com seus algoritmos que rastreiam listas de URLs de páginas web processadas anteriormente, assim como dados obtidos dos sitemaps. Dessa forma ele identifica os links(SRC e HREF) de cada página e os coloca na lista de páginas a serem rastreadas. Serão detectados novos sites, modificações em sites existentes, links inativos, e tudo isso será determinante para atualizar o índice do google.

Em SEO algumas Meta tags mais efetivas

Meta Description

É a que define a descrição exibida nos resultados do Google. Faz uma descrição do conteúdo da página de maneira a atrair o interesse das pessoas em conhecer o conteúdo da página, aumentando assim a visitação do seu site.

Exemplo no código:

Aplicação da meta tag description

Resultado no navegador:

fonte:http://www.seomarketing.com.br/meta-description-seo.php

Meta Robots

Criada para dar orientações aos robots dos sites de busca. Cada página deve ter o seu meta robots. Alguns parâmetros que podem ser passados:

index: indexe esta página — exiba-a em seus resultados de busca;

noindex: não indexe esta página — não a exibir nos resultados de busca. Tem utilidade para páginas de acesso à login e intranet;

follow: siga os links desta pagina para encontrar novas páginas;

nofollow: não seguir os links desta página;

nosnippet: instrui o site de busca para não exibir a descrição da página nos seus resultados de busca;

noodp: Faz orientação ao Google de não utilizar a descrição do diretório DMOZ em seus resultados;

noarchive: Orienta o Google a não exibir a versão em cache da página;

noimageindex: não indexar nehuma imagem da página.

Exemplos de Meta Robots:

Orienta os buscadores a indexar o conteúdo da página e seguir todos os links para descobrir novas páginas
Orienta os buscadores a não indexar o conteúdo da página e impede-a de seguir os links para descobrir novas páginas

Meta Viewport

Este elemento fornece orientações ao navegador de como controlar as dimensões e escala da página. Tem sua variação de acordo com o dispositivo, e vai ser menor em uma tela de celular, e consequentemente, maior na tela de um computador.

Os valores de content são os que seguem abaixo:

width — Define uma largura para o viewport. Os valores podem ser em PX ou “device-width”, que determina automaticamente um valor igual a largura da tela do dispositivo.

height — Define uma altura para o viewport. Os valores podem ser em PX ou “device-height”, que determina automaticamente um valor igual a altura da tela do dispositivo.

initial-scale — Define a escala inicial do viewport.

user-scalable — Define a possibilidade de o usuário fazer “zoom” em um determinado lugar da tela. É ativado quando o usuário bate duas vezes com o dedo em um lugar da tela.

Entenda como funciona…

fonte: https://developers.google.com/webmasters/mobile-sites/mobile-seo/responsive-design?hl=pt-br

Do lado esquerdo está a Meta Viewport sem especificação de aplicação, sendo assim o navegador força a dimensão de um computador para que tome a dimensão da tela do tablet , comprometendo a leitura. Enquanto que do lado direto é perceptível o poder da aplicação desta Meta Tag, quando é feita a instrução para que a viewport tome a largura do dispositivo.

Ponto para quem utiliza em suas páginas. Para o Google uma boa experiência ao usuário é essencial.

Meta author

Com esta meta tag você pode declarar a autoria sobre a página, “assinando” seu código fonte:

Simples mas importantíssima. Ela tem utilidade quando algum usuário procura pelo seu nome em um site de busca. Ou também serve como uma segurança, nos casos onde alguém sem boas intensões faz uso indiscriminado do seu código, com esta meta tag você provaria que a página foi desenvolvida por você.

Aplicação no código

Meta Keywords

É a responsável pelas palavras-chaves que são utilizadas para ajudar na indexação da sua página pelos buscadores, gerando uma forma de catálogo de conteúdo. Se não utilizar as mesmas palavras, tente utilizar sinônimos. Evite quebrar uma linha de palavras-chave, para que seu trecho de código não seja considerado um erro e assim ignorado. Procure separar as palavras com vírgula e declare todas elas em letras minúsculas, alguns motores de busca têm problemas com letras maiúsculas e podem não dar atenção ao seu site.

aplicação no código

Conclusão

Não é necessário amontoar seu HTML com muitas Meta Tags. Apenas faça uso daquelas que realmente serão úteis. Estes foram apenas alguns exemplos, você pode encontrar outras para sua necessidade no MDN e no w3schools .

O uso das Meta tags são interessantes para sua página, mas não são o mais importante. É prioritário disponibilizar um bom conteúdo. Fazer um bom trabalho é mais justo para você e seu público alvo. Trabalhe com boas práticas e tenha sucesso.

Referências

--

--