Dados estruturados e Rich Snippets, se você está sempre buscando melhorar a presença do seu site no Google, provavelmente você já ouviu falar sobre Dados estruturados e sua relação com os “Rich Snippets” e o imenso impacto que isso traz nos resultados de busca.
Fazendo uma breve introdução sobre o assunto.
Dados estruturados e Rich Snippets
Dados estruturados são marcações “atributos” aplicados em Tags no HTML de uma página.
O objetivo dessas marcações ou atributos nos elementos HTML é de passar aos buscadores e outros sistemas de processamento de HTML algumas informações adicionais sobre o conteúdo que está na página.
Por exemplo, você pode identificar um endereço na sua página, um ator, artigos, noticias, eventos. Em lojas virtuais o dado estruturado pode ser utilizada para marcar o preço, feedbacks, ratings, disponibilidade de estoque e ai por diante.
Embaixo, um exemplo de HTML com as marcações para definir um artigo “Article” que estou utilizando em alguns Post aqui do Blog.
<div>
<div>Resumo</div>
<div itemscope="" itemtype="http://schema.org/Article">
<div itemprop="image" itemscope="" itemtype="https://schema.org/ImageObject">
<img width="180" src="http://rogertakemiya.com.br/wp-content/uploads/2016/12/email-markup-markup-tester-google-webmaster-developers.png">
<meta itemprop="url" content="http://rogertakemiya.com.br/wp-content/uploads/2016/12/email-markup-markup-tester-google-webmaster-developers.png">
<meta itemprop="width" content="800">
<meta itemprop="height" content="800">
</div>
<div class="aio-info">
<div class="snippet-label-img">Nome do Artigo</div>
<div class="snippet-data-img"><span itemprop="headline">Email Markup e Markup Tester, marcações Schema.org no seu email</span></div>
<div class="snippet-label-img">Descrição</div>
<div class="snippet-data-img"><span itemprop="description">Utilize Email Markup e Markup Tester, faça marcações Schema.org nos e-mail enviados e aumente a interação dos usuários com seu conteúdo.</span></div>
<div class="snippet-label-img">Autor</div>
<div class="snippet-data-img" itemprop="author" itemscope="" itemtype="https://schema.org/Person">
<span itemprop="name">Roger Mauricio Takemiya</span>
</div>
<div class="snippet-label-img">Editor</div>
<div itemprop="publisher" itemscope="" itemtype="https://schema.org/Organization">
<div class="snippet-data-img">
<span itemprop="name">Roger Mauricio Takemiya</span>
</div>
<div class="snippet-label-img">Logo do Editor</div>
<div class="snippet-data-img" itemprop="logo" itemscope="" itemtype="https://schema.org/ImageObject">
<img width="180" src="http://rogertakemiya.com.br/wp-content/uploads/2016/12/logo-min.png">
<meta itemprop="url" content="http://rogertakemiya.com.br/wp-content/uploads/2016/12/logo-min.png">
<meta itemprop="width" content="800">
<meta itemprop="height" content="800">
</div>
</div>
<meta itemscope="" itemprop="mainEntityOfPage" itemtype="https://schema.org/WebPage" itemid="http://rogertakemiya.com.br/email-markup-e-markup-tester/">
<meta itemprop="datePublished" content="2016-12-19T10:59:03+00:00">
<meta itemprop="dateModified" content="2016-12-19T11:04:08+00:00">
</div>
</div>
</div>
Se você analisar com calma o HTML acima, verá alguns atributos nas tags “span”.
- itemscope
- itemprop
- itemtype
Esses atributos são utilizados para definir o que está dentro daquela Tag.
Obviamente existe um padrão a ser seguido e é ai aonde entra o Schema.org.
Mais sobre o Schema.org
Schema.org é uma organização com objetivo de definir um padrão para as marcações utilizadas nos Dados Estruturados.
Ela é mantida por empresas como a Google, Microsoft, Yahoo, etc, com esse claro objetivo de unificar e padronizar todas as marcações possíveis.
Facilitando o trabalho para elas, que utilizam os dados estruturados em suas ferramentas e para nós desenvolvedores, que adotamos um único padrão.
A lista de marcações possiveis é extensa, você pode acessa-la neste link: Full Hierarchy – http://schema.org/docs/full.html
Rich Snippets nos resultados de busca
Exemplo de Rich Snippets:
Como você pode ver na imagem acima, utilizando corretamente as marcações de dados estruturados, a Zoom consegue passar varias informações importante sobre o produto para o Google.
Em posse dessa informação, o Google personaliza o “snippet” de busca, “enriquecendo” o resultado para o usuário, por isso chamamos de “rich snippets”.
Utilizando os dados estruturados corretamente e acionando os “Rich Snippets” no Google, você poderá atrair mais clicks e conversões para seu site com custo zero.
Como posso utilizar os dados estruturados e Rich Snippets?
A tarefa não é simples, na maioria dos casos você irá precisar da ajuda de um desenvolver para personalizar o HTML gerado pelo o seu Site.
Em geral às adaptações necessárias para utilizar as marcações da forma correta não são tão complexas, porém requer um conhecimento profundo sobre a linguagem de programação que foi utilizada no desenvolvimento do site.
Em sites que utilizam o HTML “puro” é bem simples a implementação, basta você alterar os arquivos “.html” e você já estará realizando as marcações para estruturar os dados.
Em sites que possuem um “backend”, página administrativa para gerenciar o conteúdo a tarefa se torna mais árdua, pois além da linguagem de programação adotada, será necessário um conhecimento profundo sobre o sistema que gerencia o site.
Existe alguns atalhos para as grandes plataformas.
Para usuários do WordPress, é possível obter os dados estruturados utilizando Plugins específicos como: All In One Schema.org Rich Snippets
O Magento também possui vários módulos que irão fazer isso para você, clique aqui para ver os módulos disponíveis no Magento Connect.
É muito difícil alguma plataforma de CMS ou Comércio Eletrônico não fornecer suporte para Dados Estruturados, faça uma rápida busca no Google e com certeza você encontrará extensões para sua ferramenta.
Como validar e testar os dados estruturados
Uma vez que suas páginas estão com os dados estruturados implementados, você pode valida-los utilizando essa ferramenta: Ferramenta de teste de dados estruturados – https://search.google.com/structured-data/testing-tool.
É uma ferramenta bem simples, basta colar a URL dá página com as marcações e clicar no botão Realizar Teste.
Uma vez o teste concluído, será exibido todos os itens encontradas na página e se existe a necessidade de corrigir alguma marcação.
Uma outra forma de saber se as suas páginas estão apresentando algum tipo de erro nos Dados Estruturados é pelo Webmaster Tools (Search Console), indo na opção Aspecto de Pesquisa, Dados estruturados.
O único problema de utilizar essa funcionalidade do Webmaster Tools é a demora para atualizar os dados com o feedback dos itens com erros encontrados.
Conheça mais sobre Search Console da Google: Google Search Console para seu site, configurando a conta e propriedade
2 comentários sobre “Dados estruturados, Rich Snippets e testando a página no Google”