Focusvolgorde
Silktide vindt elementen die de volgorde overschrijven waarin toetsenbordgebruikers door de pagina gaan. Standaard gaat de Tab-toets door koppelingen en formulierbesturingselementen in de volgorde waarin ze in de code van de pagina staan; een positief tabindex-attribuut forceert een aangepaste volgorde, wat vrijwel altijd een fout is.
<!-- Zorgt ervoor dat dit veld vóór al het andere op de pagina wordt bereikt -->
<input tabindex="1" name="search">
Waarom dit belangrijk is
Toetsenbordgebruikers verwachten dat de Tab-toets hen in een voorspelbare volgorde door een pagina leidt die overeenkomt met wat ze zien. Een positieve tabindex kaapt die volgorde: de focus springt eerst naar de genummerde elementen en daarna terug naar al het andere, waardoor de door de pagina kan springen. Dit is ook kwetsbaar: als er later één nieuw element wordt toegevoegd, moet alles opnieuw worden genummerd. Bovendien gaat dit vaak mis wanneer pagina's veranderen.
Zo lost u dit op
- Verwijder positieve
tabindex-waarden en laat de natuurlijke volgorde van de de tabvolgorde bepalen. - Als de natuurlijke volgorde verwarrend is, wijzig dan de volgorde van de elementen in uw HTML (gebruik CSS voor de visuele indeling) in plaats van dit met
tabindexte verdoezelen. - De andere
tabindex-waarden zijn prima en worden niet gemarkeerd:tabindex="0"maakt een element toetsenbordfocusbaar op zijn natuurlijke positie, wat handig is voor aangepaste bedieningselementen.tabindex="-1"verwijdert een element uit de Tab-navigatie, wat handig is voor elementen die door een script de focus krijgen, zoals dialoogvensters.
Hoe Silktide dit test
- Zoek elk element op de pagina met een expliciet
tabindex-attribuut. - Markeer elk element waarvan
tabindexgroter is dan 0 als een mogelijk probleem dat u moet controleren. - Waarden van 0 en lager worden niet gemarkeerd.
Problemen oplossen
We gebruiken bewust positieve tabindex-waarden
In zeldzame gevallen kan de codevolgorde van een pagina echt niet overeenkomen met de logische volgorde en zijn positieve tabindex-waarden de enige oplossing. Als u hebt gecontroleerd dat de tabvolgorde logisch is door met Tab door de pagina te gaan, kunt u de bevinding als gecontroleerd markeren.