focus-order-semantics
Los elementos añadidos al orden de tabulación deberían tener semántica interactiva
Marca los elementos con tabindex >= 0 cuyo rol explícito es un rol estructural/de documento no interactivo (por ejemplo, heading, list, note, presentation), para revisión manual.
Ámbito de aplicación. Elementos con un tabindex explícito de 0 o superior (en el orden de tabulación) Y un atributo role explícito que se resuelve en uno de un conjunto seleccionado de roles claramente no interactivos, estructurales/de documento. El atributo es una lista de reserva: su primer token conocido y no abstracto, sin distinguir mayúsculas de minúsculas, es el rol (role="foo HEADING" es un encabezado, role="foo" no es ningún rol).
Resultado esperado. Un elemento colocado deliberadamente en el orden de tabulación debe comunicar por qué es enfocable: un rol como heading, list, note o presentation no le da a la tecnología de asistencia ninguna semántica interactiva que anunciar, lo cual resulta confuso para los usuarios de teclado que llegan a él y no reciben ninguna indicación de qué ocurriría (si algo) al activarlo.
Qué informa un hallazgo.
tabindex: eltabindexdel elemento, como número (0 o mayor).role: el rol no interactivo que lleva el elemento.
Estos campos de data.details ayudan a leer y reproducir un hallazgo. Salvo reasonCode y los pocos campos que Esquema de salida indica como estables, no son un contrato estable: un campo puede cambiar de nombre o desaparecer en una versión menor, así que no construyas sobre ellos.
Ejemplos
<div role="heading" tabindex="0">Fake focusable heading</div>
Un rol heading no tiene comportamiento interactivo, así que hacerlo enfocable con tabulación es inusual y merece revisión.
<div role="button" tabindex="0">Real custom button</div>
role="button" es un rol interactivo, por lo que ser enfocable con tabulación es lo esperado.
Cómo comprobarlo
Cuando esta regla no puede decidir, informa cantTell y deja la pregunta a una persona. Cada pregunta que puede plantear aparece aquí bajo su código de motivo, con los pasos para responderla. Un hallazgo lleva los mismos pasos en howToCheck, en el idioma del análisis. Consulta Esquema de salida.
TABBABLE_WITH_NON_INTERACTIVE_ROLE
- Pulsar Tab hasta que el foco llegue al elemento que indica el informe y escuchar con un lector de pantalla, o leer su rol en el panel Accesibilidad.
- Averiguar por qué es enfocable: ¿se desplaza (su contenido desborda y las teclas de flecha lo desplazan), o hace algo al hacer clic o al pulsar Intro o Espacio?
- Si actúa como un control, comparar el rol anunciado con lo que hace.
Se cumple. El elemento es enfocable por un motivo que su rol admite, como una región desplazable que quien usa el teclado necesita desplazar, y no actúa como un control.
No se cumple. El elemento actúa como un control (abre, alterna o navega) pero se anuncia con un rol no interactivo, como heading o list, así que a quienes usan el teclado no se les dice qué hace; un incumplimiento de buena práctica relacionado con WCAG 4.1.2. Si no hace nada y no se desplaza, es una parada de tabulación innecesaria.