Los
microdatos son otra de las estrategias que se implementan en HTML5 para dar mas significado a la información, y consiste en etiquetar contenido para describir un tipo específico de información, como por ejemplo información sobre personas o eventos.
Cada tipo de información describe un tipo de elemento específico, así por ejemplo una persona cuenta con primer nombre, segundo nombre, dirección, teléfono, etc., para esto se usan atributos simples en etiquetas HTML para asignar nombres breves y descriptivos a los elementos y propiedades.
Actualmente existen varios repositorios que contienen esquemas con información general de diferentes tipos, siendo el mas usado
schema, si por ejemplo consultamos la definición de una
persona, veremos una tabla con datos que describen a una persona:
De esta forma se usa una descripción estandarizado de una persona, ahora realicemos un ejemplo de su uso, basándonos en el esquema que hemos obtenido.
<div itemscope itemtype="http://schema.org/Person">
<span itemprop="name">Fabián Becerra</span>
<span itemprop="jobTitle">Software Architect</span>
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">
1234 La dirección
</span>
<span itemprop="addressLocality">Localidad</span>,
<span itemprop="addressRegion">Región</span>
<span itemprop="postalCode">0005</span>
</div>
<span itemprop="telephone">(123) 123-4567</span>
<a href="mailto:myemail@dominio.com" itemprop="email">myemail@dominio.com</a>
Web Site:
<a href="http://www.mypage.com" itemprop="url">mypage.com</a>
</div>
Si observamos detenidamente la primera línea, veremos el atributo
itemscope, este indica que el contenido del
div corresponde a un elemento, y el atributo
itemtype define la
url del esquema que contiene la descripción del tipo de información.
<div itemscope itemtype="http://schema.org/Person">
Observando las líneas siguiente encontramos el atributo itemprop, el cual indica que la información contenido por la etiqueta es un atributo, y tiene asociado el nombre del atributo correspondiente.
<span itemprop="name">Fabián Becerra</span>
En el caso del ejemplo, se incluye un atributo que es en si un elemento de información, para este caso podemos ver como se define que el contenedor es un atributo de tipo address, pero al mismo tiempo se indica que el div contiene un elemento, cuyo esquema corresponde a una dirección postal.
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
De esta forma podemos dar mas significado a la información contenida en nuestra web, y hacer mas efectivas las busquedas de información.