Orden de enfoque
Silktide encuentra elementos que anulan el orden en el que los usuarios de teclado se desplazan por la página. De forma predeterminada, al pulsar Tab se avanza por los enlaces y los controles de formulario en el orden en que aparecen en el código de la página; un atributo tabindex positivo impone un orden personalizado, lo que casi siempre es un error.
<!-- Obliga a que este campo se alcance antes que cualquier otro en la página -->
<input tabindex="1" name="search">
Por qué es importante
Los usuarios de teclado esperan que la tecla Tab recorra una página en un orden predecible que coincida con lo que ven. Un tabindex positivo secuestra ese orden: el foco salta primero a los elementos numerados y luego vuelve al resto, lo que puede hacer que el salte por toda la página. Además, es frágil: añadir posteriormente un elemento nuevo implica renumerarlo todo, y suele romperse cuando las páginas cambian.
Cómo solucionarlo
- Elimina los valores positivos de
tabindexy deja que el orden natural del determine el orden de tabulación. - Si el orden natural resulta confuso, reordena los elementos en tu HTML (usando CSS para la maquetación visual) en lugar de parchearlo con
tabindex. - Los demás valores de
tabindexson correctos y no se marcan:tabindex="0"hace que un elemento sea enfocable con el teclado en su posición natural, útil para controles personalizados.tabindex="-1"saca un elemento de la navegación con Tab, útil para elementos que se enfocan mediante script, como los diálogos.
Cómo lo prueba Silktide
- Encuentra todos los elementos de la página con un atributo
tabindexexplícito. - Marca cada elemento cuyo
tabindexsea mayor que 0 como un posible problema para que lo confirmes. - Los valores de 0 o inferiores no se marcan.
Solución de problemas
Usamos tabindex positivo de forma deliberada
Rara vez, el orden del código de una página no puede coincidir con su orden lógico, y los valores positivos de tabindex son la única solución. Si has verificado que el orden de tabulación tiene sentido recorriendo la página con Tab, puedes marcar el hallazgo como comprobado.