La etiqueta <h6> tiene la funcionalidad de establecer un Título de Encabezado de Sexto nivel de importancia en determinada sección o contenido general del documento HTML a visualizar para el Visitante o Usuario.

Como cualquier editor o visualizador de texto, los Títulos de Encabezado requieren de ciertos niveles de importancia para organizar y dar jerarquía a sus contenidos, en HTML, también se requieren de estos niveles de importancia para sus Títulos de Encabezado. Así, el elemento h6 pertenece a un conjunto de Elementos de Títulos de Encabezado en el HTML, y que es necesario explicar de forma conjunta:

Elementos de Títulos de Encabezado

Los Elementos de Título de Encabezado se conforman por su etiqueta de apertura, su contenido y su etiqueta de cierre. Su contenido implica unicament texto y/o elementos en línea, exclusivamente.

Los elementos de Títulos de Encabezado, implementan seis niveles de encabezados en el documento, de <h1> a <h6>. La etiqueta <h1> implica que es la más importante, y la etiqueta <h6>, implica que es la menos importante. Un elemento de Título de Encabezado describe brevemente el tema de la sección que presenta. La información de los Títulos de Encabezado puede ser usada por agentes de usuario, como por ejemplo, para construir una tablas de contenidos para un documento automáticamente.

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

Recomendaciones de Uso:

• Evite el uso de elementos de Títulos de Encabezado con niveles inferiores para cambiar el tamaño de un texto. En su lugar, utilice la propiedad font-size del CSS.
• Evite omitir niveles de los Títulos de Encabezado: siempre comience con <h1>, después use <h2> y así sucesivamente.
• Utilice solo un elemento de Título de Encabezado <h1> por página o vista. Y esta debería describir de una manera general y concisa el propósito del contenido que encabeza. Todos los Títulos de Encabezado posteriores deben comenzar con <h2>.
• Cuando se usan secciones, como por ejemplo, con el elemento <section>, debe usarse un <h1> por sección. De igual manera, todos los Títulos de Encabezado posteriores deben comenzar con <h2>.

Accesibilidad

Para las personas con problemas visuales, requieren de una navegación a través de lectores de pantalla, en el que normalmente su funcionamiento se basa en primera instancia en leer los Títulos de Encabezado. De esta forma, conocer rápidamente en contenido de la página en poco tiempo; por esta razón es importante prestar atención a nuestros Títulos de Encabezado y no saltarse ningún nivel o podríamos con confundir a estos usuarios.

No hacer

<h1>Título nivel 1</h1>
<h3>Título nivel 3</h3>
<h4>Título nivel 4</h4>

Sí hacer

<h1>Título nivel 1</h1>
<h2>Título nivel 3</h2>
<h3>Título nivel 3</h3>

Los Títulos de Encabezado también pueden anidarse para generar sub-secciones en nuestros documentos HTML. Esto, para los Lectores de Pantalla; les beneficiara notablemente para mayor interpretación de la organización y jerarquía del contenido.

Atributo	Descripción
lang	Establece el idioma del contenido en un Elemento HTML.

Este elemento soporta Atributos de Evento HTML.

Restricciones

El atributo align es obsoleto; no debe utilizarse más.

CSS

Configuración CSS Predeterminada

La mayoría de los navegadores web desplegará el elemento <h6> con los siguientes valores por defecto:

h1 {
  display: block;
  font-size: 0.67em;
  margin-top: 2.33em;
  margin-bottom: 2.33em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

Ejemplos

Ejemplos CSS

Para fines de mayor comprensión, a continuación veremos algunos ejemplos para modificar la visualización de los Títulos de Encabezado con estilos CSS.

Ejemplo 1:

<h1 style="background-color:DodgerBlue;">Hola Mundo</h1>
<h2 style="color:Tomato;">Hola mundo</h2>

 

Hola mundo

Hola mundo

 

Ejemplo 2:

<h1 style="text-align:center">Título 1</h1>
<h2 style="text-align:left">Título 2</h2>
<h3 style="text-align:right">Título 3</h3>
<h4 style="text-align:justify">Título 4</h4>

Título 1

Título 2

Título 3

Título 4