Estructura jerárquica de contenido con etiquetas de encabezado Hx

El uso de encabezados de contenido en los sitios web es un tema bastante popular que generó numerosos mitos que persisten incluso hoy. Entonces, ¿qué son las etiquetas de encabezado, por qué se usan y cómo implementar una estructura óptima de etiquetas de encabezado en un sitio web?

• 1 ¿Qué son los títulos?
• 2 Use contenido importante en las etiquetas de encabezado Hx
• 3 ¿Qué dice Google sobre las etiquetas de encabezado Hx?
• 4 Otra información esencial sobre los títulos de contenido

¿Qué son los encabezados?

Las etiquetas de encabezado se utilizan para presentar la estructura del contenido a los usuarios (también rastreadores de navegador web). Hay seis tamaños de encabezados, de H1 a H6 , aunque el primero de ellos es el de mayor relevancia (es el encabezado más importante), mientras que H5 y H6 se usan con poca frecuencia.

Dado que las etiquetas de encabezado Hx contienen texto que es (debería ser) significativamente más grande que el resto del contenido , es una pista visual para los usuarios que les permite comprender lo que describen los párrafos debajo de ellos. El uso de encabezados de varios tamaños para representar la estructura jerárquica facilita que los usuarios digieran el contenido.

En la sintaxis HTML, usamos etiquetas entre corchetes <>:

 <h1>Título 1</h1>
<h2>Título 2</h2>
<h3>Título 3</h3>
<h4>Encabezado 4</h4>
<h5>Encabezado 5</h5>
<h6>Encabezado 6</h6>

pero en un sitio web se verán, por ejemplo, así (obviamente, dependiendo de una hoja de estilo):

Se pueden encontrar ejemplos de usos aquí: https://www.w3schools.com/html/html_headings.asp.

Use contenido importante en las etiquetas de encabezado Hx

Cuando casi todos los días aparecen nuevas publicaciones de blog, noticias, guías o artículos de expertos, vale la pena atraer al usuario no solo con una imagen bonita o un título atractivo, sino también con contenido estructurado.

Al leer un artículo específico en un dispositivo móvil, los lectores a menudo prestan atención principalmente a los encabezados. Además de los aspectos puramente estéticos, una estructura adecuada de los encabezados facilita la interpretación y la digestión del contenido, por lo que existe la posibilidad de que un usuario permanezca más tiempo en un sitio web determinado.

No solo los usuarios pueden beneficiarse de un sitio web bien estructurado: los rastreadores también pueden hacerlo porque el texto del encabezado también les importa. Por eso es tan importante que las etiquetas de encabezado incluyan palabras clave que estarán relacionadas con el contenido de la página en términos de tema. Si apuntamos a una página específica con palabras clave específicas, es conveniente ponerlas (incluso en una forma diferente) en los encabezados; naturalmente, se pueden colocar en el texto, pero dentro de una razón.

Una estructura debe estar claramente definida y los encabezados deben diferir en tamaño unos de otros. Sería un error darles el mismo estilo que el cuerpo del texto o no distinguirlos por importancia.

Encabezados Hx en artículos

Mientras escribimos publicaciones de blog, podemos usar encabezados de manera creativa. Debes definir la estructura de tu artículo antes de comenzarlo. Los encabezados pueden ser cruces que dividen párrafos individuales (como en este mismo artículo), y el más importante de ellos <h1> puede usarse para describir el tema. Con frecuencia se define automáticamente en una plantilla de sitio web, por lo que si no es el caso, vale la pena hacer un cambio discutido con un experto en SEO y un desarrollador web.

Una estructura bien diseñada de un artículo puede hacer que se vea más atractivo. El contenido interesante colocado en los encabezados informará claramente a los lectores (y a los rastreadores) lo que deben esperar de un artículo determinado.

¿Qué etiquetas de encabezado poner en la página de inicio del sitio web?

Las páginas de inicio (o cualquier otra página, por ejemplo, páginas de servicios) también deben tener una estructura jerárquica de encabezados. En la sección <head>, es recomendable colocar H1, debajo de H2, H3 y así sucesivamente, aunque no hay un número máximo de etiquetas de encabezado. Incluso en el caso de H1, no necesita limitarse a un solo encabezado (como se explica más adelante).

Sin embargo, debe recordar que secciones como "Acerca de nosotros" o "Más información" colocadas en los encabezados no agregan mucho en términos de contenido. Además, usar encabezados de menor importancia, por ejemplo, H5–H6, no tiene mucho sentido (excepto por el aspecto del diseño de un artículo).

¿Sitios web de una página = una etiqueta de encabezado H1?

En el caso de los sitios web de una sola página, no es tan obvio como en los artículos de blog. En las especificaciones de HTML5 (https://www.w3.org/TR/2014/REC-html5-20141028/sections.html), puede encontrar la etiqueta <section> responsable de definir secciones individuales en un documento HTML. Una sección suele incluir un encabezado, por lo que cada sección puede tener una estructura jerárquica diferente, por ejemplo:

 <sección id=”acerca de”>
 <h1>Sobre mí</h1>
 <p>Un texto sobre mí :)</p>
 <h2>Mi nombre es David...</h2>
 <p>Segundo párrafo sobre mí. jajaja :)</p>
</sección>

<sección id=”cartera”>
 <h1>Mi cartera</h1>
 <p>Mis últimos proyectos...</p>
</sección>

<sección>
 <h1>Testimonios</h1>
 <p>Opiniones de clientes satisfechos...</p>
 <h2>Últimos tuits</h2>
 <p>Twitter 1</p>
 <p>Twitter 2</p>
</sección>

<sección>
 <h1>Contacto</h1>
</sección>

Como puedes ver arriba, cada sección tiene un encabezado H1 diferente, luego un encabezado H2… Aunque puedes decidir tener una o más etiquetas de encabezado H1 y posteriormente H2, H3, etc.

¿Qué dice Google sobre la etiqueta Hx?

Los empleados de Google hablaron mucho sobre las etiquetas de encabezado, pero vale la pena citar sus últimas opiniones. Hace un año, John Meuller escribió lo siguiente en Google Forum for Webmasters: https://productforums.google.com/forum/#!msg/webmasters/BmyI8YX_25A/81hZNQFJDQA

“No tratamos HTML5 de manera diferente y tener múltiples etiquetas H1 en una página está bien. Sea razonable al usarlos, utilícelos donde tengan sentido. Definitivamente no hay penalización por usar H1”.

Un poco más tarde, en abril de 2017, John respondió brevemente en Twitter (https://twitter.com/JohnMu/status/852131231928135680) a una pregunta sobre cuántos encabezados H1 se pueden usar en una sola página.

Finalmente, como parte de la serie de YouTube "SEO Snippets" en el Canal para webmasters de Google, se cargó una breve guía sobre ese tema:

Otra información esencial sobre los encabezados de contenido

Aunque los empleados de Google sugieren (al menos en sus declaraciones oficiales) un enfoque flexible para las etiquetas de encabezado, hay algunas reglas que vale la pena seguir:

• No abusar de los encabezados de una página
• Use encabezados donde tenga sentido y cuando reflejen el texto debajo de ellos para ayudar a los usuarios a determinar dónde comienza y termina un párrafo determinado
• No pongas párrafos enteros (todo el contenido) en un encabezado
• No use solo palabras clave, especialmente en una forma poco natural
• No oculte títulos en el cuerpo del texto utilizando el mismo tamaño de fuente tanto para el título como para el cuerpo del texto.
• Mantener ordenada la jerarquía de la estructura.
• Quizás use la etiqueta <strong> a veces en lugar de una etiqueta de encabezado ????.

Al crear contenido, ni sobreoptimice ni suboptimice; en su lugar, busque un equilibrio y concéntrese en los sentimientos de los usuarios que digieren el contenido de su sitio web, incluidos artículos, guías u otras publicaciones de blog. Después de todo, los encabezados son determinantes de clasificación para el motor de búsqueda de Google y es por eso que no debes descuidarlos.