H1, H2 Y H3: Cómo Utilizar Correctamente Las Etiquetas De ...

Qué son las etiquetas H3, H4…

Las etiquetas H3 en adelante nos permiten definir títulos de subapartados de un bloque encabezado con un H2. Su incidencia en SEO es más limitada, y por ello no es habitual ni recomendable el trabajar los titulares a partir de H4.

El orden lógico de los titulares debería ser el que apareciera en primer lugar el titular H1, después todos los H2 y después todos los H3. También es habitual el trabajar con H1, H2 y H3 como títulos de capítulo, apartados y epígrafes, de forma que aparezca primero el titular H1, después un H2 con sus subapartados marcados con H3, después otro H2 y sus subapartados, y así sucesivamente.

Quitar todos los elementos restantes de tu sitio web y dejar sólo los titulares deberían en la mayoría de los casos dar una idea del contenido de tu página, tal cual lo hace un índice en un libro: las etiquetas de encabezado deben describir la estructura del artículo.

La relación entre titulares y texto debe tener una proporción razonable: intentar utilizar más encabezados de la cuenta no es una ventaja, sino un error que hará que la importancia que tratamos de dar a nuestras palabras clave acabe completamente ignorada.

Dando estilo a los titulares

Puedes utilizar CSS para definir los tamaños y estilo de los textos. De todos modos, piensa que el SEO es al fin y al cabo tratar de mejorar nuestros resultados en los buscadores, y éstos quieren ofrecer la mejor experiencia al usuario y contenidos de calidad. Es decir, puedes modificar las propiedades CSS de una forma lógica, pero no deberías hacer por ejemplo un H1 excesivamente pequeño respecto al texto de contenido, o los buscadores percibirán que algo raro tratas de hacer. Del mismo modo, la jerarquía de tamaños entre H1, H2 y el resto de titulares debería seguir una cierta lógica.

Dentro de los titulares es técnicamente posible incluir otros elementos de estilo, como spans y otras etiquetas que nos permitan modificar cómo se ve finalmente el contenido de otra etiqueta. Sin embargo, como regla general, si podemos mantener el contenido de la etiqueta H únicamente como un texto sin aditivos, será más eficaz. Sí es posible aplicar sin problemas estilos, y preferentemente clases, a la etiqueta del titular.

Google no reconoce por el momento textos en imágenes, por lo que hacer que tu H1 sea una imagen no es en absoluto una buena idea. Si no queda otro remedio que utilizar imágenes, vuelve a pensar si realmente no puedes hacerlo en texto. Si pese a todo decides utilizar imágenes para un titular, asegúrate de que esta imagen tenga un texto alternativo. Si ese titular está enlazado, deberías añadir también el atributo Title a la etiqueta A para indicar el contenido de la misma.

Otra opción para incorporar una imagen a un titular es colocar la imagen de fondo del H1, e incorporar un padding a esta etiqueta que haga que el texto quede fuera de la zona de visión. Es algo que funciona visualmente, pero de nuevo insisto en que no es en absoluto aconsejable el jugársela con estas tácticas en el elemento más importante de nuestro documento.