Web Semântica e SEO26/11/2012   Por Marcos Vinícius Henke Arnoldo – b4it.com.br   1
    Como a utilização de Microdata (microdados) pode     melhorar a experiência de usuário na busca por     conteúdo    ...
1.      Apresentação2.      SEO3.      HTML54.      Web Semântica5.      Dados Estruturados - Microdata     a)      Quem j...
    Otimização para Mecanismos de Busca significa realizar     ações on-site e off-site para popularizar um web site    ...
SERP = Search Engine Result Page (Página de Resultados do Mecanismo de Busca)                                     PPC     ...
    Fatores Positivos                                 Fatores Negativos      Palavras-chave                            ...
    Páginas                           Site                                  Off-site    Tags de título                ...
   Novos elementos                Novos atributos                Suporte completo a CSS3                Video e Audio ...
<!DOCTYPE html><html>  <head>    <meta charset="UTF-8" />    <title>Player de áudio em html5</title>  </head>  <body>    <...
    No site da W3c, há a expressão:      “The Semantic Web is a web of data”    A Web semântica interliga significados ...
    É baseada no Resource Description     Framework (RDF) e envolve outras     tecnologias como SPARQL, OWL, and SKOS    ...
The Pizza Shop       Só texto. Nada            123 Fake Street                                 Faketown                   ...
Ah! Você quer                            The Pizza Shop    dizer The Pizza         123 Fake Street    Shop que fica       ...
    Microformats: o mais antigo e mais simples. Possui     definições para marcação de endereços, eventos, links de     a...
    Visão Geral            http://support.google.com/webmasters/bin/topic.py?hl=pt-BR&topic=1088472&parent=21997&ctx=top...
Structured data + Extended Vocabulary                      Microdata                              Schema.org              ...
26/11/2012   Por Marcos Vinícius Henke Arnoldo – b4it.com.br   17
<div itemscope itemtype ="http://schema.org/Movie"> <h1 itemprop="name">Avatar</h1> <div itemprop="director" itemscope ite...
<div itemscope itemtype="http://schema.org/Product"> <span itemprop="name">Kenmore White 17" Microwave</span> <img itempro...
    receitaria.blog.br    b4it.com.br26/11/2012     Por Marcos Vinícius Henke Arnoldo – b4it.com.br   20
    http://www.google.com/webmasters/tools/richsnippets    http://foolip.org/microdatajs/live/    http://linter.structu...
26/11/2012   Por Marcos Vinícius Henke Arnoldo – b4it.com.br   22
26/11/2012   Por Marcos Vinícius Henke Arnoldo – b4it.com.br   23
26/11/2012   Por Marcos Vinícius Henke Arnoldo – b4it.com.br   24
    Há muito espaço para evoluir, pois HTML5,     web semântica e dados estruturados estão     em fase embrionária    Po...
Especulação:                                                               Filtros nas pesquisas?                         ...
    schema.org    seomoz.org    w3.org/TR/html5/    w3schools.com/html5    mestreseo.com.br/artigos-seo    seomaster...
    Guerreiro SEO, John I. Jercovic    SEM e SEO: Dominando o Marketing de Busca, Martha     Gabriel    www.mestreseo.c...
    Obrigado!    Contatos:    b4it.com.br    linkedin.com/in/marcoshenke26/11/2012       Por Marcos Vinícius Henke Arn...
Upcoming SlideShare
Loading in …5
×

Web Semântica e SEO: Melhorando resultados nos buscadores com HTML 5 e dados estruturados

1,947 views
1,850 views

Published on

Palestra apresentada no V Festival de Software Livre do Vale do Sinos
24/12/2012

Resumo: Serão apresentados os principais conceitos do HTML 5 relacionados à Web Semântica, com foco na utilização de dados estruturados para atribuição de significado ao texto de uma página web. Buscadores como Google e Bing interpretam as marcações semânticas para gerar Rich Snippets em suas páginas de resultados, exibindo as informações extraídas de forma diferenciada e destacada. Como resultado, há uma significativa melhoria na experiência do usuário, que encontrando mais facilmente o que procura, possibilita um aumento na taxa de acesso à página e um melhor posicionamento no ranking de resultados.

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,947
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
44
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Web Semântica e SEO: Melhorando resultados nos buscadores com HTML 5 e dados estruturados

  1. 1. Web Semântica e SEO26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 1
  2. 2.  Como a utilização de Microdata (microdados) pode melhorar a experiência de usuário na busca por conteúdo Microdata Dados estruturados Web Semântica HTML 5 SEO Por ser uma evolução/extensão do HTML, Microdata é livre, de código aberto e multi-plataforma por natureza26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 2
  3. 3. 1. Apresentação2. SEO3. HTML54. Web Semântica5. Dados Estruturados - Microdata a) Quem já está utilizando? b) Exemplos de códigos c) Ferramentas de teste d) O que está por vir?6. Links recomendados26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 3
  4. 4.  Otimização para Mecanismos de Busca significa realizar ações on-site e off-site para popularizar um web site Visa melhorar o posicionamento nos resultados de buscas orgânicas, ou naturais (Google, Bing, Yahoo, etc.)  SEO x Search Engine Marketing (SEM) e pay-per-click (PPC) Fama de “trapaça” no passado  Hoje é estratégia defensiva – quem não faz, perde pro concorrente que já faz Trabalho árduo, especializado, contínuo e com resultados em longo prazo  Curto prazo: grande diferença entre fazer ou não fazer SEO26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 4
  5. 5. SERP = Search Engine Result Page (Página de Resultados do Mecanismo de Busca) PPC 30% clicks PPC Foco do SEO Orgânica (70% clicks) 26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 5
  6. 6.  Fatores Positivos  Fatores Negativos  Palavras-chave  Spam de mecanismo  Título da página de busca  Confiança  Alta taxa de bounce  Autoridade  Conteúdo duplicado  Tendência  Troca ou venda de  Idade links  Links de entrada26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 6
  7. 7.  Páginas  Site  Off-site Tags de título  Seleção do nome do  Backlinks autoritários Descrição da mídia domínio (com reputação) Densidade das palavras-  Redesign do website  Mídias sociais chave  Configuração do  Solicitação de links Texto âncora servidor web  Envio a diretórios, ...  Geotargeting blogs, fóruns Meta-tags: fraca  Canonicalização da  Escrita de artigos relevância pelo mau uso URL  Press-releases no passado  Arquitetura de links  Publicações  keywords e description  Melhorias de  ... desempenho Bola da vez:  ...  Dados Estruturados 26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 7
  8. 8.  Novos elementos  Novos atributos  Suporte completo a CSS3  Video e Audio sem necessidade de plugins  Gráficos 2D e 3D  Armazenamento Local (offline)  Banco de dados SQL local  Aplicações Web  Esta versão traz importantes mudanças quanto ao papel do HTML no mundo da Web, através de novas funcionalidades como semântica e acessibilidade, com novos recursos, antes só possíveis por meio de outras tecnologias  Sua essência tem sido melhorar a linguagem com o suporte para as mais recentes multimídias, enquanto a mantém facilmente legível por seres humanos e consistentemente compreendida por computadores e outros dispositivos (navegadores, parsers, etc)  Será o novo padrão para HTML, XHTML, e HTML DOM  Atualmente, está em fase de esboço. Previsão: 201426/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 8
  9. 9. <!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <title>Player de áudio em html5</title> </head> <body> <audio controls autoplay> <source src="audio.mp3" /> <p>Seu browser não suporta essa tecnologia.</p> </audio> </body></html>26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 9
  10. 10.  No site da W3c, há a expressão:  “The Semantic Web is a web of data” A Web semântica interliga significados de palavras e tem como finalidade conseguir atribuir um sentido aos conteúdos publicados na Internet de modo que seja perceptível tanto pelo humano como pelo computador A Web Semântica é uma evolução da nossa web atual com as informações devidamente organizadas Surgiu em 2001, quando Tim Berners-Lee, James Hendler e Ora Lassila publicaram um artigo na revista Scientific American, intitulado: “Web Semântica: um novo formato de conteúdo para a Web que tem significado para computadores vai iniciar uma revolução de novas possibilidades”26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 10
  11. 11.  É baseada no Resource Description Framework (RDF) e envolve outras tecnologias como SPARQL, OWL, and SKOS Muito complexo!26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 11
  12. 12. The Pizza Shop Só texto. Nada 123 Fake Street Faketown Endereço pra ver aqui… de uma Fakeshire Organização FA12 KE1 Rating: Review by: Sarah Review “OMG! That was like, the best lunch I ever had! Awesome!” “A World of Welsh Lamb” Wednesday, 6 October 12:00 - 14:00 Leadenhall Market Evento 45-52 Leadenhall Market, City, EC3V 1LR Fonte: seomoz26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 12
  13. 13. Ah! Você quer The Pizza Shop dizer The Pizza 123 Fake Street Shop que fica Faketown Detalhes do na Fake Street! Fakeshire contato FA12 KE1 <div class="vcard"> <span class="fn org">The Pizza Shop</span> <div class="adr"> <span class="street-address">123 Fake Street</span>, <span class="locality">Faketown</span>, <span class="region">Fakeshire</span>. </div> </span> Phone: <span class="tel">123-456-789</span> <a href="http://pizzaexample.com/" class="url">http://pizzaexample.com</a> </div> Fonte: seomoz26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 13
  14. 14.  Microformats: o mais antigo e mais simples. Possui definições para marcação de endereços, eventos, links de amigos e outros. Não suporta personalização (estensão)  microformats.org RDFa: Baseado no modelo de dados RDF do W3C, é uma forma de adicionar RDF em páginas HTML. Complexo e com curva de aprendizado mais lenta que as outras propostas  w3.org/TR/xhtml-rdfa-primer/ Microdata: Mais simples, com participação ativa de desenvolvedores de sistemas de busca em sua definição  schema.org26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 14
  15. 15.  Visão Geral  http://support.google.com/webmasters/bin/topic.py?hl=pt-BR&topic=1088472&parent=21997&ctx=topic  Rich snippets (microdados, microformatos, RDFa, e marcador de dados)  Sobre microdados  Sobre microformatos  Sobre RDFa  Perguntas frequentes sobre o schema.org26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 15
  16. 16. Structured data + Extended Vocabulary Microdata Schema.org Microformats RDFa <div itemscope itemtype=“http://schema.org/Product”> • Foi criado pelo WHATWG (Criadores do HTML5/WebApplications 1.0) e tornou-se o padrão de marcação semântica adotado pelo HTML5 • Microdata utiliza-se de variados vocabulários para descrever itens semanticamente e pares key-value para atribuição de valores a suas propriedades Fonte: seomoz26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 16
  17. 17. 26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 17
  18. 18. <div itemscope itemtype ="http://schema.org/Movie"> <h1 itemprop="name">Avatar</h1> <div itemprop="director" itemscope itemtype="http://schema.org/Person"> Director: <span itemprop="name">James Cameron</span> (born <spanitemprop="birthDate">August 16, 1954)</span> </div> <span itemprop="genre">Science fiction</span> <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a></div>26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 18
  19. 19. <div itemscope itemtype="http://schema.org/Product"> <span itemprop="name">Kenmore White 17" Microwave</span> <img itemprop=“image" src="kenmore-microwave-17in.jpg" alt=Kenmore 17"Microwave /> <div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"> Rated <span itemprop="ratingValue">3.5</span>/5 based on <span itemprop="reviewCount">11</span> customer reviews </div> <div itemprop="offers" itemscope itemtype="http://schema.org/Offer"> <span itemprop="price">$55.00</span> <link itemprop="availability" href="http://schema.org/InStock" />In stock </div> Product description: <span itemprop="description">0.7 cubic feet countertop microwave. Has six preset cooking categories and convenience features like Add-A-Minute and Child Lock.</span></div>26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 19
  20. 20.  receitaria.blog.br b4it.com.br26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 20
  21. 21.  http://www.google.com/webmasters/tools/richsnippets http://foolip.org/microdatajs/live/ http://linter.structured-data.org/26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 21
  22. 22. 26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 22
  23. 23. 26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 23
  24. 24. 26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 24
  25. 25.  Há muito espaço para evoluir, pois HTML5, web semântica e dados estruturados estão em fase embrionária Porém, o impacto será enorme para estratégias de SEO – e quem não fizer, ficará para trás Grandes autoridades da web estão com o foco direcionado para a “web de dados”26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 25
  26. 26. Especulação: Filtros nas pesquisas? http://www.google.com/shopping26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 26
  27. 27.  schema.org seomoz.org w3.org/TR/html5/ w3schools.com/html5 mestreseo.com.br/artigos-seo seomaster.com.br/blog tableless.com.br/html5/  Microdata: tableless.com.br/html5/?chapter=20 w3.org/standards/semanticweb/26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 27
  28. 28.  Guerreiro SEO, John I. Jercovic SEM e SEO: Dominando o Marketing de Busca, Martha Gabriel www.mestreseo.com.br www.schema.org seomoz.org http://codigoaberto.info/artigos/38-introducao-a- marcacao-de-dados-estruturados.html http://loopinfinito.com.br/2012/04/26/marcacao- semantica/26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 28
  29. 29.  Obrigado! Contatos: b4it.com.br linkedin.com/in/marcoshenke26/11/2012 Por Marcos Vinícius Henke Arnoldo – b4it.com.br 29

×