Fragmentos enriquecidos: personas

¡Nuevo! schema.org permite marcar una gama mucho más extensa de tipos de elemento de tus páginas mediante un vocabulario que tanto Google, como Microsoft o Yahoo! comprenden. Más información (Google sigue admitiendo el marcado de fragmentos enriquecidos existente en tus páginas)

Acerca de la información de contacto

El marcado de la información de redes sociales y de contacto en el cuerpo de una página web ayuda a Google a reconocer y a mostrar mejor su información en los resultados de búsqueda.

Google está probando la opción de mostrar la información de autor en los resultados de búsqueda. Aquí aprenderás a enlazar tu perfil de Google con el contenido que publiques en la Web.
imagen de un fragmento enriquecido de búsqueda de Google que representa a una persona

Propiedades

Cada contacto (persona) puede tener distintas propiedades como, por ejemplo, un nombre, un cargo y una dirección. Puede utilizar el marcado de microdatos, de microformatos o de RDFa para etiquetar estas propiedades.

Google reconoce las siguientes propiedades de contacto derivadas del microformato hCard. (Si los nombres de propiedades de los microformatos y de los microdatos o de RDFa difieren, el nombre de propiedad de los microformatos aparece entre paréntesis). Google también reconoce las propiedades XFN, friend, contact y acquaintance, que se utilizan para identificar relaciones sociales. Las propiedades que aparecen <strong>en negrita</strong> son obligatorias. Asimismo, deben aparecer al menos dos de las propiedades que se indican a continuación:

  • title o role,
  • affiliation (org),
  • address.
Propiedad Descripción
name (fn) Nombre
nickname Alias
photo Un enlace de imagen
title El cargo de la persona (por ejemplo, director financiero)
role La función de la persona (por ejemplo, contable)
url Enlace a una página web como, por ejemplo, la página principal de la persona
affiliation (org) El nombre de una organización a la que está asociada la persona (por ejemplo, una empresa). Si fn y org tienen el mismo valor, Google interpretará la información como referente a una empresa o a una organización, no a una persona.
friend Identifica una relación social entre la persona descrita y otra persona.
contact Identifica una relación social entre la persona descrita y otra persona.
acquaintance Identifica una relación social entre la persona descrita y otra persona.
address (adr) La ubicación de la persona. Puede tener las subpropiedades street-address, locality, region, postal-code y country-name.

Marcado de contenido

El código HTML que aparece a continuación describe a Roberto Sánchez "Rober".

<div>
Mi nombre es Roberto Sánchez, pero me llaman "Rober". Esta es mi página principal:
<a href="http://www.example.com">www.example.com</a>.
Vivo en Alcobendas (Madrid) y trabajo de ingeniero en ACME S.A.
Mis amigos:
<a href="http://david-blog.example.com">David</a>,
<a href="http://blog-elena.example.com">Elena</a>

</div>

En las siguientes secciones se describe cómo marcar este contenido con microdatos, con microformatos o con RDFa.

Microdatos

A continuación se indica el mismo código HTML marcado con microdatos:

<div itemscope itemtype="http://data-vocabulary.org/Person">
  Mi nombre es <span itemprop="name">Roberto Sánchez</span>, 
    
  pero me llaman <span itemprop="nickname">Rober</span>.
  Esta es mi página principal: 
  <a href="http://www.example.com" itemprop="url">www.example.com</a>.
   
  Vivo en 
  <span itemprop="address" itemscope
    itemtype="http://data-vocabulary.org/Address">
    <span itemprop="locality">Alcobendas</span>, 
    <span itemprop="region">Madrid</span> 
  </span>
  y trabajo de <span itemprop="title">ingeniero</span>
   
  en <span itemprop="affiliation">ACME S.A.</span>.
  Mis amigos:
  <a href="http://blog-david.example.com" rel="friend">David</a>y 
    
  <a href="http://blog-elena.example.com" rel="friend">Elena</a>

</div>

A continuación se indica cómo funciona este ejemplo:

  • En la primera línea, <itemscope itemtype="http://www.data-vocabulary.org/Person"> indica que el código HTML incluido en <div> representa una persona. itemscope indica que el contenido de <div> describe un elemento, y itemtype="http://www.data-vocabulary.org/Person" indica que el elemento es una persona. Se puede usar person para que represente vcard de microformatos.
  • En el ejemplo se describen las propiedades de una persona como, por ejemplo, su nombre, su alias o su cargo. Para etiquetar las propiedades de una persona, a todos los elementos que contengan una de esas propiedades (como, por ejemplo, <div> o <span>) se les asigna un atributo itemprop que indica una propiedad (por ejemplo, <span itemprop="nickname">).
  • Una propiedad puede estar formada por otro elemento, es decir, un elemento puede incluir otros elementos. Por ejemplo, la información de la persona anterior incluye una dirección (itemtype="http://www.data-vocabulary.org/Address") con las propiedades locality y region.
  • La propiedad rel="friend" de XFN identifica la relación de Roberto con David y con Elena.
Microformatos

A continuación, se muestra el mismo contenido HTML marcado con el microformato "hCard".

<div class="vcard">
   Soy
   
   <span class="fn">Roberto Sánchez</span>,
   
   pero me llaman
   
   <span class="nickname">Rober</span>.
   
   Esta es mi página principal:
   <a href="http://www.example.com" class="url">www.example.com</a>.
   
   Vivo en
   <span class="adr">
      <span class="locality">Alcobendas</span>,
      
      <span class="region">Madrid</span>
   </span>
   y trabajo de
   <span class="title">ingeniero</span> en
   
   <span class="org">ACME S.A.</span>
   
   Mis amigos:
   <a href="http://blog-david.example.com" rel="friend">David</a>y 
   
   <a href="http://blog-elena.example.com" rel="friend">Elena</a>

</div>

A continuación explicamos cómo funciona el ejemplo:

  • En la primera línea, class="vcard" indica que el código HTML incluido en la etiqueta <div> describe la información de contacto (en este caso, la información de contacto de una persona).

    (El microformato que se utiliza para describir la información de contacto se denomina hCard y en HTML se conoce como vcard. No se trata de un error ortográfico).

  • En el ejemplo, se describen las propiedades del elemento de persona como, por ejemplo, una foto, el nombre, el cargo, la organización y la dirección. Para etiquetar las propiedades de la persona que se describen con el microformato vcard, a todos los elementos que contengan una de esas propiedades (como, por ejemplo, <span> o <div>) se les asigna un atributo class que indica una propiedad. El microformato vcard describe el nombre de Roberto (fn), su cargo (title) y la organización para la que trabaja (org).
  • Las propiedades pueden contener otras propiedades. En el ejemplo anterior, la propiedad adr indica la dirección de la persona, que incluye además las subpropiedades locality y region.
  • La propiedad rel="friend" de XFN identifica la relación de Roberto con David y con Elena.
RDFa

A continuación se indica el mismo contenido HTML marcado con RDFa.

<div xmlns:v="http://rdf.data-vocabulary.org/#" typeof="v:Person">
   Soy <span property="v:name">Roberto Sánchez</span>,
   
   pero me llaman <span property="v:nickname">Rober</span>.
   
   Esta es mi página principal:
   <a href="http://www.example.com" rel="v:url">www.example.com</a>.
   
   Vivo en
   <span rel="v:address">
      <span typeof="v:Address">
         <span property="v:locality">Alcobendas</span>,
         <span property="v:region">Madrid</span>
      </span>
   </span>
   y trabajo de <span property="v:title">ingeniero</span>
   
   at <span property="v:affiliation">ACME S.A.</span>.
   Mis amigos:
   <a href="http://darryl-blog.example.com" rel="v:friend">David</a> y
   
   <a href="http://edna-blog.example.com" rel="v:friend">Elena</a>

</div>

A continuación explicamos cómo funciona el ejemplo:

  • El ejemplo empieza con una declaración de espacio de nombres que utiliza el atributo xmlns. Esta declaración indica el espacio de nombres en el que se especifica el vocabulario (una lista de entidades y de sus componentes). Puedes utilizar la declaración de espacio de nombres xmlns:v="http://rdf.data-vocabulary.org/#" siempre que marques páginas de usuario, de opinión o de datos de lugares. Asegúrate de utilizar la barra inclinada y el símbolo # (xmlns:v="http://rdf.data-vocabulary.org/#" ).
  • En la primera línea, typeof="v:Person" también indica que el contenido marcado representa a una persona.
  • Cada propiedad de la persona (como, por ejemplo, su nombre o su apodo) se etiqueta con el atributo property. El nombre de propiedad va precedido de v: (<span property="v:nickname">).
  • Queremos incluir los datos de la dirección de Roberto (typeof="v:Address") en la entidad typeof="v:Person". Para ello, utilizamos el atributo rel en lugar de property para indicar una relación entre Roberto (la entidad v:Person) y esta dirección (la entidad v:Address). A continuación, añadimos <span typeof="v:Address"> para incluir la entidad de dirección real.
  • La propiedad rel="friend" de XFN identifica la relación de Roberto con David y con Elena.