2526UPSA2.1.4-A-000

De WCAG Wiki

Edición de la página como formulario

1. Información básica

Id del criterio: 2.1.4 - Atajos del teclado (Nivel: A)
Título del subcriterio: 2.1.4-A
Universidad participante: UPSA
Curso académico: 2025-26

Enlace directo a la página del subcriterio en la wiki https://wikiwcag.udl.cat/Principio_2/2.1_Teclado_Accesible/2.1.4-A



2. Ejemplos prácticos

2.1. Ejemplo NO accesible

2.1.1. Evidencia en imagen y enlace:
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:

<script> document.addEventListener('keydown', (event) => { if (event.key === "+") { darLike(); console.log("Like activado en vídeo"); desactivarFoco(); event.preventDefault(); } } </script>



Explicación del problema detectado:
En un ejemplo donde un usuario esté escribiendo o instruyendo la transcripción por voz de un comentario en una aplicación web de vídeos tipo YouTube, si llegara a pulsar la tecla "+", o si el transcriptor de voz detectara al usuario diciendo "más" (como por ejemplo, "me gustaría más información") y lo interpretara pulsando "+", se daría like en el vídeo sobre el que se está haciendo un comentario sin haber tenido la intención de hacerlo, además de desenfocar el input de texto e interrumpir la introducción de texto.

Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Personas con discapacidades motrices (párkinson, esclerosis múltiples, parálisis cerebral o artritis) que son incapaces de realizar movimientos finos y por lo tanto usar el teclado de forma precisa, pulsarían varias veces la tecla "+", causando el problema. También personas que no pueden usar el teclado (tetraplejia, discapacidad intelectual) y tienen que dictar el texto por voz, al mencionar la palabra "más" podrían incurrir en el problema. Finalmente, también personas con discapacidades cognitivas podrían sentirse confundidas o inseguras con la herramienta al suceder el hecho.


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:

<script> document.addEventListener('keydown', (event) => { if (configuracionUsuario === 'apagado') { return; } else if (configuracionUsuario === 'modificador') { if (event.key === '+' && event.altKey) { event.preventDefault(); darLike(); } } else if (configuracionUsuario === 'foco') { const reproductor = document.getElementById('mi-video-player'); if (document.activeElement === reproductor && event.key === '+') { event.preventDefault(); darLike(); } } }); function darLike() { console.log("Like activado"); } </script>



Explicación de la solución aplicada:
Se ha modificado el código no accesible, introduciendo varios requisitos ahora antes de poder dar like a través del atajo de teclado: el usuario debe tener los atajos de teclado activados, y posteriormente, pulsar simultáneamente en Alt y + para dar like. Alternativamente, el usuario también puede tener igualmente los atajos de teclado activados, tener el foco dentro del vídeo y pulsar "+" para activar el like.