Tags Metatags e Structured data

O que diabos são os Tags, Meta Tags e Structured Data?


Primeiro: o que são as tags? Uma tag é um pequeno trecho de código (muitas vezes de uma linha só) inserido no início da programação da página web (no chamado cabeçalho da página) que ajuda o seu navegador identificar informações importantes sobre a página que está sendo apresentada. Por exemplo, as tags fornecem informações sobre a língua da página, o que contém a página, o formato do texto, etc.

Existem dois tipos de tags. Tem as Tags (sim, somente tags) e as Meta Tags. E tem pouca diferença entre elas. Devemos lembrar que bem no início do desenvolvimento da internet as pessoas não podiam ver todas as possibilidades do que a internet viraria. Então, algumas tags foram desenvolvidas antes mesmo de termos definidos o termo Meta Tags, que agora é o padrão para a transmissão de informações entre a página e o navegador. A única diferença entre os dois tipos de tags e a inclusão da palavra ‘meta’ na própria tag.

Como exemplo, a tag do título (a ‘title tag’ em inglês) não inclui a palavra meta:

<title>O título do seu site</title>, mas a Description Meta Tag (ou na sua forma mais comum, a Meta Description Tag) fica <meta name=”description” content=”conteúdo que você quer que apareça nas buscas.”>.

Structured data (“dados estruturados” na tradução literal) é diferente e geralmente no formato JSON-LD* (recomendado) ou Microdata (que utiliza HTML tag attributes para nomear as propriedades que você quer que seja lida como structured data.) A principal função do structured data é para fornecer para o Google informações adicionais sobre a proposta da página e as informações importantes que você quer que o Google disponibilize nos resultados de uma busca.

Um exemplo seria utilizar structured data numa uma página de uma receita para bolo de café (eu adoro de bolo de café!). Assim quando eu estiver buscando informações sobre como fazer doce de banana, eu vejo não somente o título e a descrição da página, mas várias informações sobre quais os ingredientes da receita, modo de preparo, quanto tempo leva para preparar o prato, quantas calorias, as imagens do prato, etc.

Tags, Meta Tags e Structured Data - Uma explicação de como funciona

Um dos principais benefícios de utilizar structured data é que o Google pode escolher destacar a página nos resultados da busca incluindo as imagens e os dados fornecidos no structured data. Veja as informação na página do Google developers: https://developers.google.com/search/docs/data-types/recipe?hl=pt-BR

As meta tags que você não pode de jeito nenhum esquecer!

Tem algumas tags que você não pode esquecer. Deixando essas tags for do seu site, ou deixar elas mal configuradas, é igual dizer pra Google que você não quer que seu site e as páginas sejam mostradas nos resultados das buscas.

A Meta Content-Type Tag

Essa tag é essencial para declarar o conjunto de caracteres da sua página e tem que existir em todas as páginas do seu website. Como exemplo, se seu site está escrito em português, você pode utilizar o seguinte código para a Meta Content-Type Tag:

<meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8″ />

O conjunto de caracteres UTF-8 suporta algo em torno de um milhão de caracteres e consegue mostrar os acentos e outros caracteres especiais da língua portuguesa (além das caracteres especiais de quase todas as outras línguas como chinês, hebraico e árabe etc.)

Você pode escolher um encoding de caracteres do texto diferente dependendo da sua necessidade, mas a UTF-8 deve funcionar a maioria das vezes. É importante verificar que a Meta Content-Type Tag do seu site está com o encoding certo.

A Title Tag (A tag do título do seu site)

Essa é uma das tags que não inclui a palavra meta, porém, ela é uma das tags mais importantes do seu site, principalmente para a otimização do seu site para as ferramentas de busca (SEO) e a apresentação do seu site nos resultados das buscas.

A title tag é o elemento que especifica o título de uma página web. É justamente este título que o Google usa para identificar o assunto da página e depois mostrar para seus usuários nos resultados de uma busca. Então, se seu página é sobre Posicionamento Técnico no Mundo Digital, Tags, Meta Tags e Structured Data (como essa página), o Title Tag deve ter o seguinte formato:

<title>Posicionamento Técnico no Mundo Digital, Tags, Meta Tags e Structured Data</title>

Existe um limite no número de letras no Title Tag, aproximadamente 50–60 caracteres, então neste exemplo em cima é bem provável que só vão aparecer as palavras “Posicionamento Técnico no Mundo Digital, Tags, Meta Tags e…” e neste caso seria bom avaliar uma forma de encurtar a Title Tag.

A Meta Description Tag

A meta description tag é de primordial importância para as páginas do seu website. A função dessa tag é para apresentar uma descrição do que o usuário vai encontrar na página e é utilizado por as ferramentas de busca logo abaixo do título da página nos resultados de uma busca.

Um exemplo da Meta Description para essa página seria:

<meta name=”description” content=”Tags, Meta Tags e Dados Estruturais são super importantes para o ranqueamento do seu site no Google. Neste artigo explicamos quais dessas tags você deveria estar utilizando com alguns exemplos práticos de como usar.”>

Embora este texto não seja analisado para influenciar o ranqueamento do seu site, a forma que você escreve o texto vai influenciar se um usuário vai escolher clicar ou não clicar o link para sua página e quantidade de cliques para seu site que tem uma influência enorme na sua posição (ranqueamento) no Google.

Tags e Meta Tags

Então pense bem no texto que você vai colocar na Meta Description Tag. Utilize-a para vender sua página. O texto deve ter menos que 160 caracteres (mas em algumas instâncias pode ter até 300 caracteres) e deve captar a atenção do usuário para incentivar ele a clicar no link. Pois quanto mais cliques no link, quanto mais o Google vai mostrar sua página nos resultados da busca.

A Viewport Tag

Num mundo digital cada vez mais dominado pelos smartphones, você tem que especificar qual seria a janela de visualização. O principal objetivo da Viewport tag e garantir que a experiência do usuário seja otimizada em dispositivos de todos os tamanhos, seja em uma tela de alta resolução de 5.120 pixels de largura (iMac de 27 polegadas com 5K Retina Display) ou um smartphone com uma largura de 800 pixels.

A tag padrão é:

<meta name=viewport content=”width=device-width, initial-scale=1″>

As Open Graph (OG) Meta Tags para as Mídias Sociais

As mídias sociais, querendo ou não, fazem parte do nosso dia-a-dia. Porém, quando o Facebook começou, não tinha a integração com as páginas e websites tradicionais. Então, o Facebook introduziu o Open Graph em 2010 com objetivo de promover a integração entre o Facebook e os outros sites para permitir que as informações dos sites conseguissem ter as mesmas funcionalidades e trocar as informações com o Facebook.

Logo as outras mídias sociais como Linkedin, Google+ e Twitter começarem a aproveitar dessas Open Graph tags e alguns, como Twitter, desenvolveu suas próprias tags.

As Open Graph tags são objetos gráficos ‘ricos’ que incluem imagens, vídeos e outras informações similar ao Structured Data utilizado pelo Google. Na verdade os dois elementos são muito similares, a principal diferença é que o Structured Data tem foco nas ferramentas de busca enquanto as Open Graph tags focam nas mídias sociais.

As Open Graph tags permitem que as empresas controlem como as informações dos seus sites são exibidas quando um link é compartilhado nas mídias sociais. Isso é benéfico do ponto de vista da marca, pois facilita o compartilhamento e o envolvimento do conteúdo em suas páginas em cada uma dessas plataformas independentes.

Se uma página que for compartilhada não tiver as Open Graph tags, o mais provável é que a primeira imagem e um trecho do primeiro parágrafo sejam utilizados. Twitter vai compartilhar somente o endereço web (url).

Segue um exemplo das Open Graph tags que possam ser utilizadas para essa página:

<meta property=”og:title” content=”Posicionamento Técnico no Mundo Digital, Tags, Meta Tags e Structured Data” />

<meta property=”og:description” content=”Tags, Meta Tags e Dados Estruturais são super importantes para o ranqueamento do seu site no Google. Neste artigo explicamos quais dessas tags você deveria estar utilizando com alguns exemplos práticos de como usar.” />

<meta property=”og:image” content=”https://loft44.com.br/#########.jpg”>

<meta property=”og:site_name” content=”Loft44 | Movidos por dados. Inspirados por design. Seja bem vindo!”/>

<meta property=”og:url” content=”https://loft44.com.br/posicionamento-tecnico-no-mundo-digital” />

As Meta Tags não essenciais

Sim, tem algumas tags que não são essenciais, mas mesmo assim, é importante ter conhecimento delas e saber o que elas fazem, como elas funcionam e quando você deve utilizar.

A Canonical tag

A tag canônica, embora não seja essencial, é importante de se entender como e quando usar. Se você fizer a configuração incorretamente você pode perder visibilidade nos resultados de busca (além de causar alguns problemas em seu site). A canonical tag é a melhor maneira de evitar problemas de conteúdo duplicado quando você tiver páginas com conteúdo similar.

Um exemplo do código para a canonical tag é:

<link rel=”canonical” href=”https://www.exemplo.com” />

A Robots Meta Tag

Pra quem não sabe ou nem ouviu falar ainda, robôs no mundo web são pequenos programas escritos para seguir todos os links da internet e ler todos os dados que eles encontram. E tem um – e somente um – uso para a Robots Meta Tag: para impedir que os robôs das ferramentas de busca leiam as páginas do seu site e mostram seu site nos resultados de busca. Isso é feito muitas vezes durante o desenvolvimento de um novo site quando você não quer que o Google mostre um site incompleto para possíveis clientes.

Em termos de indexação e acompanhamento de links, se você não especificar uma tag meta robots, as ferramentas de busca vão ler todos os dados, páginas, links e tags do seu site e indexar tudo nos bancos de dados delas. Somente se você quiser impedir os robôs de disponibilizarem o seu site em ferramentas de busca é que você precisa adicionar a Robots Meta Tag.

Uma anotação importante: os robôs podem ignorar sua tag, especialmente os robôs de malware e vírus que circulam na internet em busca de vulnerabilidades de segurança nos sites ou os robôs coletores de endereços de e-mail que são usados ​​pelos spammers.

O formato dessa tag é:

<meta name=”robots” content=”noindex, nofollow”>

A Language Meta Tag

A principal função dessa tag é declarar o idioma principal usado na página quando você tem um site em duas ou mais línguas ou se você está se mudando para um outro país com uma outra língua. As ferramentas de busca procuram sempre a tag http para definir a língua, mas sem a http-lang tag a Language Meta Tag é utilizada. Sem nenhuma dessas 2 tags as ferramentas de busca geralmente conseguem identificar as língua de um site dos textos.

O formato da Language Meta Tag é:

<meta http-equiv=”Content-Language” content=”en, pt-br, es”>

A Keywords Meta Tag

Sim, eu incluí essa Meta Tag na lista. Mas não porque você deve ou não deve utilizar. Incluí a Keywords Meta Tag para ilustrar o quanto o Google (e as outras ferramentas de busca) tem desenvolvido seu algoritmo de busca. Antigamente essa tag era a mais importante de todas, pois o Google usava essa tag para identificar as palavras chave do texto. Não mais. O Google agora lê, análisa, categoriza e classifica seu site sem prestar o mínimo atenção dessa tag.

Mesmo assim, tem algumas ferramentas de SEO que ainda utilizam, mas deixe pra lá. Ter ou não ter a Keywords Meta tag no seu site não afeta seu ranqueamento no Google e, se alguém chega com o papo furado que você está perdendo visitas por não ter essa tag, pode desconfiar, pois ou essa pessoa está muito desatualizada ou ela está tentando te enganar. Dois motivos fortes para não trabalhar com ela.

Um exemplo da Keyword Meta Tag:

<meta name=”keywords” content=”SEO, Posicionamento, Tags, Meta Tags, Structured Data, OG, Open Graph”/>

As Outras Tags

Sim, tem mais (e bastante). Mas você não vai perder nada se você não as incluir.

Como implementar as Tags

O mais fácil é usar um plugin (tem muitas opções de plugins para WordPress, Joomla e os outros CMSs). Se seu site estiver no WordPress sugerimos o Yoast SEO. A versão gratuita do plugin tem tudo que você precisa para começar. Se você faz parte da minoria que não utiliza um CMS para seu site, então, infelizmente, você tem que incluir a programação manualmente.

Quer saber se as tags, meta tags e structured data foram implementadas da forma correta no seu site? Solicite uma análise da sua estrutura digital preenchendo o formulário no link logo abaixo.

Diagnóstico de sua estrutura digital

Solicite gratuitamente uma análise personalizada da Loft44.
Agendar um horário

Compartilhar:

Compartilhar no facebook
Compartilhar no google
Compartilhar no twitter
Compartilhar no linkedin

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

seja nosso próximo case

Sobre a Loft44

A Loft44 surgiu da paixão pelo mundo digital, da necessidade de colaborar na construção de negócios relevantes e do desejo de ajudar as marcas a estabelecerem uma relação mais valiosa com o consumidor. Essa é a filosofia que guia a maneira como nossa equipe e nossos clientes pensam.

Mais populares

ORÇAMENTO PARA UM WEBSITE EM WORDPRESS ONLINE
ADWORDS - CALCULADORA DE CLIQUES ONLINE
MATERIAIS DE APOIO DE MARKETING DIGITAL