Marketing publicidad

Claves para organizar tu web semánticamente

web semantica con html

¿Has escuchado hablar de “Web Semántica” o “Web 3.0“?

Este nuevo concepto se refiere a la capacidad de un software de interpretar los datos de la forma más humana posible, yendo más allá de la simple entrada y salida de datos y procesando la información semánticamente.

Esto se produce mediante dos mecanismos: la inclusión de etiquetas o metadatos semánticos y la estructuración del contenido de forma jerarquizada.

El contenido:

La inclusión de metadatos semánticos sirve para ser interpretados por los navegadores y buscadores, beneficiando las búsquedas y el acceso a la información de todos los usuarios de la red.

Para la identificación y catalogación de la información tenemos varios mecanismos, los más conocidos son RDF, MICROFORMATOS y MICRODATOS:

RDF (Resource Definition Framework)

Es un conjunto de extensiones que aporta una descripción simple del contenido de la Web. Ejemplo:

<span property=”v:title”>TÍTULO DEL ARTÍCULO O PÁGINA</span>
<span property=”v:url”>www.urldelaweb.es </span>

Los microformatos son porciones de códigos HTML (o XHTML)

Permiten estructurar información aprovechando los atributos “id” o “class” empleadas por algunas etiquetas del HTML.

Microdatos HTML 5

También conocidos como fragmentos enriquecidos. Algunos ejemplos:

<span itemprop=”title”> Título del artículo o página </span>
<span itemprop=”url”> www.urldelaweb.es </span>
<span itemprop=”description”>Descripción</span>
<span itemprop=”keywords”>Etiquetas o palabras clave</span>
<span itemprop=”creator”>Autor del contenido</span>

Los tres tipos tratan de resolver el mismo problema de forma diferente, siendo el mecanismo más cómodo, sencillo y valorado por Google los microdatos o fragmentos enriquecidos. Estos aportan un significaco adicional a los contenidos y agrupan todas las etiquetas semánticas, diferenciándolas de las utilizadas para la función visual. Además utilizan un vocabulario como es el de schema.org .

Para el testeo de los mismos, Google nos ofrece una herramienta muy útil: http://www.google.com/webmasters/tools/richsnippets

Cimientos y estructura de la Web

En segundo lugar, el concepto de web semántica no solo se ciñe a los contenidos, sino que se expande también a los cimientos y la estructura de la propia web.

Si antes organizábamos la estructura mediante <div> identificando cada parte mediante identificadores y clases, ahora se estructura mediante nuevas etiquetas introducidas por HTML5, creando un estándar que ayude a los buscadores a identificar cada sección de nuestra web fácilmente.

Las principales etiquetas HTML5 para estructurar la web son:

<header></header>: Para designar la cabecera y donde se incluye normalmente el logotipo, el título y los datos de contacto.
<nav></nav>: Define el menú o navegador principal.
<section></section>: Utilizada para representar diferentes bloques de contenidos.
<article></article>: Contenido específico de la web. Ejemplo: artículos, entradas, comentarios, etc. Debe de contener un pequeño header o title y un footer.
<aside></aside>: Utilizada para contenidos secundarios o prescindibles como botones, publicidad, citas, enlaces externos, etc.
<footer></footer>: define el pié de página.

Un ejemplo de estructura sería:

estructura web semántica
De esta forma, nuestro contenido queda perfectamente estructurado de manera semántica y por jerarquía, lo que ayudará a los motores de búsquedas a identificar el contenido principal y a otras herramientas como los “screen reader” o lectores de pantallas para personas con discapacidad visual a interpretar correctamente los contenidos.

Como podemos observar, con los nuevos mecanismos los contenidos y su estructura van acercándose cada vez más al lenguaje natural humano, permitiendo búsquedas cada vez más exactas y personalizadas. Por ello, una web semánticamente organizada, tendrá más posibilidades de aparecer entre los primeros resultados en los buscadores, y de ahí la importancia de esta catalogación.

1 Estrella2 Estrellas3 Estrellas4 Estrellas5 Estrellas (2 votos, promedio: 5,00 de 5)
Cargando…

Sé generoso. Comparte :)

¿Quién ha escrito esto?

Natalia Fernández

Web & Desing Manager en marketingpublicidad

Comenta, queremos saber tu opinión