Diferencia entre revisiones de «Principio 3/3.2 Predecible/3.2.3-A»
De WCAG Wiki
Sin resumen de edición |
Sin resumen de edición |
||
| Línea 12: | Línea 12: | ||
|wcag_subgrupo=Navegacion | |wcag_subgrupo=Navegacion | ||
|wcag_subcriterio_url=Principio_3/3.2_Predecible/3.2.3-A | |wcag_subcriterio_url=Principio_3/3.2_Predecible/3.2.3-A | ||
|wcag_discapacidades= | |||
<li class="discapacidad-item"> | |||
[[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]] | |||
<span class="discapacidad-texto">[[:Categoría:Discapacidad cognitiva|Cognitiva]]</span> – | |||
<span class="gravedad gravedad-moderada">Barrera moderada</span> | |||
</li> | |||
<li class="discapacidad-item"> | |||
[[Archivo:Bajavision.png|20px|class=icon-discapacidad|alt=Baja visión]] | |||
<span class="discapacidad-texto">[[:Categoría:Discapacidad baja visión|Baja visión]]</span> – | |||
<span class="gravedad gravedad-leve">Barrera leve</span> | |||
</li> | |||
|wcag_lista_discapacidades= | |||
[[Categoría:Discapacidad cognitiva]] | |||
[[Categoría:Discapacidad baja visión]] | |||
|wcag_texto_criterioOAW= | |wcag_texto_criterioOAW= | ||
| Línea 17: | Línea 33: | ||
|wcag_descripcion_resumida= | |wcag_descripcion_resumida= | ||
Los elementos de navegación repetidos | Los menús, cabeceras, pies y otros elementos de navegación repetidos mantienen la misma posición y orden en todas las páginas del sitio. | ||
|wcag_objetivo= | |wcag_objetivo= | ||
Facilitar que las personas aprendan el patrón de navegación y localicen opciones de forma predecible y eficiente en todo el sitio. | |||
|wcag_importancia= | |wcag_importancia= | ||
La consistencia reduce la carga cognitiva, mejora la orientación y beneficia a usuarios con dificultades cognitivas, baja visión y a quienes usan lectores de pantalla. | |||
|wcag_referencias= | |wcag_referencias= | ||
| Línea 29: | Línea 45: | ||
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/consistent-navigation.html Understanding Success Criterion 3.2.3: Consistent Navigation]</span></li> | <li><span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/consistent-navigation.html Understanding Success Criterion 3.2.3: Consistent Navigation]</span></li> | ||
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/quickref/#consistent-navigation WCAG Quick Reference – 3.2.3]</span></li> | <li><span lang="en">[https://www.w3.org/WAI/WCAG22/quickref/#consistent-navigation WCAG Quick Reference – 3.2.3]</span></li> | ||
<li>[https://webaim.org/techniques/usability/#consistency WebAIM — Consistency | <li>[https://webaim.org/techniques/usability/#consistency WebAIM — Consistency and Predictability]</li> | ||
</ul> | </ul> | ||
|wcag_recursos= | |wcag_recursos= | ||
<ul> | <ul> | ||
<li> | <li>Patrones de diseño consistentes (design systems)</li> | ||
<li>Landmarks | <li>Landmarks semánticos: <code><nav></code>, <code><header></code>, <code><aside></code>, <code><footer></code></li> | ||
</ul> | </ul> | ||
| Línea 42: | Línea 58: | ||
|wcag_pasos_evaluacion= | |wcag_pasos_evaluacion= | ||
<ol class="paso-list"> | <ol class="paso-list"> | ||
<li><span class="paso-badge">Paso 1.</span> Identificar elementos de navegación repetidos.</li> | <li><span class="paso-badge">Paso 1.</span> Identificar elementos de navegación repetidos (menú global, buscador, footer, sidebar).</li> | ||
<li><span class="paso-badge">Paso 2.</span> | <li><span class="paso-badge">Paso 2.</span> Revisar varias páginas y comprobar que mantienen el mismo orden relativo y posición.</li> | ||
<li><span class="paso-badge">Paso 3.</span> Validar etiquetas | <li><span class="paso-badge">Paso 3.</span> Validar que las etiquetas (texto/ARIA) y el orden de tabulación son consistentes.</li> | ||
<li><span class="paso-badge">Paso 4.</span> Verificar con teclado y lector de pantalla.</li> | <li><span class="paso-badge">Paso 4.</span> Verificar con teclado y lector de pantalla la previsibilidad de la navegación.</li> | ||
</ol> | </ol> | ||
|wcag_resultado_evaluacion= | |wcag_resultado_evaluacion= | ||
Los | Los mecanismos de navegación repetidos conservan el mismo orden relativo y posición en todas las páginas del sitio. | ||
|wcag_ejemplo_evaluacion= | |wcag_ejemplo_evaluacion= | ||
| Línea 67: | Línea 83: | ||
<div class="accessibility-card"> | <div class="accessibility-card"> | ||
<strong>✅ | <strong>✅ Variación justificada en navegación secundaria</strong> | ||
<pre class="wcag-codigo-html"> | <pre class="wcag-codigo-html"> | ||
<nav aria-label="Navegación principal">…</nav> | <nav aria-label="Navegación principal">…</nav> | ||
<nav aria-label="Submenú de sección actual">…</nav> | <nav aria-label="Submenú de la sección actual">…</nav> | ||
</pre> | </pre> | ||
</div> | </div> | ||
| Línea 76: | Línea 92: | ||
|wcag_otras_herramientas_evaluacion= | |wcag_otras_herramientas_evaluacion= | ||
<ul> | <ul> | ||
<li>Comparación | <li>Comparación entre páginas (capturas / inspección DOM)</li> | ||
<li>Revisión de | <li>Revisión de landmarks y roles</li> | ||
<li>Navegación | <li>Navegación por teclado</li> | ||
<li> | <li>NVDA, JAWS, VoiceOver</li> | ||
</ul> | </ul> | ||
}} | }} | ||
Revisión del 12:18 5 nov 2025
- Nivel: AA
- Versión: 2.0
- Principio: 3_Comprensible
- Pauta: 3.2_Predecible
- Grupo: Consistencia
- Subgrupo: Navegacion
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 enlaces y mecanismos de navegación que se repiten en un sitio web deben aparecer siempre en el mismo orden relativo.
Comprensión del criterio
Descripción resumida
Los menús, cabeceras, pies y otros elementos de navegación repetidos mantienen la misma posición y orden en todas las páginas del sitio.
Objetivo
Facilitar que las personas aprendan el patrón de navegación y localicen opciones de forma predecible y eficiente en todo el sitio.
Importancia de cumplir el criterio
La consistencia reduce la carga cognitiva, mejora la orientación y beneficia a usuarios con dificultades cognitivas, baja visión y a quienes usan lectores de pantalla.
Referencias WCAG
Recursos de apoyo
- Patrones de diseño consistentes (design systems)
- Landmarks semánticos:
<nav>,<header>,<aside>,<footer>
Evaluación del criterio
Tipo de evaluación
Evaluación Manual
Procedimiento de evaluación
- Paso 1. Identificar elementos de navegación repetidos (menú global, buscador, footer, sidebar).
- Paso 2. Revisar varias páginas y comprobar que mantienen el mismo orden relativo y posición.
- Paso 3. Validar que las etiquetas (texto/ARIA) y el orden de tabulación son consistentes.
- Paso 4. Verificar con teclado y lector de pantalla la previsibilidad de la navegación.
Resultado esperado
Los mecanismos de navegación repetidos conservan el mismo orden relativo y posición en todas las páginas del sitio.
Ejemplo
✅ Navegación consistente
<nav aria-label="Navegación principal">
<ul>
<li><a href="/">Inicio</a></li>
<li><a href="/productos">Productos</a></li>
<li><a href="/soporte">Soporte</a></li>
<li><a href="/contacto">Contacto</a></li>
</ul>
</nav>
✅ Variación justificada en navegación secundaria
<nav aria-label="Navegación principal">…</nav> <nav aria-label="Submenú de la sección actual">…</nav>
Otras herramientas de evaluación
- Comparación entre páginas (capturas / inspección DOM)
- Revisión de landmarks y roles
- Navegación por teclado
- NVDA, JAWS, VoiceOver
Ejemplos accesibles y no accesibles creados por alumnos
Comentarios
A continuación se muestran comentarios sobre el criterio 3.2.3-A. Navegación coherente
Loading comments...
