2526UPSA2.1.1-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/Principio_2/2.1_Teclado_Accesible/2.1.1-A
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:
<a href="#" class="menu" onclick="return false;">
<span class="icon"></span>
<span class="title">Secciones</span>
</a>
Explicación del problema detectado:
El enlace está implementado de forma que anula su comportamiento por defecto mediante onclick="return false".
Aunque el elemento recibe foco con la tecla TAB, no ejecuta ninguna acción al activarse con ENTER o ESPACIO, por lo que la funcionalidad no es operable mediante teclado.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Personas con discapacidad motriz o visual
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:
<button aria-label="Abrir menú" class="layout-header-icon layout-header-std__icon" data-qa-id="layout-header-toggle-menu"><svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg" class="layout-header-icon__icon"><path fill-rule="evenodd" clip-rule="evenodd" d="M64 32.97H0V32h64v.97zm0 15.515H0v-.97h64v.97zM0 64h64v-.97H0V64z" fill="currentColor"></path></svg></button>
Explicación de la solución aplicada:
El elemento principal es un <button>, que recibe automáticamente el foco cuando se navega con Tab desde el teclado.
Se puede activar con Enter o Espacio, cumpliendo la norma de que toda la funcionalidad sea operable por teclado.
