martes, 13 de noviembre de 2012

Microformatos en HTML5

Microformatos

Los microformatos son un paquete de convenciones acordadas por la comunidad. Estos microformatos utilizan el atributo class de HTML para tapar algunos de sus agujeros más evidentes:
  • hCard para detalles de contactos
  • hCalendar para eventos
  • hAtom para noticias y similares
  • ...
Como existe un consenso en la comunidad sobre que nombre de clases usar, ahora existen parseadores y extensiones para los navegadores que son capaces de trabajar con esos patrones específicos. Si quieres saber más acerca de ellos puedes echarle un ojo a su wiki.
Los microformatos no pretenden solucionar cada posible caso de uso. Están diseñados con la filosofía de cubrir el ochenta por ciento de los casos usando el viente por ciento del esfuerzo ( a esto se le conoce como la fórmula 80/20 ) . Algunos desarrolladores opinan que HTML necesita ser infinitamente extensible por lo que la fórmula 80/20 no es suficiente porque se debe proveer de una solución en todos los casos y no en la mayoría.
Existen tecnologías como RDFa que es un conjunto de extensiones propuestas por la W3C para introducir mayor semántica en los documentos HTML y que utiliza namespaces que hacen posible la introducción de infinidad de formatos:

<p property="talformato:descripcion">....</p>
El asunto de usar namespaces ha iniciado un intenso debate en la comunidad puesto que alguna gente opina que el uso de namespaces traerá consigo una posible desestandarización y añade una capa de complejidad totalmente innecesaria pudiendo utilizar las clases para ello.

Mark

HTML5 introduce un conjunto nuevo de elementos inline solo que ya no se llaman elementos inline sino text-level semantics o semántica a nivel de texto en la lengua del imperio. Uno de ellos es la etiqueta mark.
Cuando realizamos una búsqueda en ciertos sitios, los elementos encontrados en la página aparecen remarcados para facilitar su localización. Eso se ha estado haciendo con etiquetas span con alguna suerte de clase que produce el efecto deseado, y es correcto, pero no es semántico. Podemos utilizar em o strong pero eso tampoco sería muy semántico porque no queremos añadir importancia ni énfasis a la palabra buscada, solo queremos remarcarla de alguna forma.
Es ahi donde entra en escena la nueva etiqueta mark:

<h1>Resultados de la búsqueda de la palabra 'poyaque'</h1>
<ol>
    <li>El señor de los <mark>poyaque</mark>s...</li>    
    <li>el cliente y su temido <mark>poyaque</mark></li>
</ol>
No le hemos dado ninguna relevancia a la palabra, tan solo la hemos marcado. Si estás usando un navegador que soporte HTML5 podrás verlo en funcionamiento en el siguiente ejemplo:

Resultados de la búsqueda de la palabra ‘poyaque’

  1. El señor de los poyaques…
  2. el cliente y su temido poyaque

No hay comentarios:

Publicar un comentario