Entendendo o Schema.org e conhecendo o Google Structured Data Markup Helper

Schema.org

Neste post vamos analisar a documentação do Schema.og que é uma marcação de dados estruturada utilizada em código HTML para marcar determinadas informações no seu código que definem por exemplo quem é você, que serviços você fornece entre outras informações configuráveis.

O que é o Schema.org

Schema.org é um site que reuni uma coleção de schemas pré configurados que te ajudam a classificar uma página da web, dentro do assunto da mesma para facilitar a visualização de informações relevantes em seu conteúdo e melhorar a visibilidade do mesmo em resultados de pesquisa.

Muitos mecanismos utilizam essa marcação de dados estruturados para agrupar informações, não só mecanismos de busca, portanto vale se atentar a essa marcação em qualquer projeto web que vise visibilidade online.

Como utilizar os schemas

Primeiro vamos acessar o site do Schema.org e verificar sua documentação. Os schemas trabalham em conjunto com o código HTML da sua página, eles especificam parâmetros do código que de alguma forma dizem algo sobre o seu site que para os mecanismos de buscas pode ou precisam ser relevantes.

A parametrização é elaborada de acordo com seções do website, portanto primeiro você declara uma categoria e depois declara os elementos da mesma, isso evita conflito de informações ou a exibição de parâmetros que não valem nada ou repetidos.

Por exemplo:

Código sem adição dos schemas:

 
<a href="category/books.html">Books</a> >
<a href="category/books-literature.html">Literature & Fiction</a> >
<a href="category/books-classics">Classics</a>

Com a adição dos schemas:

 
<body itemscope itemtype="http://schema.org/WebPage">
 ...
 <div itemprop="breadcrumb">
 <a href="category/books.html">Books</a> >
 <a href="category/books-literature.html">Literature & Fiction</a> >
 <a href="category/books-classics">Classics</a>
 </div>
 

Note que foram adicionadas duas <div> para que seja informado o tipo da parametrização que seria utilizado, que caracterizam informações relevantes para motores de busca como as categorias do site dentro de uma seção especifica

O projeto da exemplos de parametros que deve ser adicionas para diversos tipo de paginas web, relacionados por assunto, você só precisa analisar o que mais se enquadra ao seu projeto e adicionar os parametros, de preferencia, enquanto estiver sendo desenvolvido o projeto.

Conhecendo o Google Structured Data Markup Helper

O Google lançou recentemente uma ferramenta que ajuda você a efetuar essas marcações no seu código apenas acessando a pagina em questão e selecionando os elementos e atribuindo os mesmos a cada categoria do website.

Se você analisou a documentação do Schema.org, deu pra notar que algumas coisas parecem confusas para desenvolvedores menos experientes ou de primeira viagem, então essa ferramenta do Google vai ajudar e muito você a entender e a adicionar os parametros no seu website.

Acesse: https://www.google.com/webmasters/markup-helper/ – requer login

Ao acessar a ferramenta, ele vai pedir que você entre com um endereço web que deseja efetuar a marcação de schemas.

Após a ferramenta carregar o endereço informado, ele te orienta a selecionar os campos relevantes de texto/imagem presentes na pagina e ao mesmo tempo já apresenta um exemplo de como essa informação está sendo interpretada pelos motores do Google.

O exemplo a seguir mostra a marcação sendo feita a partir de um texto na pagina:

Google Data Markup Helper

Exemplo do próprio serviço analisando o código:

Google Data Markup Tool Example

Feito isso, o google gera novamente o HTML da pagina em questão adicionando os schemas nos locais desejados, poupando o trabalho que o desenvolvedor teria de analisar linha por linha do código, você só vai precisar substituir o mesmo pelo atual no melhor estilo CTRL + C / CTRL + V.

Considerações finais

Se for a primeira vez que se depara com a configuração de schemas, é normal você errar alguma ou outra informação, porém você já vai perceber como é feito corretamente pois vai entender como os motores de buscas analisam as informações categorizadas.

Faça um teste com sua página e não se esqueça de efetuar um back do seu arquivo sem os schemas para caso tenha que alterar os mesmos.

Qualquer duvida, encaminhe um comentário.

🙂