Los encabezados pueden ser un tema difícil. En el artículo de hoy vamos a ver el uso efectivo de las etiquetas que designan los titulares.

Con una revisión rápida de la jerarquía de los encabezados de nuestro sitio conseguiremos una mejora tanto en usabilidad como en el ranking de los motores de búsqueda.

El tamaño no importa

Cuando primero comencé a aprender HTML, parecía lógico utilizar las etiquetas de título cuando deseaba fuentes grandes. Esto es un error común de novato. Para un diseñador de páginas web que acaba de empezar, los usos adecuados de las etiquetas H1- H6 pueden no ser tan obvios.

Estas etiquetas no deben utilizarse simplemente porque ofrecen variantes rápidas en los tamaños de fuente, este es un trabajo que vamos a dejarle al CSS. Esto permite al diseñador centrarse en hacer que el código sea relevante a los contenidos que debe mostrar.

Los encabezados tienen una misión mucho más importante en la semántica de un sitio web. Ellos ayudan a destacar la jerarquía de los contenidos. Vamos a aplicar esta idea de la jerarquía a este sitio de muestra:

¿Cómo organizar los titulares en el sitio de arriba? ¿Cuál es el elemento más importante para una página? ¿Cuáles son secundarios a otras piezas?

Aquí hay una interpretación de los encabezados de acuerdo con el contenido de la lista de arriba.

No siempre existe una solución general a la organización de los encabezados del sitio. En realidad, se reduce a cuál es el contenido en el que deseas poner el foco, y cuál puede caer en el fondo.

Hacer un Esquema

Cuando se utiliza lógicamente, la jerarquía de cabecera debería formar un esquema.

¿Necesitas ayuda para visualizarlo? El validador HTML del W3C tiene una característica muy útil que arma un esquema basado en la jerarquía de etiquetas de cabecera. He aquí un ejemplo usando la página principal de Smashing Magazine.

Los títulos deben reflejar la estructura lógica del documento, no deben utilizarse simplemente para dar énfasis, o para cambiar el tamaño de la fuente.

Un inconveniente del servicio de esquema del W3C es que sólo funciona en documentos HTML válidos.

Afortunadamente, existe una alternativa para todos aquellos que no viven o mueren por la validación de la página con la barra de herramientas Web Developer para Firefox. En la barra de herramientas, vayan a Información> Ver Esquema del documento para obtener un esquema al que no le importa si has incluido una etiqueta ALT o no.

Diggea esa jerarquía

Digg es un ejemplo excelente de jerarquía de titulares bien arreglada, mientras se mantiene una página simple; sin necesidad de sobrecargarla. Incluso con grandes cantidades de contenido, la página principal de Digg sólo mantiene 3 niveles de profundidad.

Cosechar los frutos

El arreglo adecuado de los titulares no es sólo una buena práctica idealista. Tiene algunas ventajas muy reales, especialmente cuando se trata de la optimización del motor de búsqueda.

Los motores de búsqueda serán capaces de rastrear e indexar tus páginas con mucha más eficacia si las etiquetas están ayudando a indicar las partes importantes. Con un arreglo inteligente de palabras clave, puedes aumentar los resultados de búsqueda para cualquier cantidad de temas.

Fuente: Build Internet

¿Te gusta este artículo? Compártelo con tus amigos!