Toetsenbordval

Je kent het wel: je speelt een spelletje, bijvoorbeeld Mahjong, je bent zo lekker op dreef en dan toch ineens: GAME OVER. Er was geen combinatie meer over die je kon vrijspelen, dus het enige wat je nog kan doen is het spel herstarten en het nog een keer proberen. Dat is eigenlijk een beetje de situatie die ook kan gebeuren voor mensen die met het toetsenbord een website moeten bedienen die daar niet goed op is ingericht. Om die situatie te voorkomen, is WCAG 2.1.2 Toetsenbordval van groot belang.

WCAG 2.1.2 – Toetsenbordval

De bedoeling van dit succescriterium is om ervoor te zorgen dat mensen niet vast komen te zitten in de content van de website tijdens het bedienen van de website met het toetsenbord. Als de toetsenbordfocus met toetsenbordbediening op een bepaald component kan komen, dan moet de focus ook weer met alleen toetsenbordbediening van dat component weg kunnen.

Met alléén toetsenbordbediening

In bovenstaande uitleg geef ik het al aan: het weghalen van de focus op een component moet met alleen toetsenbordbediening kunnen. Soms is het wel mogelijk om bijvoorbeeld de muis ergens anders te klikken en dan met het toetsenbord verder te navigeren, wat misschien een loophole kan lijken om geen problemen met de toetsenbordbediening te ervaren. Maar voor iemand die puur afhankelijk is van de toetsenbordbediening, zoals mensen met een motorische beperking of voor blinde of slechtziende mensen, is die handeling met de muis niet mogelijk. Zij gebruiken alléén een toetsenbord, dus moet het bedienen van de website ook zonder enkele tussenkomst van muisacties mogelijk zijn.

Niet-interferentie eis

Dit haakt ook gelijk in op een belangrijk aspect van succescriterium 2.1.2. Dit is namelijk één van de vier succescriteria die vallen onder de zogenoemde “niet-interferentie eis”.

Deze eis stelt dat digitale inhoud een gebruiker niet dusdanig mag belemmeren dat de gehele website of webpagina voor deze gebruiker helemaal onbruikbaar wordt.

Als iemand die afhankelijk is van toetsenbordbediening ergens op de website vast komt te zitten, is de enige optie nog om de website af te sluiten en, bij veel moed, het opnieuw te proberen. In alle macht zou dan geprobeerd moeten worden om dat element waarop de gebruiker vast kwam zitten te vermijden, maar heel eerlijk is dat vaak gewoonweg niet te doen. Álle content op een website, pagina of in een app moet dus voldoen aan dit succescriterium.

Praktische voorbeelden

Over het algemeen zie ik in mijn onderzoeken gelukkig niet heel veel problemen met dit succescriterium. Maar het kan nog wel eens voorkomen wanneer bepaalde plug-ins of ingebedde applicaties worden gebruikt. Enkele voorbeelden die ik nog wel eens tegenkom zijn bij chatbots, zoekbalken, dialoogvensters of iframes (bijvoorbeeld bij een kaartapplicatie).

Problemen voorkomen

Om te zorgen dat je bezoekers niet vast komen te zitten op je website, is het allereerst belangrijk dat het voor je bezoekers altijd duidelijk is hoe zij weg kunnen navigeren van componenten. Wat hier sowieso al bij helpt is om waar mogelijk gebruik te maken van de interactiepatronen die gebruikers bij specifieke componenten verwachten. Bijvoorbeeld dat je bij een horizontale tablijst met de pijltjestoetsen tussen de verschillende tabs kan navigeren. Dat neemt in ieder geval al onnodige verwarring weg.

Daarnaast kan het soms zo zijn dat een bepaalde functionaliteit de focus beperkt tot een deel van de content. Dat is in principe nog geen probleem, zolang het voor de gebruiker duidelijk is hoe er weer uit te komen. Als een bepaalde actie meer nodig heeft dan de standaard pijltjes- of tabtoetsen of een andere standaard manier om de focus van een component af te halen, zorg dan dat je de bezoeker op de hoogte brengt van de manier waarop dit moet gebeuren.

Test ook zelf

Mijn laatste tip is om zelf ook goed te testen op de toetsenbordbediening zodra je iets live zet. Wanneer je bijvoorbeeld een nieuwe functionaliteit hebt ontwikkeld of geüpdatet, ontkoppel dan eens je muis en probeer het geheel met alleen een toetsenbord te bedienen. Check of je alle acties naar behoren kunt uitvoeren en nergens vast komt te zitten. Door zelf goed te testen, voorkom je dat je bepaalde bezoekers uitsluit en verlaag je ook gelijk de kans dat je vanuit mij of een van mijn collega-onderzoekers een ‘afgekeurd’ succescriterium terugkrijgt in een toegankelijkheidsonderzoek ;).

Met deze navigatietoetsen kom je al een eind:

• Tab: Ga vooruit door links, knoppen, formuliervelden en andere interactieve componenten.

• Shift + Tab: Ga achteruit door interactieve componenten.

• Enter: Activeer links, knoppen en verzend formulieren.

• Spatiebalk: Activeer knoppen, schakel selectievakjes in/uit en scrollen.

• Pijltjestoetsen: Navigeer binnen menu’s, keuzerondjes en scrollen.

• Esc: Sluit dialoogvensters of menu’s.