Como usar los encabezados h1 a h6 en html

Como usar los encabezados h1 a h6 en html

Print Friendly, PDF & Email
Valora esta entrada

Una duda frecuente cuando estamos aprendiendo html es como debemos usar las etiquetas h1 a h6.

En estos casos suelo responder que escribir una página web es muy parecido a escribir un libro. O un argumento.

Se trata de seguir una idea principal y desarrollarla tanta como distintos prismas queramos darle.

Debes tener muy clara que idea quieres perseguir. Generalmente aquella que te interesa que se posicione en Internet.

La longitud y la organización de los contenidos que vayamos a publicar son una cuestión clave.

Estructura de árbol

Pensemos en un ensayo.

Siempre tiene presentación, desarrollo y conclusión.

Una web se escribe igual.

Típicamente encontraremos una explicación inicial de la idea. Este es el lugar adecuada para introducir un h1.

En esta introducción se suelen explicar los puntos que se trataran en el escrito.

Cada uno de estos puntos es un lugar perfecto para introducir un encabezado h2.

En función de la longitud del texto que encontremos dentro de cada una de las ideas a desarrollar podremos tener diversos puntos de vista. Cada uno de estos puntos de vista podría ser introducido por un h3.

Y así sucesivamente hasta completar una estructura de árbol.

árbol con ramas
Ramas de un árbol

Cada zona de la web tiene su propio peso y debe ser diferenciada

Si pensamos en términos de lectura más que de web podemos encontrar una respuesta muy intuitiva que nos ayudará a redactar y distribuir los contenidos prácticamente en cualquier página web.

Cada encabezado aportará un peso relativo a un contenido

Típicamente diferenciaremos entre la cabecera (header), el cuerpo central (main), los laterales (aside) y el pie de página (footer).

Header y cuerpo central

Un h1 lo pondría en el encabezado o en el cuerpo principal.

Hay quien dice que no pasa nada por poner 2 h1 en un texto si el contenido es muy largo.

Personalmente no me gusta porqué pienso que diluyes la importancia del h1.

Es tan importante el contenido como en que lugar de la web vamos a ponerlo.

Main

El main es el cuerpo central del documento.

Es el lugar dónde vamos a exponer y desarrollar nuestras ideas.

Aquí deberemos hacer aparecer nuestros h2 y h3.

A poder ser haz un esfuerzo por encontrar sinónimos y conceptos relacionados con tu idea clave de la publicación.

Laterales

Entiendo los laterales como un espacio dónde poner contenido auxiliar.

Incluso algún menú de navegación.

Es importante no diluir los contenidos desarrollados en el main.

Para mi gusto usaría aquí los h3 y h4.

Pie de página

En el pie de página usaría h3 y h4.

layout ejercicio capas

¡Hola querido lector!

Por norma general diremos que debes intentar que toda la página tenga una coherencia y que los pesos queden distribuidos de un modo lógico en función del mensaje que quieras dar y a que contenidos quieras darle una mayor importancia.

La idea de árbol también te puede ayudar mucho.

En cualquier caso, hagas lo que hagas, si eres capaz de encontrar un criterio lógico entonces es que lo estás haciendo bien.

Nos leemos mañana, como siempre, con un nuevo contenido sobre web.

Francesc Ricart
hola@francescricart.com

Aprender y enseñar. Enseñar y aprender. En el ámbito docente soy docente ocupacional. En el ámbito profesional consultor web. Ofrezco servicios de mejora continua y mantenimiento web. ¿Qué quieres aprender hoy? Encontraréis más acerca de mi en la página sobre mi

No hay comentarios

Escribir un comentario

  Acepto la política de privacidad

Responsable: FRANCESC RICART MUÑOZ.

Finalidad: Gestionar los comentarios que realizas en este blog.

Destinatarios: No se cederán datos a terceros, salvo obligación legal.

Derechos: Tienes derecho a acceder, rectificar y suprimir los datos, así como otros derechos, como se explica en la política de privacidad.