Normativas · WCAG 2.2

SC 2.1.1 Nivel A WCAG 2.0

Teclado

Toda función de la página debe poder operarse únicamente con el teclado, sin que se requieran movimientos de ratón, arrastres ni temporalizaciones específicas. Los usuarios de lectores de pantalla, dispositivos de conmutación y control por voz dependen de esta base fundamental.

Qué exige este criterio

Toda la funcionalidad del contenido debe poder operarse mediante una interfaz de teclado, sin que se exijan temporalizaciones específicas para las pulsaciones de tecla individuales. El usuario debe poder alcanzar cada elemento interactivo con Tab, activarlo con Intro o Espacio, y operar los componentes complejos con las teclas de flecha y otras combinaciones estándar.

Existen dos excepciones reducidas: la entrada que depende de la trayectoria del movimiento del usuario (dibujo a mano alzada, firma de un documento), y no solo de los puntos de inicio y fin, y la entrada que reproduce una acción analógica del mundo real en la que la trayectoria es relevante.

Cómo cumplirlo

  • Utilizar elementos interactivos nativos (<button>, <a href>, <input>, <select>): son operables por teclado de forma predeterminada.
  • Para los componentes personalizados construidos con <div> o <span>, añadir role, tabindex="0" y manejadores de teclado para Intro, Espacio, Escape y las teclas de flecha según corresponda al patrón.
  • Seguir la Guía de prácticas de autoría de ARIA para menús, pestañas, cuadros combinados, diálogos y vistas de árbol: cada uno tiene un modelo de interacción por teclado definido.
  • Proporcionar un equivalente de teclado para cada gesto exclusivo de ratón: el arrastrar y soltar necesita una alternativa de reordenación mediante botones; los menús que solo se muestran al pasar el puntero necesitan apertura por clic; los carruseles desplazables con gestos de deslizamiento necesitan botones de anterior/siguiente.
  • Verificar desconectando el ratón y recorriendo el flujo completo.

Fallos habituales

  • <div onclick> sin role="button", tabindex="0" ni manejador de teclado: completamente invisible para los usuarios de teclado.
  • Menús desplegables personalizados donde el disparador es accesible pero las opciones no son navegables con las teclas de flecha.
  • Tableros kanban de arrastrar y soltar, cargadores de archivos o herramientas de lienzo sin alternativa por teclado.
  • Botones de cierre de modal presentes en el marcado pero sin manejador de la tecla Escape.
  • Tooltips y menús que solo aparecen al pasar el puntero y nunca se muestran bajo el foco de teclado.
  • Carruseles y galerías de imágenes que solo pueden operarse con gestos de deslizamiento o haciendo clic en indicadores sin tabindex.

axe y Lighthouse detectarán la ausencia de tabindex y de nombres accesibles, pero no pueden determinar si el menú desplegable personalizado responde correctamente a las teclas de flecha: esa parte requiere verificación manual.

Por qué es importante

Este es el criterio de conformidad más importante en lo que respecta a la operabilidad. Los usuarios de lectores de pantalla navegan por teclado. Los usuarios de dispositivos de conmutación emulan el teclado. Los usuarios de control por voz emiten comandos que se traducen en eventos de teclado. Los usuarios avanzados con lesiones por esfuerzo repetitivo dependen de él. Un sitio que no cumple el criterio 2.1.1 excluye en la práctica a toda persona que no pueda usar un ratón, y ese grupo es mucho más amplio de lo que resulta evidente a primera vista.