Ir para conteúdo principal

Como adicionar meta tags ao HTML de seu site

As meta tags, também conhecidas como metadados, são snippets de HTML usadas no desenvolvimento da web para descrever o conteúdo de uma página da web.

As meta tags não aparecem nas páginas, mas sim no código-fonte do site, também conhecido como código HTML, localizado na seção head do site. Essas tags fornecem aos mecanismos de busca descrições sobre o conteúdo da página para ajudá-los a determinar de que se trata a página e entregar as páginas mais relevantes aos usuários dos mecanismos de busca.

As meta tags são usadas em HTML na seção head da página, tornando-as visíveis apenas para os mecanismos de busca e para aqueles que sabem como visualizar o código-fonte do site. Os metadados informam aos mecanismos de busca sobre os dados de um site para ajudar o seu conteúdo a se classificar em mecanismos de busca populares como o Google. Infelizmente, adicionar meta tags pode ser difícil se você não souber como criar metadados de sites ou codificar HTML.

O que é a tag HTML head?

A tag HTML head é o contêiner para metadados. Está localizada entre a tag HTML e as tags body . Esse é o local onde você coloca todas as suas meta tags em HTML para definir o título, estilos, scripts e outras informações. Essa área da página não aparece no navegador.

Em vez disso, os mecanismos de busca utilizam as informações para determinar do que se trata uma página, incluindo seu título, conteúdo, palavras-chave e mais. Os navegadores utilizam informações na seção head para exibir corretamente a página do site. Ao contrário do elemento head, o elemento body é exibido na página quando carregado em um navegador, então não deve conter nenhum metadado.

Onde está a seção head HTML?

A seção HTML head está localizada entre a tag HTML e a tag body. Normalmente, é muito menor do que a tag body porque sua principal função é conter metadados. Você pode usar as ferramentas de desenvolvedor de seu navegador para encontrar a seção HTML head de qualquer página de um site.

O que são metadados de site?

As meta tags em HTML são informações importantes para os mecanismos de busca. Elas são usadas para descrever elementos HTML e comunicar o conteúdo de um site aos mecanismos de busca.

Os metadados do site incluem títulos de páginas, descrições, palavras-chave e outros elementos para ajudar os mecanismos de busca a rastrear e classificar as páginas da web. Os mecanismos de busca interpretam dados e informações nas páginas do site para determinar sua relevância para a pesquisa de um usuário. Palavras-chave na seção body e links externos para seu site para a página desempenham papéis essenciais, mas os metadados explicam o propósito geral de uma página para que ela possa ser classificada por palavras-chave.

As meta tags podem melhorar os esforços de SEO para ajudar os mecanismos de busca a entender o propósito de uma página. No entanto, nem todas as meta tags são projetadas para fins de SEO.

Você pode adicionar metadados à seção head de um site de várias maneiras diferentes. Primeiro, você precisará ter acesso à seção head do arquivo HTML. Você pode baixá-la e editá-la com um editor de texto ou criar um arquivo novo. Você também pode optar por adicionar ou editar o arquivo no Gerente de Arquivos do cPanel. Depois que você tiver o arquivo HTML, localize a seção head no topo. Dependendo de como a página foi desenvolvida, você talvez já tenha uma tag title e outros tipos de meta tags.

Se você não é um desenvolvedor de sites, pode usar um plugin do WordPress como o SEOPress ou o Yoast para adicionar facilmente metatags às suas páginas da web.

Tag title

A tag title é o que aparece nas páginas de resultados dos mecanismos de busca (SERPs) como o título de sua página da web. Cada página de seu site deve ter uma única seção title. A seção title não deve ser confundida com a tag H1, que existe dentro da seção body da página e pode servir como um título para o conteúdo da página. As tags title devem ter cerca de 50-60 caracteres para evitar serem truncadas nos mecanismos de busca.

Você pode adicionar o título a uma página da web encontrando a tag no código-fonte e inserindo as palavras. Quando você terminar de adicionar sua tag title, ela deve se parecer com isto:

O título vai aqui

As tags title são importantes porque ajudam os mecanismos de busca a determinar do que se trata uma página da web, ajudando-os a decidir se devem ou não classificar sua página para uma consulta específica. As tags title também aparecem nas guias do navegador para ajudar você a navegar.

Tags title eficazes devem usar suas palavras-chave segmentadas para ajudar os mecanismos de busca a classificar a página. No entanto, elas também devem atrair os usuários para clicar para ler seus artigos ou páginas da web. Palavras-chave de alta prioridade devem aparecer o mais próximo possível do início do título, já que você não tem muito espaço para trabalhar. Além disso, cada página deve ter um único título para evitar confundir os mecanismos de busca e seus usuários.

Tag meta description

Uma meta descrição é o resumo curto que aparece nas SERPs abaixo do título. Suas páginas devem ter descrições únicas e precisas do conteúdo que contêm. Uma meta descrição deve ter entre 150 e 160 caracteres para evitar ser truncada nos resultados das buscas.

Infelizmente, nem sempre você pode ter controle sobre o que será sua meta descrição. Mesmo que você próprio as escreva, os mecanismos de busca ainda podem decidir que você forneceu informações que não eram relevantes e optar por reescrever suas meta descrições ou exibir o conteúdo incorreto da página.

Para adicionar a tag meta description à página de seu site, localize a seção do código HTML.

Uma meta descrição é uma informação importante para os mecanismos de busca e os usuários. Usar uma meta descrição eficaz pode promover mais cliques em seu site ao definir expectativas claras sobre o que os usuários podem encontrar.

Incluir palavras-chave segmentadas em sua meta descrição pode ajudar as pessoas a encontrar seu conteúdo mais facilmente, além de informar aos mecanismos de busca sobre o que a página é. Você também pode explicar o propósito da página e o que os clientes encontrarão ao clicar.

Você também pode realizar testes A/B em suas meta descrições para ver quais versões recebem mais cliques, ajudam você a se classificar melhor e, no final das contas, trazem mais tráfego para seu site. Aprenda como escrever uma descrição eficaz conferindo estes exemplos de meta descrições.

Tag meta robots

A tag meta robots instrui os mecanismos de busca sobre como rastrear seu site, indicando quais páginas você deseja que sejam classificadas e quais não. Existem muitos propósitos para essas tags, então você deve usá-las corretamente se quiser classificar certas páginas e ignorar outras.

As tags robots indicam aos mecanismos de busca se devem indexar ou seguir uma página, rotulando-as como INDEX e FOLLOW ou NOINDEX e NOFOLLOW. Quando você rotula uma página como INDEX, está informando aos mecanismos de busca que deseja que ela apareça nos SERPs. Entretanto, quando você diz para eles FOLLOW uma página, significa que você quer passar o PageRank para uma página específica.

Uma tag NOFOLLOW não é seguida; então, não pode transferir a classificação da página para nenhum outro tipo de página da web. Essas páginas ainda podem aparecer no índice do Google se outro site criar links para elas sem usar a tag NOFOLLOW. Outros mecanismos de busca podem ter regras diferentes para essas tags robot.

As tags robots podem ser algo assim:

No final das contas, as tags que você usa dependem de suas metas para uma página específica. A primeira linha de nosso exemplo instrui os mecanismos de busca a ignorar a página e os links contidos nela, tornando-a, em última análise, inútil para o tráfego de referência.

O segundo exemplo instrui os mecanismos de busca a ignorar a página, mas a seguir todos os hiperlinks dessa página, e o terceiro exemplo instrui os mecanismos de busca a indexar a página, mas a não seguir os hiperlinks da página que podem levar a outras páginas.

Cada uma das suas páginas deve ter uma tag meta robots, mas apenas uma tag por página. Você não usaria todas as três opções na mesma página.

Tag Open Graph

As tags Open Graph são usadas para compartilhar mensagens em plataformas de redes sociais como o Facebook. Se você quiser passar informações de um blog, como a imagem em destaque e um snippet, você usará a tag Open Graph. Essas tags informam de forma eficaz às plataformas de redes sociais o tipo de informação que você quer exibir ao compartilhar um link de seu site.

Você provavelmente já viu algumas tags Open Graph em ação. Toda vez que você compartilha um link de um site nas redes sociais, ele gera automaticamente uma visualização. Essa visualização é criada por meio da tag Open Graph. Existem muitas tags Open Graph que você pode escolher, mas elas aparecerão no HTML da seção head como

Suas opções para o que você pode incluir em um Open Graph incluem:

O título define a página da web e seu conteúdo. Você pode definir o título de seu Open Graph igual ao seu meta título ou alterá-lo conforme seu público nas redes sociais. Enquanto isso, a descrição funciona de forma semelhante a uma meta descrição, enquanto o tipo define o tipo de conteúdo. Por exemplo, o tipo pode se referir a uma música, um PDF ou uma imagem.

Além disso, a tag Open Graph image informa às plataformas de redes sociais qual imagem você quer puxar da página da web para servir como imagem da publicação, e a URL define o endereço da página que você está compartilhando. Se você quiser exibir o nome de seu site, pode fazer isso usando a tag site name, mas geralmente não é uma propriedade importante para usuários de redes sociais.

Tag meta keyword

A tag meta keyword é usada para descrever as palavras-chave em relação às quais você deseja classificar. No entanto, a maioria dos mecanismos de busca ignora essa tag; então, ela está se tornando mais obsoleta a cada ano.

Na verdade, se você abusar da tag meta keyword, poderá receber uma penalidade, impedindo você de se classificar para suas palavras-chave segmentadas. Quando usada corretamente, essa tag pode informar aos mecanismos de busca sobre o que é seu conteúdo, destacando palavras-chave importantes encontradas em sua página.

Infelizmente, o Google não utiliza a tag meta keyword, mas outros mecanismos de busca podem fazê-lo. Então, vale a pena levar em consideração se você quiser melhorar seu SEO usando mecanismos de busca que não sejam o Google.

No mínimo, usar a tag meta keyword pode ajudar você a acompanhar quais palavras-chave você está segmentando em diferentes páginas do site. A tag será mais ou menos assim:

Como os principais mecanismos de busca não utilizam mais a tag meta keyword como fator de classificação, não há necessidade de perder seu tempo ou adicionar mais código que possa deixar seu site mais lento. Em vez disso, você pode ignorá-la e focar nas tags meta que podem ajudar a melhorar a classificação e a experiência do usuário.

Outras meta tags HTML

Existem muitos outros tipos de meta tags que podem ser usadas na seção head ou body de um site. Essas outras meta tags têm diversos propósitos, desde evitar problemas de conteúdo duplicado até melhorar a acessibilidade e a experiência do usuário. Vamos dar uma olhada em algumas das meta tags adicionais mais úteis que você pode querer usar em seu site.

  • Tag canonical: a tag canonical é utilizada para indicar se existe uma versão original de uma página da web, informando aos mecanismos de busca que uma versão é a principal e as demais não devem ser indexadas. Isso pode impedir que você concorra consigo mesmo por classificações e evitar que conteúdo duplicado se torne um problema.
  • Tag alternative text: a tag alt-text ajuda os mecanismos de busca a ler imagens por meio de texto, já que eles não conseguem identificar a aparência de uma imagem. Ao escrever texto alternativo, sempre use descrições relevantes sem encher de palavras-chave. O texto alternativo é importante para leitores de tela, pois melhora a acessibilidade do site; então, deve fazer sentido para as pessoas.
  • Tags header: as tags header são usadas para alterar tamanhos de fonte e estruturar seu conteúdo. Essas tags variam de H1 (a maior) a H6 (a menor) e podem ajudar os leitores a escanear o conteúdo.
  • Tags language: a meta tag language informa aos mecanismos de busca qual é o idioma do conteúdo e identifica o país para melhorar os resultados da busca com base no idioma e na localização.
  • Tags author: as tags author mostram quem é o autor do conteúdo, o que pode ajudar a atender ao requisito de Experiência, Autoridade e Confiabilidade (EAT) do Google para classificar o conteúdo.
  • Data de publicação: a data da publicação pode ser usada em blogs para ajudar os usuários a entender o quanto as informações são relevantes e recentes. Saiba mais sobre metadados para postagens em blogs.
  • Style: a tag style contém código CSS para definir como os elementos de HTML devem aparecer nos navegadores.

Você deve ponderar os prós e contras de cada um ao considerar quais tags usar. Mais código em seu site pode afetar negativamente a velocidade de carregamento, impedindo que seu site carregue o mais rápido possível.

A velocidade da página define o tempo que uma página de seu site leva para carregar. Quanto mais tempo uma página demora para carregar, maior a probabilidade de os usuários desistirem, resultando na perda de tráfego na web e na oportunidade de você realizar uma venda.

Ao avaliar a velocidade de sua página, você deve considerar os usuários de desktops e dispositivos móveis. Usuários que usam seus dispositivos móveis para visitar sites são ainda menos pacientes; portanto, a velocidade de sua página móvel deve ser uma prioridade máxima para manter os usuários interessados em ler seu conteúdo.

A velocidade da página é um fator de classificação importante porque melhora a experiência do usuário. Quanto mais rápido uma página da web carrega, maior a probabilidade de um usuário ter uma boa experiência, permitindo que os mecanismos de busca entreguem melhores resultados para os usuários. A velocidade da página também impacta sua receita, pois uma página deve carregar rapidamente para manter seus clientes potenciais engajados no site, permitindo que eles aprendam tudo o que puderem antes da conversão.

Embora as meta tags também sejam essenciais para mecanismos de busca, é sempre melhor considerar aquelas de que você mais precisa. Discutimos as principais meta tags para usar em seu site para melhorar o SEO, mas adicionar mais código do que isso pode afetar a velocidade da página e ter um impacto direto em suas classificações.

Por que é importante adicionar metadados HTML na seção head do site

Os metadados só podem ser usados na seção head do site. Se você os colocar na seção body da página, eles aparecerão quando renderizados em um navegador, afetando a experiência do usuário e impedindo que os mecanismos de busca usem os dados de forma eficaz para classificar as páginas de seu site.

Se a sua marcação for inválida, os navegadores podem não renderizar suas páginas corretamente. Então, é sempre melhor manter as tags na seção head onde elas devem estar, já que esse é o único lugar onde os mecanismos de busca as procurarão.

Como as meta tags impactam o SEO e a experiência do usuário

As meta tags fazem muito mais do que apenas descrever seu conteúdo para os mecanismos de busca; elas influenciam diretamente como os usuários interagem com seu site antes mesmo de visitá-lo. Quando usadas corretamente, esses elementos de bastidores podem aumentar sua visibilidade, gerar mais tráfego e criar uma melhor primeira impressão.

Taxas de cliques nos resultados das buscas

Tags title e metadescrições são oportunidades para causar uma boa impressão quando alguém faz uma pesquisa no Google. Um título atraente e repleto de palavras-chave, junto com uma descrição clara e focada nos benefícios, pode aumentar o número de pessoas que clicam em seu site.

Mesmo quando sua página está bem classificada, meta tags ruins podem resultar em taxas de cliques mais baixas, pois os usuários escolhem concorrentes com descrições mais atraentes. Cada clique é um cliente em potencial, então criar meta tags que chamem a atenção vale a pena.

Capacidade de rastreamento e indexação

A meta tag robots informa diretamente aos mecanismos de busca quais páginas incluir nos resultados de pesquisa e quais ignorar. Sem instruções adequadas, os mecanismos de busca podem desperdiçar tempo rastreando páginas irrelevantes ou ignorar completamente seu conteúdo mais importante.

As tags canonical evitam problemas de conteúdo duplicado ao identificar a sua versão preferida de páginas semelhantes, concentrando o seu poder de classificação em vez de diluí-lo em várias URLs.

Essas meta tags técnicas garantem que os mecanismos de busca possam processar seu site de forma eficiente e classificar seu melhor conteúdo.

Aparência da visualização social

As tags Open Graph determinam como seu conteúdo aparece quando compartilhado em plataformas sociais. Sem essas tags, os sites sociais podem puxar textos ou imagens aleatórios que não representam bem seu conteúdo.

Meta tags sociais configuradas corretamente dão a você controle sobre quais imagens, títulos e descrições acompanham seus links nas redes sociais, tornando seu conteúdo mais atraente visualmente e clicável.

Erros comuns que devem ser evitados com as meta tags

Muitos proprietários de sites se apressam na implementação de meta tags ou confiam em práticas ultrapassadas que podem prejudicar seus resultados de SEO. Esses erros técnicos podem impactar drasticamente como os mecanismos de busca interpretam seu site e se os visitantes clicam em seu conteúdo. Antes de finalizar sua estratégia de meta tags, fique atento a estes três erros comuns:

Usar títulos ou meta descrições duplicados

Cada página de seu site tem um propósito único; então, usar meta tags idênticas em várias páginas confunde tanto os usuários quanto os mecanismos de busca. Títulos e descrições duplicados dificultam que os mecanismos de busca entendam o que diferencia suas páginas e podem levá-los a escolher eles mesmos qual página classificar.

Dedique tempo para escrever informações meta descritivas e únicas para cada página, destacando o que torna cada uma valiosa e distinta das outras em seu site.

Inserção de palavras-chave em meta tags

Encher suas meta tags com palavras-chave demais na esperança de obter classificações mais altas nos mecanismos de busca, na verdade, tem o efeito contrário. Os mecanismos de busca reconhecem essa tática ultrapassada e podem penalizar seu site por isso.

Mais importante ainda, títulos e descrições repletos de palavras-chave soam artificiais para os usuários, reduzindo as taxas de cliques. Em vez disso, escreva meta tags claras e atraentes que usem suas palavras-chave principais naturalmente enquanto descrevem com precisão o conteúdo de sua página.

Negligenciar os metadados de compartilhamento móvel e social

Muitos proprietários de sites otimizam suas meta tags para resultados de pesquisa tradicionais, mas esquecem como o conteúdo aparece em dispositivos móveis ou quando é compartilhado em redes sociais.

Os resultados de pesquisa em dispositivos móveis geralmente exibem menos caracteres, tornando essenciais as meta tags concisas e com conteúdo destacado no início. Da mesma forma, deixar de implementar as meta tags Open Graph e Twitter Card significa perder oportunidades de controlar como seu conteúdo aparece quando compartilhado.

Sempre visualize como suas meta tags aparecem em diferentes plataformas para garantir que sejam eficazes em todos os lugares onde seu público possa encontrar você.

O que lembrar sobre meta tags

Os metadados podem ajudar a elevar seu SEO a um novo patamar, permitindo que você crie seus próprios títulos e descrições e instrua os mecanismos de busca sobre como interagir e compreender seu site. Infelizmente, trabalhar com código HTML pode ser complicado se você não for um desenvolvedor da web. Felizmente, essa não é a sua única opção.

Se você tem um site WordPress, pode usar plugins de SEO para facilitar a adição de tags, ou pode usar os serviços de marketing do Mailchimp. Ao criar um site com o Mailchimp, você pode escrever suas próprias meta tags para seu site, incluindo meta títulos e meta descrições, para ajudar a melhorar seu posicionamento nos mecanismos de busca e atrair mais tráfego para o site.


Principais conclusões

  • As meta tags são snippets HTML usados pelos mecanismos de busca para classificar suas páginas da web.
  • Meta tags implementadas corretamente podem melhorar a visibilidade de seu site nos resultados de busca, aumentar as taxas de clique e controlar como seu conteúdo aparece nas redes sociais.
  • Embora adicionar meta tags exija conhecimento básico de HTML, ferramentas como plugins tornam a implementação acessível mesmo sem conhecimento técnico especializado.

Compartilhar este artigo