Deze vertaling is nog niet redactioneel gecontroleerd. De Duitse versie is leidend. Deutsche Fassung →
Barrierefreiheit
Wat is een toetsenbordval op een website?
Een toetsenbordval is een plaats op een website waar de toetsbordmarkering vast komt te zitten: wie er met de Tab-toets in terechtkomt, kan met toetsenbord alleen nooit meer uit. Voor mensen zonder muis eindigt de pagina op deze plaats — verder lezen, bestellen of het formulier verzenden is onmogelijk. Veelvoorkomende oorzaken zijn datumkiezers, chatvensters, ingebedde video's en galerijen. WCAG-criterium 2.1.2 verbiedt dergelijke vallen.
Zo ontstaat een toetsenbordval
De meeste toetsenbordvallen zijn niet opzettelijk gebouwd. Ze ontstaan door kant-en-klare componenten van derden: een datumkiezer vangt de focus in zodat zijn kalenderdagen per pijltoets bereikbaar zijn — en vergeet de uitgang. Een chatvenster houdt de markering in zijn invoerveld vast. Een zelfgebouwd dialoogvenster zonder sluitknop laat de focus tussen zijn twee knoppen draaien. Met de muis valt dit nooit op, want muisgebruikers klikken simpelweg ernaast. Daarom blijven toetsenbordvallen vaak maanden onopgemerkt, terwijl toetsenbordgebruikers de pagina in die tijd op diezelfde plaats opgeven.
Zo meet de controledienst de toetsenbordval
De controledienst drukt op uw pagina werkelijk de Tab-toets en registreert elke halte met positie en element. Draait de markering tussen dezelfde weinige elementen zonder het einde van het document te bereiken, beschouwt hij dit als toetsenbordval. Het rapport benoemt de betrokken elementen en voegt een screenshot als bewijs bij. Draait de focus binnen een ingebed raamwerk van een derde partij, noteert het rapport dit geval voor handmatige controle — daar kan niet veilig automatisch worden bepaald of er een uitweg is. Bereikt de meting het einde van het document zonder draaien, geldt het criterium als voldaan.
Beispiele
Dialog ohne Ausgang
<div role="dialog" aria-modal="true">
<p>Newsletter?</p>
<input type="email">
<!-- kein Schließen-Knopf, Escape ohne Wirkung -->
</div><dialog id="nl">
<p>Newsletter?</p>
<input type="email">
<button type="button" onclick="nl.close()">Schließen</button>
</dialog>
<!-- dialog schließt mit Escape von selbst -->Aus jedem Bereich muss die Tastatur wieder herauskommen: mit Tab, Escape oder einem beschriebenen Weg.
- Tab eenmaal volledig door uw startpagina tot de voetnotie — blijft u ergens steken, dan hebt u de val gevonden.
- Controleer elk nieuw ingebouwd onderdeel apart: datumkiezer, chatvenster, carrousel, videospeler.
- Vraag uw bureau elk dialoogvenster een per toetsenbord bereikbare sluitoptie te geven, minimaal de Escape-toets.
- Test opnieuw na elke update van de ingebouwde componenten — een nieuwe versie kan een val introduceren.