29 abril 2012

Qué son los Encabezados o Headings y por qué es Importante usarlos

Estoy trabajando en mejorar el uso de encabezados en mi blog, y una de las funcionalidades que recientemente implementó Blogger en el panel de edición de entradas, será de gran ayuda. Me refiero a la herramienta que permite agregar encabezados o headings (en inglés) desde los posts. Esto viene a complementar parte del trabajo que pudiera ayudar a mejorar el  SEO del blog desde tus entradas y además le da accesibilidad a tu blog.

¿Qué son los encabezados o headings?

Los encabezados o headings (en inglés), nos permiten estructurar el contenido de una página, destacando los títulos de los distintos apartados o secciones de dicha página.

Para definir los encabezados, se utilizan las etiquetas h1, h2, h3, h4, h5, h6.

Recientemente Blogger incorporó en el panel de edición de entradas las etiquetas h2, h3, y h4 a las que llama respectivamente así:
Encabezado = h2
Subencabezado= h3
Encabezado secundario = h4

Por lo que es más sencillo crear secciones o apartados en las entradas y poner dichas etiquetas como ttitulos de éstas.

¿Cómo agregar o poner los encabezados en los posts?


Como mencionaba al principio, Blogger recientemente dispuso una opción desde el panel de edición de entradas, para que agregar encabezados a los títulos de los distintos apartados de tu post sea más sencillo.

Para poner un encabezado al texto de un apartado en un post, tendrás que seleccionar el texto usando el botón izquierdo del mouse, luego, desplegar las opciones del menú desplegable que aparece en el panel de edición de entradas de Blogger, como se muestra abajo...





...y seleccionar el encabezado. La etiqueta se agrega automáticamente al texto. Lo puedes comprobar si echas un vistazo al HTML de la entrada. Ahí verías algo como esto, (el texto que está dentro es sólo como ejemplo)
<h3> Importancia económica y distribución geográfica del jitomate </h3>


¿Por qué debemos usar encabezados?


1. A tus usuarios les será más fácil dirigirse o acceder a contenido de interés dentro del post
Al utilizar encabezados en las páginas del blog, cualquier usuario vidente que ingrese a una página, podrá reconocer a simple vista los distintos apartados o secciones en el post, y así le será posible acceder al contenido que le interese de forma más sencilla.

Algunos navegadores como Opera, permiten desplazarse por la página de encabezado a encabezado, así que, si los usamos en el blog, quienes usen ese navegador y dicha opción, se moverán por la página cómodamente.

Pensarás que esto también se puede conseguir fácilmente, si cambiamos el tamaño de la fuente y poniéndola con negrita por ejemplo, al usar las herramientas del panel de edición de entradas.
Es cierto, pero en realidad la práctica recomendada es el uso de los encabezados, ya que esto define la importancia de cada puesto dentro del post, más allá de la presentación de los textos.


2. Hace nuestra página Web más accesible 
Otro punto importante, es que al usar encabezados, les facilitarás la tarea a usuarios invidentes que utilicen un lector de pantalla para leer tu contenido, ya que estos podrán recibir información acerca de la estructura del contenido y además podrán desplazarse de apartado en apartado fácilmente.

3. Puede ayudar en el posicionamiento en los motores de búsqueda
Le ayudas a Google a entender la estructura de tu sitio y cuanto mejor lo entienda más posibilidades de mostrar resultados "relevantes" sobre tu sitio.

Algo que pudiera entrar a discusión, es la importancia o valor que le dan los buscadores al contenido de los encabezados para mostrar tu contenido, es decir, si el simple hecho de usar una etiqueta h1 en el titulo de una entrada, por ejemplo, sería un factor importante al momento de posicionar la página. Puede pensarse que tiene cierta lógica ya que, ¿de qué otro modo puede saber Google con más exactitud de qué habla una página? Sin embargo hay que tomar en cuenta que Google considera más de 200 factores para posicionar una página, por lo tanto, el simple hecho de poner una etiqueta h1 en el titulo de un artículo, por si sola no garantiza un mejor posicionamiento.

4. Mejora la legibilidad de la página.
Otro aspecto interesante, y que puedes haber notado es que, el navegador de forma automática asigna un tamaño en la fuente, de mayor a menor según el encabezado, sin que tu tengas prescritos en tu plantilla "CSS" para definir su presentación.

Así pues un texto que tenga encabezado h2, será más grande que el que tenga h3, el que tenga h3 mayor que el de h4 diferenciándose así del resto del contenido de cada apartado de una entrada, aún cuando no cargara el CSS de la página.


¿Cómo usar los encabezados o headings en una página?


En la página de la Universidad de Alicante, explican cómo usar correctamente los encabezados en una página. Ahí muestran un ejemplo claro que muestra la estructura de una página individual, lo que sería un post. 


Si observamos el ejemplo, podemos apreciar el orden de las jerarquías van desde h1, hasta h3, empezando por el título del post, usando encabezado  h1.

Algo que nos recomiendan es nunca saltarse el orden de los encabezados,  por ejemplo usar h2 es los títulos del post, y luego, pasarse a la etiqueta h4.

Ciertos blogs o páginas utilizan el encabezado h1, en los posts, ya que en teoría, esto te ayudaría a posicionarte mejor en los motores de búsqueda, lo cierto es que mantener esa etiqueta en el título del blog, y agregarla también al título del post, se estaría duplicando el uso de una etiqueta que se recomienda usar solo una vez.

Dependiendo del contenido del post yo agrego encabezados h2 y h3. Los títulos de mis posts, tienen por defecto la etiqueta h2, que cambie y que tú también puedes cambiar desde la edición de HTML de la plantilla.


Conclusiones:
El uso correcto de encabezados en nuestras páginas Web, las hacen más accesibles para cualquier usuario, ayuda a los motores de busqueda como Google a entender la estructura de nuestro contendido y teniendo habilitada la opción para agregarlos desde nuestros posts, hace su uso muy sencillo ;)


Referencias:
accesibilidadweb.dlsi.ua.es
SEO