Principio 1/1.3 Adaptable/1.3.1-C
De WCAG Wiki
< Principio 1 | 1.3 Adaptable
1.3.1-C. Estructura lógica de encabezados
- Nivel: A
- Versión: 2.2
- Principio: 1_Perceptible
- Pauta: 1.3_Adaptable
- Grupo: Estructura y relaciones
- Subgrupo: Jerarquía de encabezados
Discapacidades afectadas
Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.
-
Visual total –
Barrera grave
-
Baja visión –
Barrera moderada
-
Cognitiva –
Barrera leve
Enunciado del criterio (Observatorio de Accesibilidad Web)
- La información, estructura y relaciones comunicadas a través de la presentación pueden ser determinadas por software o están disponibles como texto.
Comprensión del criterio
Descripción resumida
La página debe tener una jerarquía de encabezados coherente. La secuencia h1 → h2 → h3 debe seguir un orden lógico, sin saltos innecesarios, para que lectores de pantalla y otras ayudas técnicas detecten correctamente la estructura del contenido.
Objetivo
Garantizar que la estructura jerárquica del contenido se puede interpretar y navegar fácilmente mediante software, manteniendo su coherencia incluso con cambios de diseño o formato.
Importancia de cumplir el criterio
Los encabezados son puntos de referencia esenciales. Muchas personas con discapacidad visual navegan únicamente mediante la lista de encabezados. Saltos o desorden en la jerarquía (por ejemplo, pasar de h1 a h3 sin un h2 previo) pueden generar confusión, aumentar la carga cognitiva y dificultar la navegación.
Referencias WCAG
- H42: Using h1-h6 to identify headings
- F43: Failure due to incorrect heading structure
Recursos de apoyo
- Los encabezados deben resumir su contenido asociado y ser breves
- Evitar saltos de nivel (ej. no pasar de h1 a h3)
- Debe existir un único h1 como título principal
- Comprobar que la jerarquía refleja la estructura real del contenido
Evaluación del criterio
Tipo de evaluación
Evaluación Semiautomática
Procedimiento de evaluación
- Abrir extensión HeadingsMap para visualizar la jerarquía.
- Verificar que la estructura h1 → h2 → h3 es lógica y sin saltos.
- Comprobar que existe un único <h1>.
- Asegurar que los niveles de encabezado reflejan la estructura real del contenido.
Resultado esperado
La jerarquía de encabezados es correcta, sin saltos de nivel y con un único título principal (<h1>).
Ejemplo
Ejemplo correcto:
<h1>Título página</h1> <h2>Sección 1</h2> <h3>Subsección 1.1</h3>
Ejemplo incorrecto:
<h1>Título página</h1> <h3>Subtema mal jerarquizado</h3>
Otras herramientas de evaluación
-
Bookmarklet diagnóstico encabezados:
Arrastra este botón a tu barra de marcadores y podrás ejecutarlo y ver los encabezados de otras páginas.
Ver encabezados/títulos - Lectores recomendados: JAWS, NVDA, VoiceOver.
-
Inspección del navegador: Revisar si todos los títulos de la página, se muestran bajo código HTML de encabezados (
<h1>-<h6>)
Ejemplos accesibles y no accesibles creados por alumnos
Comentarios
A continuación se muestran comentarios sobre el criterio 1.3.1-C. Estructura lógica de encabezados
Loading comments...
