Like A Girl

Pushing the conversation on gender equality.

Code Like A Girl

Como impulsionar o SEO do seu site com Schema.org Markup

Já sabemos o quão importante é estar na primeira página do Google. Mas como chegar lá?

O SEO (Search Engine Optimization) é o conjunto de técnicas para aumentar o tráfego ao seu site atráves de mecanismos de busca como Google e Bing. Entre as diversas técnicas de SEO, uma das mais eficientes e de simples implementação é o Schema.org Markup.

Mas o que é Schema Markup?

O Schema Markup é simplesmente um código que, quando incluído no seu site, ajuda mecanismos de busca a identificar o conteúdo e retornar resultados mais informativos para os usuários.

Você já reparou que algumas buscas apresentam em seus resultados algumas coisas a mais? Aqui temos um exemplo da empresa Submarino, que implementou uma barra de busca através do Schema Markup:

Barra de busca no site direto no resultado do Google.

No caso do Submarino, a barra de busca aparecer direto no resultado do Google é super importante, pois o usuário pode buscar o produto que procura ali mesmo, sem ter que acessar o site do Submarino para depois realizar a busca.

Você deve estar pensando “Nossa, isso deve ser super complicado”. Pelo contrário. Com 9 linhas, é possível implementar a barra de busca. Vejamos o código-fonte do Submarino:

Um código tão pequeno que faz tanta diferença.

Então Schema Markup é uma linguagem de programação?

Schema.org é um vocabulário de microdata, não uma linguagem de programação. Podemos entender microdata como “a linguagem dos robôs”. Assim, grandes mecanismos de busca como Google, Bing e Yahoo decidiram padronizar um vocabulário em comum para compreender facilmente os sites.

Quais são os tipos de Schema Markup?

Existem diversos tipos de markups, e a implementação de cada um vai depender da natureza do seu site. Por exemplo, caso você tenha um site de e-commerce, seria interessante implementar os schemas Product, Offer, Rating e ItemAvailability, para trazer informações sobre o modelo do produto, valor, avaliações de usuários e disponibilidade dos estoques.

Submarino mostra em seus resultados Avaliação, comentários, preço e situação do estoque do produto.

Alguns outros markups comuns são:

  • Pessoas
  • Organizações
  • Receitas
  • Filmes
  • Eventos
  • Artigos

Entre muitos outros. Para conferir a lista completa de schemas markup disponíveis, acesse schema.org.

Como implementar o Schema Markup?

1. Defina qual informação será exibida

Conforme já falamos, irá depender bastante da natureza do seu site e de qual página você deseja impulsionar. Pense em quais atributos você gostaria que fossem exibidos junto com o resultado.

2. Acesse Schema.org e encontre o markup que você irá utilizar

Clique em “Schemas” no canto superior direito para exibir toda a lista, ou procure por palavras-chave na barra de busca.

Caso você não tenha certeza do que procurar, tente palavras relacionadas com o site, como livros, eventos ou receitas. (A busca deverá ser feita em ingles)

3. Copie o código que será inserido no site

Na página de cada markup você irá encontrar as propriedades detalhadas do item, e no final da página, um exemplo do código em formato Microdata, RDFa e JSON-LD. Novamente, a escolha de uma destes formatos vai depender da estrutura do seu site, mas aconselha-sel utilizar JSON-LD pois é o formato mais recomendado pelo Google. Copie este código.

4. Inclua o código no seu site

Acesse o CMS do seu site ou o local onde você possa fazer alterações no código-fonte, cole o código e faça as alterações necessárias (por exemplo, mudar a url de “exemplo.com” para a url do seu site). Este código pode ser incluído tanto no <head> quanto no <body>, mas em geral recomenda-se incluir dados sobre a página (tema, titulo, etc) no <head>, e elementos mais específicos do contéudo como ingredientes de uma receita no <body>. Salve e publique as alterações.

5. Verifique se o código foi corretamente implementado

Use a ferramenta de Teste de Data Estrutural do Google. Basta inserir a URL da página onde você inseriu o código e clicar em “Run Test”. Do lado esquerdo da tela seá exibido o código original, enquanto do lado direito, as informações lidas pelo buscador. Caso algum problema seja identificado, você verá um alerta na aba “warnings”.

E pronto! Simples não?

Mesmo com uma implementação tão fácil, muito poucos sites utilizam esta técnica. O Schema markup traz melhoras significativas no posicionamento em mecanismos de busca, onde em média, sites com schema são exibidos 4 posições acima de sites sem a técnica.

Quer saber mais sobre Schema markup e microdata? Confira o guia de melhores práticas desenvolvido pelo Google.

Siga a tag codelikeagirlBR para ver nossos posts! 😀

Quer escrever ou traduzir artigos em português para a Code Like A Girl? Se você já faz parte do time de escritoras(es) da Code Like A Girl basta enviar seu artigo diretamente para nossa publicação. Se você ainda não faz parte do nosso time, envie uma mensagem direta para a conta de twitter CodeLikeAGirlBr. Nós avaliaremos seu artigo e ajudaremos a refiná-lo para publicação.