2.4.6 Encabezados y etiquetas
Criterio de éxito oficial
Los encabezados y las etiquetas describen el tema o el propósito.
Alcance del criterio
Este criterio no exige que existan encabezados ni etiquetas (eso lo hacen 1.3.1 y 3.3.2). Solo requiere que, si existen, sean descriptivos. Un encabezado genérico como «Sección 1» o una etiqueta de campo como «Campo 1» fallan este criterio.
¿Qué es?
Los encabezados y etiquetas actúan como señales de navegación. Un usuario de lector de pantalla puede saltar entre encabezados para entender la estructura de la página. Un usuario con baja visión puede usar los encabezados como puntos de referencia visual.
¿Por qué es importante?
Los encabezados descriptivos permiten a los usuarios de lectores de pantalla saltar directamente a la sección que necesitan. Las etiquetas descriptivas en formularios eliminan la ambigüedad sobre qué datos se deben introducir.
Un encabezado genérico como «Sección» no ayuda a nadie. Un encabezado como «Criterios de auditoría» comunica el propósito de la sección inmediatamente.
¿Quién se ve afectado?
Personas ciegas: Usan la lista de encabezados del lector de pantalla para navegar. Encabezados descriptivos les permiten ir directamente a la sección correcta.
Personas con discapacidades cognitivas: Encabezados y etiquetas claros reducen la carga cognitiva y hacen los formularios más comprensibles.
Personas con baja visión: Usan los encabezados grandes como puntos de referencia visual al escanear la página con software de ampliación.
Cómo implementar 2.4.6
Encabezados descriptivos
Cada encabezado debe describir el contenido que lo sigue, no su posición estructural:
<!-- ✗ Vagos -->
<h2>Sección 1</h2>
<h2>Más información</h2>
<!-- ✓ Descriptivos -->
<h2>Proceso de auditoría WCAG</h2>
<h2>Tarifas y plazos de entrega</h2>Etiquetas de formulario descriptivas
<!-- ✗ Etiquetas genéricas -->
<label for="c1">Campo 1</label>
<input id="c1" type="text">
<!-- ✓ Etiquetas descriptivas -->
<label for="empresa">Nombre de la empresa</label>
<input id="empresa" type="text" autocomplete="organization">Relación con otros criterios
Este criterio trabaja en conjunto con otros criterios para garantizar una experiencia completa:
Criterios complementarios
Ejemplos prácticos
Correcto Encabezados descriptivos en artículo largo
Un artículo técnico usa encabezados como «Instalación de dependencias», «Configuración inicial» y «Pruebas de accesibilidad». Un usuario de lector de pantalla puede saltar directamente a la sección que necesita.
Correcto Etiquetas claras en formulario de contacto
Un formulario usa «Nombre completo», «Correo electrónico», «Asunto de la consulta» y «Mensaje». Cada etiqueta describe exactamente qué información se espera.
Fallo Encabezados numerados
Una página de documentación usa «Capítulo 1», «Capítulo 2», «Capítulo 3» como encabezados. Un usuario de lector de pantalla no puede determinar qué contiene cada capítulo sin navegar hasta él.
Técnicas recomendadas
| Código | Técnica | Tipo |
|---|---|---|
| G130 | Proporcionar encabezados descriptivos | Suficiente |
| G131 | Proporcionar etiquetas descriptivas | Suficiente |
Errores comunes
- Encabezados genéricos como «Sección», «Información» o numerados como «Sección 1».
- Etiquetas de formulario como «Campo 1», «Dato» o que no describen el tipo de información esperada.
- Encabezados que simplemente repiten el título de la página sin añadir contexto específico.
- Etiquetas que describen el formato pero no el propósito («Texto», «Número» en lugar de «Nombre» o «Teléfono»).