Principio 3/3.2 Predecible/3.2.4-A
De WCAG Wiki
3.2.4-A. Identificación coherente
- Nivel: AA
- Versión: 2.0
- Principio: 3_Comprensible
- Pauta: 3.2_Predecible
- Grupo: Consistencia
- Subgrupo: Identificacion
Discapacidades afectadas
Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.
-
Cognitiva –
Barrera moderada
-
Baja visión –
Barrera leve
Enunciado del criterio (Observatorio de Accesibilidad Web)
- Los elementos con una misma funcionalidad y que se repiten a través de las páginas de un sitio web se deben identificar de forma coherente.
Comprensión del criterio
Descripción resumida
Componentes que tienen la misma función deben usar nombres, iconos y etiquetas consistentes en todas las páginas del sitio web.
Objetivo
Identificar de forma consistente funcionalidades que se repiten en un conjunto de páginas web, facilitando comprensión, reconocimiento y predictibilidad.
Importancia de cumplir el criterio
Si los elementos que realizan la misma acción se etiquetan o representan de manera diferente en distintas páginas, las personas con dificultades cognitivas, quienes usan lectores de pantalla o dependen de reconocimiento visual pueden confundirse y perder eficiencia.
Referencias WCAG
Recursos de apoyo
- Design systems accesibles (nomenclatura, iconografía y patrones)
- Patrones semánticos y ARIA coherentes en formularios y navegación
Evaluación del criterio
Tipo de evaluación
Evaluación Manual
Procedimiento de evaluación
- Paso 1. Identificar elementos repetidos (botones, iconos, enlaces, menús, formularios) a lo largo del sitio.
- Paso 2. Comparar nombres visibles, iconos y etiquetas entre páginas con la misma funcionalidad.
- Paso 3. Verificar consistencia del nombre accesible (p. ej.,
aria-label,aria-labelledby) y del rol. - Paso 4. Confirmar coherencia en navegación por teclado y con lectores de pantalla.
Resultado esperado
Los elementos que cumplen la misma función mantienen identificación coherente (texto, icono y nombre accesible) en todo el sitio.
Ejemplo
✅ Accesible: misma etiqueta y función en todo el sitio
<!-- Todas las páginas --> <button aria-label="Buscar">Buscar</button>
✅ Alternativa accesible: icono con nombre accesible coherente
<!-- Icono de lupa; el nombre accesible mantiene la identificación --> <button aria-label="Buscar"> <svg aria-hidden="true" focusable="false">…</svg> </button>
Otras herramientas de evaluación
- Revisión integral entre páginas
- DevTools → panel de accesibilidad (nombre computado)
- NVDA, JAWS, VoiceOver
- Guía de estilo / design system del proyecto
Ejemplos accesibles y no accesibles creados por alumnos
Comentarios
A continuación se muestran comentarios sobre el criterio 3.2.4-A. Identificación coherente
Loading comments...
