Etiquetas H
Contenido
¿Qué son y por qué utilizar etiquetas H en un sitio web?
Las etiquetas H (del inglés Headings) son encabezados o títulos que se encargan de estructurar el contenido de los sitios web de forma significativa y jerárquica. De este modo, mejoran la legibilidad de las páginas y, además, permiten que los motores de búsquedas reconozcan las partes importantes de un texto.
Esto es así porque, cuando una persona visita una página web, lo normal es que primero escudriñe el texto utilizando solo los títulos. De esta forma, puede hacerse una idea general del contenido y de si la información es relevante.
Ahora bien, este comportamiento no es exclusivo de las personas, ya que los buscadores como Google funcionan de manera similar, es decir, utilizan los encabezados para entender mejor el contenido y la estructura de una página.
Por todo ello, vamos a ver cómo definir correctamente los encabezados en HTML y qué aspectos debemos tener en cuenta a la hora de elegir los títulos tanto para el SEO como para las y los visitantes.
Comprueba tus encabezados con SEO Checker
Comprueba si los encabezados de tu página están bien estructurados
¿Cómo definir los encabezados en HTML?
En el código HTML de un sitio web, los encabezados se definen mediante una etiqueta HTML especial, existiendo 6 jerarquías de estos, de H1 hasta H6.
La H significa "encabezado" y el número expresa su importancia, disminuyendo su relevancia del H1 a H6. Las etiquetas H de HTML tiene el siguiente aspecto:
<h1> Encabezado H1 </h1> <h2> Encabezado H2 </h2> <h3> Encabezado H3 </h3> <h4> Encabezado H4 </h4> <h5> Encabezado H5 </h5> <h6> Encabezado H6 </h6>
Ejemplo
Para que quede más claro, vamos a verlo con un ejemplo:
Imaginemos una página web que contiene un texto sobre diferentes tipos de zapatos. La etiqueta H1 de esta página, en este caso, sería "zapatos".
A continuación podemos dividir el contenido por temporadas, implementando etiquetas H2 como "Zapatos de verano" y "Zapatos de invierno". Ahora bien, podemos segmentar estas secciones aún más, de modo que en la sección de "Zapatos de verano", también podemos añadir etiquetas de encabezado H3 como "Sandalias", "Chanclas" o "Zapatillas".
¿Cómo escribir los encabezados H?
Vamos a ver qué aspectos debemos tener en cuenta a la hora de elegir unos encabezados que estén bien optimizados desde un punto de vista SEO pero sin olvidar la experiencia de las y los usuarios.
Encabezado H1
El encabezado H1 es el más importante de una página web, ya que actúa como su título principal. Por lo tanto, el H1 tiene que: 1. resumir todo el contenido de la página, 2. contener las palabras clave de SEO más importantes (lo más a la izquierda posible) y 3. despertar el interés del público por el contenido.
Así pues, cada página debe contar con un único encabezado H1 porque, aunque Google ya ha confirmado que no detecta ningún problema si se emplean múltiples H1s [1], sí que puede confundir a las usuarias y usuarios.
Por lo tanto, se pueden utilizar varias etiquetas de encabezado H1 pero solo cuando sea absolutamente necesario y si el contenido es muy extenso. Además, incluso de ser así, tampoco hay que exagerar y en la mayoría de los casos un encabezado H1 debería ser suficiente.
Igualmente, el H1 no debería ser ni demasiado corto ni demasiado largo. Se suele trabajar con los 80 caracteres como referencia, de manera que el contenido sea informativo pero también conciso.
Entre los errores más frecuentes que se cometen al implementar una etiqueta de encabezado H1 destacan, por ejemplo, una redacción muy general ("Bienvenidas a nuestra web") o utilizar el mismo encabezado H1 para varias páginas (como el nombre de la empresa).
Aspectos generales a la hora de elegir los encabezados
Básicamente, un encabezado debe coincidir siempre con el contenido de una página y, si es posible, contener las palabras clave SEO más importantes.
No obstante, estas palabras clave deben reflejar siempre el contenido real del texto. De no ser así, los títulos construidos con el único fin de hacer SEO pueden ser reconocidos y castigados por Google, ya que no aportan ningún valor a los usuarios y las usuarias.
Eso sí, una etiqueta H debe contener inevitablemente la keyword principal, siempre y cuando la página web esté estructurada de forma lógica y contenga contenido de alta calidad.
Por lo tanto, al seleccionar una etiqueta H de HTML, también hay que asegurarse de estructurar el texto de manera lógica y resumir el tema central de la página, teniendo en cuenta que las etiquetas de encabezado deben contener la información esencial para que las y los cibernautas sepan de qué trata la página sin tener que leer cada párrafo por completo.
Básicamente, se puede comparar un sitio web con un documento de Word: al igual que este documento, es preciso dividir la página en párrafos mediante etiquetas H de HTML significativas y así estructurarla de forma lógica y jerárquica.
Otra cosa a considerar para el SEO es respetar el orden correcto y jerárquicamente descendente de las etiquetas de encabezado HTML, es decir, primero viene el H1, seguido del H2, luego el H3, etc. No se puede omitir ningún nivel jerárquico (por ejemplo, H4 no puede seguir a H2, omitiendo H3).
Todo esto sin perder de vista la cantidad de etiquetas H utilizadas, cuya relación debe ser adecuada con la cantidad total de texto. Así, mientras que un número excesivo de títulos ya no tiene valor para las y los lectores, un número insuficiente de ellos puede hacer que un texto sea confuso y difícil de comprender.
Ninguna etiqueta H (salvo el H1) debe aparecer una sola vez en una página HTML, porque de lo contrario también podría omitirse. Aquí vuelve a ser útil la comparación con un documento de Word, donde, por ejemplo, el punto o título numerado 3.1 nunca debe ir sin el punto 3.2.
Otro aspecto importante que a menudo se ignora, es el hecho de que las etiquetas de encabezado sólo deben utilizarse para el marcado semántico del texto en HTML y no para el ajuste óptico del tamaño de la fuente, etc. La disposición y el tamaño de la etiqueta H pueden adaptarse posteriormente mediante CSS.
Las etiquetas H no deben emplearse para elementos de navegación como menús o enlaces ni tampoco para el diseño del sitio web (por ejemplo, formulario de contacto, blogroll, etc.), sino referirse siempre al contenido específico de una página.
Referencias
- ↑ Multiple H1 Headings: How to Handle Them for SEO & Accessibility? Google Search Central YouTube Channel. Recuperado: 27.10.2022.
Ampliar conocimientos
| Sobre las autoras y autores: |
 |
Contenidos relacionados