2526UFV3.2.3-A-001
Edición de la página como formulario
1. Información básica
Enlace directo a la página del subcriterio en la wiki https://wikiwcag.udl.cat/2526UFV3.2.3-A-001
2. Ejemplos prácticos
2.1. Ejemplo NO accesible
a) Imagen
No se ha subido ninguna imagen.
b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.
2.1.2. Código HTML:
Página A
<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>
Página B
<nav aria-label="Navegación principal"> <ul> <li><a href="/">Inicio</a></li> <li><a href="/contacto">Contacto</a></li> <li><a href="/productos">Productos</a></li> <li><a href="/soporte">Soporte</a></li> </ul> </nav>
Explicación del problema detectado:
En este ejemplo, los mismos enlaces de navegación aparecen de forma recurrente en distintas páginas del sitio web, pero no mantienen el mismo orden relativo. Esta variación en la disposición de los elementos provoca que la estructura de navegación no sea predecible, obligando al usuario a adaptarse constantemente a cambios innecesarios. La falta de coherencia dificulta la orientación y el aprendizaje del funcionamiento del sitio, incumpliendo el criterio 3.2.3 Navegación coherente.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Personas con discapacidad cognitiva: los cambios en el orden del menú aumentan la carga cognitiva, ya que el usuario no puede apoyarse en la memoria ni en patrones previamente aprendidos.
Personas ciegas o con baja visión que utilizan lectores de pantalla: al variar el orden del contenido en el código, la lectura secuencial cambia entre páginas, lo que genera desorientación y pérdida de contexto.
Barreras generadas: Dificultad para localizar enlaces habituales de manera rápida. Sensación de falta de control y previsibilidad durante la navegación. Incremento del tiempo y esfuerzo necesarios para completar tareas.
2.2. Ejemplo Accesible
2.2.1. Evidencia de imagen:
a) Imagen
No se ha subido ninguna imagen.
b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.
2.2.2 Código HTML:
Página A y Página B
<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>
Explicación de la solución aplicada:
En este caso, los mecanismos de navegación que se repiten a lo largo del sitio web conservan exactamente el mismo orden relativo y la misma posición en todas las páginas. Esta coherencia permite que los usuarios identifiquen rápidamente los elementos de navegación, desarrollen expectativas claras sobre su ubicación y naveguen de forma más eficiente y segura. De este modo, el sitio cumple con el criterio 3.2.3 Navegación coherente, garantizando una experiencia predecible.
