Implementando Dados Estruturados

Os Dados Estruturados ocupam um lugar muito importante em um projeto de SEO e em geral em uma Estratégia de Marketing Digital.

Ele são um meio de ajudar os motores de busca a entenderem melhor o conteúdo da nossa página.

Dessa forma, conseguimos ter mais relevância na pesquisa do usuário.

Mas como implementar Dados Estruturados?

Caso você ainda não tenha lido nosso post sobre Dados Estruturados, clique no link e saiba mais antes de prosseguirmos com nosso artigo. ; )

O que são os Dados Estruturados?

Por diversas vezes, quando pesquisamos algo no Google, são retornadas páginas que podem conter respostas para nossa busca.

Essas, contém definições, títulos, explicitando sobre o que sua página ou site trata.

Por exemplo, vamos supor que você pesquisou no Google receitas para bolo de chocolate.

Vão aparecer diversas receitas, que estão em sites diferentes muitas vezes. No entanto, todas contém informações parecidas, como o título da receita, os ingredientes da receita, o modo de preparo, e assim por diante. Os dados estruturados, nada mais são do que a identificação  para o motor de pesquisa sobre o que cada informação da sua página significa. É como se você especificasse para o motor de busca dizendo: Aqui é o meu título, aqui são os ingredientes, aqui é o modo de preparo.

E por que fazer isso?

Para que a sua página seja mais eficiente nas pesquisas, o que melhora a qualidade de pesquisa do usuário.

Afinal, se ele procura um determinado assunto, o motor de busca consegue identificar mais fácil na sua página, provavelmente seu resultado será atribuído de uma forma melhor do que o de outros, não é mesmo?

Caso queira saber mais sobre como otimizar seu site e seus resultados nas pesquisas, leia nosso artigo sobre o Google Search Console!

Vou deduzir que você deve estar gostando da ideia de o usuário acessar a sua página e não a dos outros e também deve estar pensando: Legal!

Mas como eu faço isso??

Tenha calma rs, vamos descobrir isso já já.

Em um contexto mais amplo, além de ser essa definição de informações sobre o que sua página trata, também é uma especificação de contextos.

Por exemplo, ajudando a identificar de quando determinado conteúdo é, ou então mostrando imagens da sua página junto aos resultados da pesquisa.

Como surgiu a ideia dos Dados Estruturados?

Os Dados Estruturados são determinados com base no schema.org.

E o que ele seria?

Basicamente, é um grande catálogo dos Dados Estruturados que são aceitos mostrando como você pode utiliza-los.

Sendo uma comunidade colaborativa, tem a participação do Google, Yahoo, Microsoft e Yandex. Ou seja, esta prática está fortemente incentivada por grandes empresas do mercado de TI.

No site, você encontrará uma imensa diversidade de possíveis estruturas que podem ser implementadas.

Sempre visando facilitar a identificação dos dados da sua página para o motor de busca, e claro, para que estes possam disponibilizar a informação que tem de uma forma mais relevante para o seu usuário.

Como implementar Dados Estruturados ou Rich Snippets em uma página?

A implementação dos Dados Estruturados pode ser efetuada de duas formas, tanto por código quanto pelo uso de ferramentas.

No segundo caso, o foco está em simplificar o trabalho ao realizar a implementação.

Como faço a Implementação Manual de Dados Estruturados ou Rich Snippets?

Para implementarmos manualmente o código dos dados estruturados, podemos faze-lo utilizando o JSON-LD.

Mas por que usar o JSON-LD para implementar Dados Estruturados?

Simplesmente pelo fato dele gerar um script que pode ser inserido na página sem a necessidade de alterar a estrutura HTML da mesma ao adicionar atributos extras a cada tag que seja necessária.

Portanto, isso já facilita em muito a implementação do código em si.

Outro fator que influência muito na escolha do JSON é que o Google, assim como a W3C, indicam seu uso como recomendado.

O que é o formato Microdata?

De uma forma simples e rápida de explicar, Microdata permite que você insira  a identificação dos dados diretamente no seu código HTML5.

Assim, a cada div ou section, ou article -ou a tag que for- será possível utilizar os atributos itemscope, itemtype e itemprop.

• O atributo itemscope serve para você identificar de forma mais abrangente, qual a delimitação do item que você está falando. Sendo assim caso coloque-o em uma tag <div></div>, apenas o conteúdo pertence a ela será o foco do assunto que você está enfatizando. Vamos entender melhor com a próxima propriedade.
• O atributo itemtype irá identificar qual é exatamente o assunto que ela trata. Isso ocorre identificando pela url de qual sessão está sendo utilizada do schema.org. Por exemplo,

<div itemscope itemtype= “http://schema.org/Movie” ></div>, identificando aqui, uma sessão de filmes.

• E por fim, o itemprop será responsável por informações adicionais do tipo de item. Como por exemplo, seguindo o contexto de filme, você pode identificar em uma tag <h1> dentro da tag <div> que este é o nome do seu filme, assim: <h1 itemprop=”name”>Nome do Filme</h1>

O que é o formato RDFa?

Sigla para Resource Description Framework in Attributes. Semelhante com Microdata, mas, contém uma estrutura diferente.

Você também vai adicionar atributos no seu código HTML5, porém o fará com os atributos vocab, typeof, property e content.

• O vocab, você utilizará para definir a qual fonte você está utilizando, por exemplo vocab=”http://schema.org/”.
• Já no typeof você especificará qual é a categoria que está selecionando.  No exemplo do filme, especificando <div vocab=”http://schema.org/”><span typeof=”Movie”></span></div>.
• Com o property definiremos, assim como o nome já indica, qual a propriedade. Por exemplo: <p property=”name”>Nome do Filme</p> . E em complemente, adicionamos o content. Especificando assim: <p property=”name” content=”Nome do Filme”>Nome do Filme</p>

Como Facilitar a implementação dos Dados Estruturados?

Pode-se imaginar que nem todos gostam de programar ou codificar.

Sendo assim, como implementar Dados Estruturados no seu site sem mexer no código?

Existem ferramentas que podem fazer isso por você, como é o caso do Assistente de Marcação de Dados Estruturados do Google Search Console.

Funcionalidades do Assistente de Marcação de Dados Estruturados do Google

O Google – como sempre – oferece uma ferramenta que não apenas facilita a implementação de Dados Estruturados.

Mas também ajuda na sua criação.

Sim, é isso mesmo, ela facilita a criação! Como?

Trabalhando de fato, como uma “marcação” dos dados. Para acessá-la, você precisa:

• acessar sua propriedade  no Google Search Console:
• Acessar o menu Aspectos da pesquisa;
• acessar o Marcador de dados e aqui está a ferramenta.

Para começar a marcar, você precisa inserir a URL  do seu site, para que ele possa pegar as páginas necessárias.

Feito isso, você precisa definir sobre o que seu site fala, dentro das opções oferecidas pelo marcador.

Decorrente disso, temos finalmente a parte interessante da ferramenta.

Ela possibilita que, você selecione a informação e identifique qual o seu contexto.

Ou seja, você seleciona o texto da informação, e escolhe “esse é o título” ou “essa é uma imagem”.

Bem simples né? Assim você adicionará os Dados Estruturados Ao seu site de forma simples e fácil.

E claro, com toda a certeza, de forma bem mais fácil do que seria inserir-los no seu código fonte né!?

Schema.org VS Assistente de Marcação de Dados Estruturados

Agora fica a dúvida, apenas pelo fato da facilidade e simplicidades deve-se utilizar sempre a ferramenta do Google? Infelizmente não.

Não podemos negar que essa ferramenta poupa uma quantidade de tempo assombrosa.

No entanto, ela tem uma quantidade de vocabulário de especificação de páginas muito pequena, se comparada com o total de categorias que é possível definirmos a partir do Schema.org.

Não ficou muito claro?

Vou demonstrar o que quero dizer.

Veja a imagem abaixo: Essas são as categorias que você pode utilizar pela ferramenta do Google.

Você não encontrou uma categoria na qual seu site ou seus conteúdos se encaixem?

Não tem problema. isso é normal.

Você está limitado em opções, seu site não é um problema rs.

Funcionalidades do Schema.org

Agora vamos fazer um rápido tour pelo site do schema.org pra aprender um pouco mais sobre suas funcionalidades básicas.

• Aqui, temos a página inicial, essa que acessaremos assim que entrarmos no site.

• Acessando a aba Documentation, você terá acesso, a documentação, mas não apenas a ela. Nesta aba é tratada grande parte da documentação da iniciativa do projeto em si.

Sendo assim, teremos nela uma boa explicação desde como ocorre a sua implementação a até mesmo coisas como o que é o projeto, sobre o que ele trata, quais as perguntas mais frequentes. Ou mesmo, tópicos voltados para desenvolvedores e explicações sobre modelos específicos de alguns esquemas fornecidos pelo site.

• Acessando a aba Schemas, teremos o início tratando de como as categorias estão organizadas. Você pode tanto optar por visualizar um tipo por página, quanto visualizar todos eles – o que eu particularmente julgo loucura – de uma só vez. : )

Também são fornecidos os tipos mais usados de categorias para você. Visando claro, facilitar o seu trabalho em chegar no ponto que você precisa.

Schemas por página e Lista Completa de Schemas

Nos esquemas por página, será concentrada a maior quantidade de informação possível a respeito daquele esquema.

Aqui você pode ver que temos uma tabela.

E sim, ela contém muuuitas informações.

Em informações gerais do site, é informado qual esquema está sendo abordado, qual a sua URL representativa  – aquela que você vai informar para dizer  sobre o que está falando –  e a tabela.

Mas, basicamente, essa tabela contém a propriedade que ela está falando, sua descrição e o tipo esperado de dados que ela representará.

Assim, seguindo nosso exemplo, é dito quais as propriedades do esquema Thing.

Ele pode ter uma imagem, identificador, qual a URL que você está abordando, caso queira usar algum esquema mais específico de Thing, e assim por diante.

Caso esteja um pouco confuso, vamos dar uma olhadinha agora em todos os esquemas juntos para você entender do que eu estou falando.

Aqui, podemos ver a lista completa – ou quase – de esquemas fornecidos pelo schema.org.

Você tem a opção de visualizar apenas o vocabulário principal ou visualizar também todas as extensões.

Você pode observar, que elas estão alinhadas de forma hierárquica. Por quê?

Porque simplesmente cada categoria de schema tem as suas subcategorias. Basicamente sendo especificações de contexto.

Lembra que comentamos a respeito da ferramenta do Google ser um pouco limitada?

Era disso que estávamos falando.

Veja quantas opções você tem aqui, enquanto que o Google, apenas disponibiliza aquela pequena lista.

Seguindo a lógica, analisando essa estrutura você pode checar qual o melhor schema você pode implementar.

É claro que, tendo uma visão do todo fica bem mais fácil enxergar por partes o que é preciso.

Gostou do post? Ficou com alguma dúvida? Deixe seu comentário ou entre em contato com a gente! Até a próxima!! : D