Rich snippets: pessoas

<strong>Novo!</strong> schema.orgpermite que você marque uma gama muito maior de tipos de itens em suas páginas, usando um vocabulário que o Google, a Microsoft e o Yahoo! conseguem entender. <a href="answer.py?answer=80472">Saiba mais.</a> O Google ainda oferece suporte para sua marcação de rich snippets existente.

Sobre informações de contato

Marcar informações de contato e de rede social no corpo de uma página web ajuda o Google a reconhecer e exibir melhor as suas informações nos resultados de pesquisa.

O Google está desenvolvendo a exibição de informações sobre o autor nas informações de pesquisa. Veja aqui como vincular seu perfil do Google ao conteúdo publicado na Web.
imagem de um rich snippet de pesquisa do Google representando uma pessoa

Propriedades

Cada contato (pessoa) pode ter diversas propriedades diferentes, como nome, cargo e um endereço. Você pode usar a marcação de microdados, microformatos ou RDFa para marcar essas propriedades.

O Google reconhece as seguintes propriedades de contato, derivadas do microformato hCard. Quando os nomes de propriedade de microdados/RDFa e de microformatos forem diferentes, o nome de propriedade de microformatos aparecerá entre parênteses. O Google também reconhece as propriedades XFN friend, contact e acquaintance, que são usadas para identificar relações sociais. As propriedades em negrito são obrigatórias. Além disso, pelo menos dois dos seguintes itens devem estar presentes:

  • title ou role
  • affiliation (org)
  • address
<strong>Propriedade</strong> Descrição
<code><strong>name</strong></code> (<code><strong>fn</strong></code>) Nome
nickname Apelido
<code>photo</code> Um link de imagem
<code>title</code> O cargo da pessoa (por exemplo, gerente financeiro)
role A função da pessoa (por exemplo, contador)
URL Link para uma página web, como a página inicial da pessoa
affiliation (org) O nome de uma organização com a qual a pessoa está associada (por exemplo, um empregador). Se fn e org tiverem exatamente o mesmo valor, o Google interpretará as informações como referentes a uma empresa ou organização e não a uma pessoa.
friend Identifica uma relação social entre a pessoa descrita e outra pessoa.
contact Identifica uma relação social entre a pessoa descrita e outra pessoa.
acquaintance Identifica uma relação social entre a pessoa descrita e outra pessoa.
address (adr) A localização da pessoa. Pode ter as subpropriedades street-address, locality, region, postal-code e country-name.

Como marcar o conteúdo

O seguinte código HTML descreve Bob "Smithy" Smith.

<div>
Meu nome é Bob Smith, mas todos me chamam de Smithy.  Esta é a minha página inicial:

<a href="http://www.example.com">www.example.com</a>.

Moro em Albuquerque, Novo México, e trabalho como engenheiro na ACME Corp.
Meus amigos:
<a href="http://darryl-blog.example.com">Darryl</a>,

<a href="http://edna-blog.example.com">Edna</a>

</div>

As seções a seguir descrevem como marcar este conteúdo usando microdados, microformatos ou RDFa.

Microdados

Este é o mesmo HTML marcado com microdados:

<div itemscope itemtype="http://data-vocabulary.org/Person">
  
  Meu nome é <span itemprop="name">Bob Smith</span>, 
   
  mas todos me chamam de <span itemprop="nickname">Smithy</span>.
  
  Esta é a minha página inicial:
   
  <a href="http://www.example.com" itemprop="url">www.example.com</a>.
  
  Moro em 
    
  <span itemprop="address" itemscope 
      
    itemtype="http://data-vocabulary.org/Address">
    
    <span itemprop="locality">Albuquerque</span>, 
     
    <span itemprop="region">Novo México</span> 
   
  </span>
  e trabalho como <span itemprop="title">engenheiro</span>
  
  na <span itemprop="affiliation">ACME Corp</span>.
  
  Meus amigos:
  <a href="http://darryl-blog.example.com" rel="friend">Darryl</a>,
    
  <a href="http://edna-blog.example.com" rel="friend">Edna</a>

</div>

Veja como esse exemplo funciona:

  • Na primeira linha, indica que o HTML incluído no
    representa uma pessoa. itemscope indica que o conteúdo do
    descreve um item e itemtype="http://www.data- vocabulary.org/Person" indica que o item é uma pessoa. person pode ser usado para representar microformatos vcard.
  • O exemplo descreve propriedades da pessoa, como nome, apelido e cargo. Para nomear as propriedades da pessoa, cada elemento que contém uma dessas propriedades (como <div> ou <span>) recebe um atributo itemprop indicando uma propriedade. Por exemplo, <span itemprop="nickname">.
  • Uma propriedade pode consistir de outro item (em outras palavras, um item pode incluir outros itens). Por exemplo, as informações da pessoa acima incluem um endereço (itemtype="http://www.data-vocabulary.org/Address") com as propriedades locality e region.
  • A propriedade XFN rel="friend" identifica a relação de Bob com Darryl e Edna.
Microformatos

Este é o mesmo conteúdo HTML marcado com o microformato hCard.

<div class="vcard">
   
   Meu nome é 
   
   <span class="fn">Bob Smith</span>,
   
   mas todos me chamam de 
   
   <span class="nickname">Smithy</span>.
   
   Esta é a minha página inicial:

   <a href="http://www.example.com" class="url">www.example.com</a>.
   
   Moro em 
   
   <span class="adr">
         
      <span class="locality">Albuquerque</span>,
      
      <span class="region">Novo México</span>
   
   </span>
   e trabalho como 
   
   <span class="title">engenheiro</span> na
   
   <span class="org">ACME Corp</span>.
   
   Meus amigos:
   <a href="http://darryl-blog.example.com" rel="friend">Darryl</a>,
   
   <a href="http://edna-blog.example.com" rel="friend">Edna</a>

</div>

Veja como o exemplo funciona.

  • Na primeira linha, class="vcard" indica que o HTML entre <div> descreve informações de contato. Nesse caso, as informações de contato de uma pessoa.

    (O microformato usado para descrever informações de contato é chamado hCard e em HTML é chamado vcard. Não é um erro de digitação.)

  • O exemplo descreve propriedades do item pessoa, como uma foto, nome, cargo, organização e endereço. Para nomear propriedades sobre a pessoa descrita pelo vcard, cada elemento que contém uma dessas propriedades (como <span> ou <div>) recebe um atributo class indicando uma propriedade. O vcard descreve o nome de Bob (fn), seu cargo (title) e a organização para a qual trabalha (org).
  • As propriedades podem conter outras propriedades. No exemplo acima, a propriedade adr descreve o endereço da pessoa e inclui as subpropriedades locality e region).
  • A propriedade XFN rel="friend" identifica a relação de Bob com Darryl e Edna.
RDFa

Veja o mesmo conteúdo HTML marcado com RDFa.

<div xmlns:v="http://rdf.data-vocabulary.org/#" typeof="v:Person">
   
   Meu nome é <span property="v:name">Bob Smith</span>,
   
   mas todos me chamam de <span property="v:nickname">Smithy</span>.
   
   Esta é a minha página inicial:
  
   <a href="http://www.example.com" rel="v:url">www.example.com</a>.
   
   Moro em 
   
         <span rel="v:address">

              <span typeof="v:Address">

         <span property="v:locality">Albuquerque</span>,

         <span property="v:region">Novo México</span>
      
      </span>
   </span>
   e trabalho como <span property="v:title">engenheiro</span>
   
   na <span property="v:affiliation">ACME Corp</span>.
   
   Meus amigos:
   <a href="http://darryl-blog.example.com" rel="v:friend">Darryl</a>,
   
   <a href="http://edna-blog.example.com" rel="v:friend">Edna</a>

</div>

Veja como o exemplo funciona.

  • O exemplo começa com uma declaração de namespace usando xmlns. Isso indica o namespace onde o vocabulário (uma lista de entidades e seus componentes) é especificado. Você pode usar a declaração de namespace xmlns:v="http://rdf.data-vocabulary.org/#" sempre que estiver marcando páginas para definir pessoas, resenhas ou dados de locais. Lembre-se de usar uma barra e # (xmlns:v="http://rdf.data-vocabulary.org/#" ).
  • Além disso, na primeira linha, typeof="v:Person" indica que o conteúdo marcado representa uma pessoa.
  • Cada propriedade da pessoa (como nome ou apelido) é nomeada usando property. O nome da propriedade é prefixado com v: (<span property="v:nickname">).
  • Queremos incluir as informações de endereço de Bob (typeof="v:Address") na entidade typeof="v:Person". Aqui, usamos rel em vez de property para indicar uma relação entre Bob (a entidade v:Person) e este endereço (a entidade v:Address). Em seguida, incluímos <span typeof="v:Address"> para incorporar a entidade de endereço real.
  • A propriedade XFN rel="friend" identifica a relação de Bob com Darryl e Edna.