como implementar rich snippets - thought works
TRANSCRIPT
![Page 1: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/1.jpg)
![Page 2: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/2.jpg)
TássiaSpinelli
![Page 3: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/3.jpg)
LuizAlmeida
![Page 4: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/4.jpg)
RichSnippets
![Page 5: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/5.jpg)
O que é?
"Pequenas linhas de texto que aparecem embaixo de todo resultado da pesquisa,
foram desenvolvidos para dar aos usuários uma noção sobre o conteúdo da página e por
que ela é relevante para a consulta"
- Tools, Google WebMaster
![Page 6: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/6.jpg)
Resultados comuns
![Page 7: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/7.jpg)
Resultados "enriquecidos"
> >
> >
> >
![Page 8: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/8.jpg)
+100 Rich Snippets
Entre os Rich Snippets mais conhecidos: !• Map Results • Ratings • BreadCrumb • Reviews • Price • Videos • Recipes • Carrousel • News • Bio's
![Page 9: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/9.jpg)
85%SERP's com Rich Snippets
![Page 10: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/10.jpg)
![Page 11: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/11.jpg)
![Page 12: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/12.jpg)
Como Implementar?
![Page 13: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/13.jpg)
MicroData (W3C Recommended) RDFa
JSON-LD !São os tipos de marcações que podem ser feitas em seu código HTML. !As ferramentas de busca indexam os três, porém MicroData aparentemente é identificado com mais facilidade.
Schema.org
![Page 14: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/14.jpg)
750 É a quantidade de marcações existentes atualmente. Uma listagem bem completa no site, que possibilita a escolha do Rich Snippet ideal para cada site.
Quais utilizar?
![Page 15: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/15.jpg)
Imagine que você tem uma página sobre o filme Avatar. A marcação HTML seria parecido com esta: !<div> <h1>Avatar</h1> <span>Director: James Cameron (born August 16, 1954)</span> <span>Science fiction</span> <a href="../movies/avatar-theatrical-trailer.html">Trailer</a> </div>
Marcação
![Page 16: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/16.jpg)
O primeiro passo é identificar o item a ser marcado com o ItemScope o ItemType: !<div itemscope itemtype="http://schema.org/Movie"> <h1>Avatar</h1> <span>Director: James Cameron (born August 16, 1954)</span> <span>Science fiction</span> <a href="../movies/avatar-theatrical-trailer.html">Trailer</a> </div>
Marcação
![Page 17: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/17.jpg)
Agora é necessário identificar e nomear as propriedades existentes dentro da marcação /Movie com o ItemProp: !<div itemscope itemtype="http://schema.org/Movie"> <h1 itemprop="name">Avatar</h1> <span itemprop="director">Director: James Cameron (born August 16, 1954)</span> <span itemprop="genre">Science fiction</span> <a href=“../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a> </div>
Marcação
![Page 18: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/18.jpg)
Inception
![Page 19: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/19.jpg)
<div itemscope itemtype ="http://schema.org/Movie"> <h1 itemprop="name"&g;Avatar</h1> <div itemprop="director" itemscope itemtype="http://schema.org/Person"> Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954)</span> </div> <span itemprop="genre">Science fiction</span> <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a> </div>
Quanto mais, melhor
![Page 20: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/20.jpg)
1.0 - Instale o GWM Tools 1.1 - Valide sua propriedade 2.0 - Rastreamento 2.1 - Buscar como Google 2.2 - Envie suas URL com Rich Snipets para o Google 2.2.1 - Clique no botão “enviar para o índice” 3.0 - Acesse “aspecto de pesquisa” 3.1 - Dados estruturados 3.1.1 - Valide se seus dados estão sendo identificados
Valide com Google WMTools
![Page 21: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/21.jpg)
Curiosidade
![Page 22: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/22.jpg)
Usuário: Torre Eiffel !Google: Construída em 31 de março de 1889… !Usuário: Preço dos ingressos !Google: Os ingressos para visitar a Torre custom entre… !Usuário: Visitar de dis ou à noite? !Google: As visitas durante o dia proporcionam uma vista da cidade…
Buscas por voz
![Page 23: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/23.jpg)
1. Resultados orgânicos mais atrativos 2. Geração de leads mais eficiente 3. Taxa de conversão otimizada 4. Economize no AdWords 5. Site mais relevante na visão das ferramentas de busca 6. Site pensado em entidades e não palavras-chave 7. Qualidade do código-fonte elevada 8. Mais benefícios que custo de implementação 9. Crescimento da marca/site orgânico 10.User Experiencie em seus resultados orgânicos
10 Vantagens
![Page 24: Como implementar Rich Snippets - Thought Works](https://reader034.vdocuments.net/reader034/viewer/2022042615/55a782e71a28ab2b3e8b4871/html5/thumbnails/24.jpg)
google.com/webmasters/tools !google.com/webmasters/tools/richsnippets !schema.org !schema.org/docs/full.html !support.google.com/webmasters/answer/99170?hl=pt-BR
Referências