<
Menu

Tableless


usabilidade

A usabilidade deve ser pensada por todos

premioacessibilidade

Abertas as inscrições para a 2ª edição do Prêmio Nacional de Acessibilidade na Web

acess

Drops 6 – Acessibilidade

720

Seu lugar ao sol


Imagem post: Schema – Marcação de dados estruturados

Schema – Marcação de dados estruturados

Entenda como o Schema pode ajudar a auxiliar o vocabulário de marcação de dados em páginas web.

Há cerca de cinco anos atrás os principais buscadores se uniram para definir uma nova estrutura que pode ser chamado de “mapa de um site”, um documento onde tem uma única função que é informar aos buscadores a estrutura de um site, vídeos ou imagens. Essa estrutura é utilizada até hoje pelos desenvolvedores permitindo assim que todas as áreas ou páginas sejam facilmente “descobertas” pelos crawlers dos buscadores, foi assim que surgiu o sitemap.org.

Logo Buscadores

Recentemente os principais buscadores se reuniram novamente, só que agora com a participação do Yandex um novo buscador russo que afirma ser melhor que o Google. Os buscadores se uniram para definir uma nova marcação de dados estruturados, trata-se do Schema.

Historicamente, o Google tem apoiado três padrões diferentes para dados estruturados, (microdados, microformat e RDFa) com a vinda do Schema as coisas irão mudar já que é proposto por três dos mais influentes players da web.

O projeto Schema vem basicamente para ser uma central de recursos para desenvolvedores, para auxiliar e apoiar o vocabulário de marcação de dados estruturados nas páginas web. Para conferir o novo projeto ele está disponível no endereço schema.org.

Navegando na web você já deve ter visto em um resultado de busca algumas snippets mais interessantes, que mostram reviews de usuários, preços de produtos.

Snippet

Com uma snippet assim você acaba chamando mais atenção na SERP do Google conseguindo assim mais cliques e consequentemente mais visitantes, essa é uma das vantagens de utilizar a marcação de dados estruturados mais conhecida como Rich Snippets (Trechos ricos de informação).

Introdução de como implementar

Para implementar o Schema em seu site é muito simples, em uma marcação HTML adicione a tag itemscope essa tag é responsável por identificar a seção da página que é sobre um determinado “assunto”, após especificar o itemscope é necessário atribuir o tipo desse “assunto”, para tal utilize a tag itemtype.

No Schema para determinados assuntos temos várias propriedades, por exemplo em um filme temos atores, diretor, preço, trailer, avaliações. Para atribuir essas informações para os motores de buscas utilize a tag itemprop, veja um exemplo:

<div itemscope itemtype = "http://schema.org/Movie">
<h1 itemprop=”name”> Como Água - Anderson Silva </ h1>
<span itemprop=”director”> Diretor: Pablo Croce</ span>
<a itemprop=”url” href="../movies/anderson-silva-como-agua.html">Trailer</ a>
</div>

No código acima o “assunto” é o novo filme do Anderson Silva (Como Água) dirigido pelo diretor Pablo Croce com um link para um trailer do filme, por isso foi utilizado o itemtype “Movie”.

Desde 2004 o Google vem dando fortes sinais em relação a semântica e trechos ricos de informação, em meados de 2009 lançou uma ferramenta chamada Rich Snippets Testing Tool que tem como finalidade trazer uma amostra de como os Rich Snippets aparecereia nos resultados das buscas do Google.

Recentemente um executivo do Google anunciou uma das maiores renovações em seu algoritmo de busca, a ideia dessa atualização é que o buscador entenda da mesma forma que nós humanos entendemos o mundo, mais uma vez ressalto a importância de se ter um site semântico e bem estruturado.

Por thiago-pacheco

Sou formado em comunicação digital, proprietário da SEO Monkey e Agência Web Doting, para saber mais sobre o que faço e projetos me adicione nas redes sociais: Twitter | Facebook | Google+

Mais posts do autor

Comentários (19)

  • http://twitter.com/rennan_martini Rennan Martini ಠ_ಠ

    Parabéns pelo post Thiago, foi útil para reforçar o que a Talita já havia postado neste aqui sobre Microdata
    http://tableless.com.br/introducao-a-microdata-no-html5/. =)

  • Deivid Marques

    Ótimo tema. Galera de desenvolvimento deve se informar melhor sobre é bem interessante ja que está ligada diretamente ao SEO.

  • Kelvym

    De acordo com o schema, qual a categoria para meu site q eh um portfolio? (Portfolio – Web Developer e tem um blog no site tbm, mas o principal eh meu portfolio)

  • http://twitter.com/DeivisonMatos D_Matos

    quanta coisa que a gente aprende lendo e buscando informações na web, por isso me apaixono a cada dia por essa que pra mim é mais que profissão e sim um estilo de hobby, de vida e ate mesmo de “lazer”…

  • Adriano Santos

    Muito Bom

  • Carlos Eduardo de Souza

    O bacana é ver que o Schema é um esforço conjunto dos sistemas de busca, mas não é uma “linguagem” tão simples como o Microformats, por ser muito mais precisa e detalhista na descrição do conteúdo.

  • Pingback: De uma camaradagem acabou saindo um teste

  • http://www.gabrielmagalhaes.com.br/ Gabriel Magalhães dos Santos

    Legal, mais tenho uma questão, e como fica os sites em ajax?

  • Pingback: Microdados do HTML5 | Tableless

  • http://www.facebook.com/carlossnogueira Carlos Nogueira

    bom utilizando views em MVC e Javascript não obstrutivo, a interface não depende do ajax para apresentar o conteúdo =D

  • http://www.facebook.com/wallace.erick Wallace Erick

    Belo post Baratinha, foi em minha homenagem é? kkk

    Postei no grupo do Face perguntando sobre isso hoje.

    Valeu pelo ajuda.

    Abraços

  • Francisco Baliego

    Belo post Thiago,
    gosto muito e tb recomendo o Schema como marcação de microdados.
    Valew!

  • Pingback: Links compartilhados | ValessioBrito.com.br

  • Vagner Gomes

    Muito show o texto. Vlw!

  • RedeAutos

    Bom dia amigos …

    Tenho de site [classificado] de carros a venda em Petrolina, Juazeiro e Vale do São Francisco. http://redeautos.com

    No momento estou aprendendo sobre tablelees e fazendo a validação no w3c do meu site.

    Estou usando HTML 4.01 Transitional / iso-8859-1

    A questão é que não consigo validar o schema.
    Erros do tipo:
    - “ITEMSCOPE” is not a member of a group specified for any attribute
    - there is no attribute “ITEMTYPE”

    Caso alguem pode dar uma força eu ficarei muito grato.

    Valeu amigos …

  • http://leobetosouza.com/ Leonardo Alberto Souza

    Schema.org é um vocabulário Microdata. Alguém corrige isso, faz favor.

  • Pingback: Breadcrumb - Usabilidade, Dados Estruturados e Linkagem Interna

  • Pingback: Breadcrumb Navigation – Facilite a vida do seu cliente e aumente sua linkagem interna | Richard Nicson

  • Ane Caroline

    Olá pessoal… Hoje fiz uma busca por [livro de nicolas sparks] e a SERP me retornou um resultado diferente! (Uma faixa preta com imagens de vários livros) Minha pergunta é…

    A marcação pode ter influenciado no aparecimento daquelas imagens ali? Será que o Google não está usando as marcações como plano para inserir estas imagens no topo? Como elas chegaram lá? o posicionamento destas imagens estão sendo manipulados? ou é orgânico?