ARTÍCULO 33: HTML5. Nuevas etiquetas semánticas. (IV)


Migración de HTML 4 a HTML5

Hasta que aparecieron las etiquetas semánticas las web podían estar bien estructuradas en cuanto a la organización del contenido, pero esta organización no estaba reflejada en el código o estaba reflejada de formas particulares. Por ejemplo, es bastante común organizar el contenido con DIV añadiéndoles un ID apropiado, por ejemplo ID="cabecera", ID=menu", etc. (o un CLASS). En estos casos migrar o adaptar estas páginas a etiquetas semánticas es bastante sencillo, basta sustituir la etiqueta DIV por la correspondiente etiqueta semántica manteniendo el ID o el CLASS.

Por otro lado, si queremos que una página HTML5 se vea bien en navegadores antiguos debemos incluir cierto código, por ejemplo, el proporcionado por Modernizr, o por Shiv.

¿Es necesario migrar las webs antiguas para utilizar etiquetas semánticas?

La respuesta fácil es decir que "sí". Pero sería mejor decir "depende". Hay que poner en una parte de la balanza el beneficio que obtendremos, y en la otra parte el trabajo que nos cuesta. Si somos excépticos, la única ventaja de usar etiquetas semánticas sería mejorar en los buscadores, ya que podemos tener bien organizada la página con DIV. Si tenemos mal organizada la estructura de la página, esta no se va a arreglar con sólo colocar las etiquetas semánticas.

Si tenemos mucho interés en que nuestra página aparezca bien posicionada en los buscadores, quizás nos compense el esfuerzo de realizar la adaptación.

Pero ¿qué caso hace Google de las etiquetas semánticas? ¿alguien lo sabe con certeza? Google no suele dar datos exactos de cómo funciona su algoritmo de posicionamiento, y por lo tanto, no se sabe la influencia real del uso de etiquetas semánticas.

Sorprende porque Google no habla explícitamente de las etiquetas semánticas en sus principales consejos para indexar una página, mientras que sí lo hace con la etiqueta TITLE y el atributo ALT. Por lo menos a la hora de escribir este artículo: Directrices Google.

Personalmente, creo que Google, se fía más de lo que su algoritmo deduce sobre la estructura de la página, que de lo que ponemos en estas etiquetas semánticas. Google lleva muchos años analizando las páginas web en función de muchos parámetros y posiblemente las etiquetas semánticas sean un parámetro más.

Google sabe que algunos diseñadores intentan engañarles para mejorar el posicionamiento y con las etiquetas semánticas sucede como con las etiquetas META, que definen las palabras clave para la búsqueda pero que no tienen porqué corresponder realmente con el contenido de la página. Por esto Google da mucha importancia al texto real de la página para detectar usos inapropiados.

Además, hay otros mecanismos para establecer la semántica de una página web, es lo que se conoce como Web semántica.

La base de la web semántica es añadir metadatos semánticos a las páginas, estos metadatos adicionales que describen el contenido y el significado de los datos se deben proporcionar de manera formal, para que así sea posible evaluarlas automáticamente por programas.

Para ello existen páginas como schema.org, donde se definen estos metadatos. Existen diferentes formas de codificar los metadatos, en concreto, Google admite tres: JSON-LD, microformatos y RDFA. Por ejemplo, en la imagen siguiente se ve cómo describir un artículo/noticia (NewsArticle).

Ambos conceptos, web semántica y etiquetas semánticas, parecen similares y deberian estar relacionados, sin embargo, no parece que sea así. En la documentación de la web semántica no se encuentran referencias claras a las etiquetas semánticas. En este ejemplo de la estructura de Microdata, utilizada por Google para crear los metadatos, no se utilizan las etiquetas semánticas. Vemos como se define un "artículo/noticia" se usando las etiquetas DIV y H2. Ver la página del ejemplo de microdata.

microdata

Esto no quiere decir que no podamos utilizar en una misma página las etiquetas semánticas y los metadatos semánticos.

En cualquier caso, debemos utilizar las etiquetas semánticas, sobre todo en las nuevas páginas, ya que forman parte del estándar de HTML5 y ayudan a definir mejor la estructura de la página web y también a su posicionamiento en los buscadores.

Para saber más

Estucturas semanticas w3c.

Wikipedia: Web semántica.

Datos estructurados para Google.

Compatibilidad navegadores:Modernizr

Compatibilidad navegadores:Shiv