Interactieve elementen, zoals links en knoppen, moeten hun status aangeven en te onderscheiden zijn van niet-interactieve elementen. Om te controleren of interactieve elementen hun doel en status aangeven, gebruikt u zowel een visuele test als een schermlezertest.
Handmatig testen
Interactieve elementen moet u visueel en met schermlezers testen.
Test visuele focus
Als u de visuele focus handmatig wilt testen, bladert u door uw pagina.
- Kun je naar elk interactief element TAB-en ?
- Wanneer u bij een interactief element komt, is er dan een visuele aanwijzing dat gebruikers ermee kunnen communiceren?
- Verandert elk interactief element van uiterlijk wanneer u het selecteert?
Er zijn veel manieren om de focusindicatoren voor elk interactief element vorm te geven. Eén manier is om de pseudo-klasse :focus te stylen. Die stijl wordt elke keer toegepast wanneer het element wordt gefocust, ongeacht het invoerapparaat of de methode die wordt gebruikt om het te focusseren.
Meer informatie over het stylen van focus .
Test met schermlezers
Gebruik een schermlezer om door uw pagina te navigeren en controleer of de schermlezer de naam van elk interactief besturingselement, de rol van dat besturingselement en de huidige interactieve status aankondigt. Als de rol van een element onduidelijk is en de status van het element onduidelijk is, moet u mogelijk de juiste ARIA-rollen toevoegen.
Meer informatie vindt u in Aangepaste besturingselementen hebben ARIA-rollen .
Het is ook belangrijk om goed te letten op de manier waarop interactieve elementen worden gelabeld. Gebruikers van schermlezers en andere ondersteunende technologieën vertrouwen op labels om de context van dat element te begrijpen. Vage labels komen vaak voor en zijn niet nuttig bij het navigeren door de inhoud. Leer hoe u labels en tekstalternatieven kunt verbeteren.
Waarom dit ertoe doet
Door visuele hints te geven over wat een besturingselement doet, kunnen mensen uw site beter bedienen en navigeren. Deze hints worden 'affordances' genoemd. Affordances maakt het mogelijk dat mensen uw site op een groot aantal verschillende apparaten kunnen gebruiken.
Bronnen
Broncode voor interactieve elementen geeft hun doel en statusaudit aan