Toetsenbord-navigatie — alles bereikbaar zonder muis (WCAG 2.1.1)

WCAG 2.1.1 (AA): alle functionaliteit van een pagina moet bedienbaar zijn via een toetsenbord-interface, zonder specifieke timing voor toetsaanslagen. Waarom belangrijk? Mensen met motorische beperkingen (Parkinson, RSI), screenreader-gebruikers (gebruiken bijna nooit muis), power-users die snel willen werken. Vier kerncomponenten: (1) Tab-volgorde: logisch + voorspelbaar — vaak gewoon DOM-volgorde. Vermijd tabindex >0 (verstoort natuurlijke volgorde). (2) Focus zichtbaar: :focus stijl met duidelijke outline (geen outline:none zonder vervanging!). Browser-default outline is OK; custom moet contrast 3:1. (3) Skip links: "Skip to main content" als eerste tabstop — verbergt visueel maar zichtbaar bij focus. Bespaart screenreader-gebruikers door tientallen nav-links te tabben. (4) Geen toetsenbord-trap: bij modal/dialog moet Esc sluiten. Focus moet binnen modal blijven (focus-trap met JavaScript) en bij sluiten terugkeren naar trigger-element. Test eenvoudig: verstop je muis 5 minuten. Probeer site te gebruiken alleen via Tab + Shift+Tab + Enter + Spacebar + pijl-toetsen + Esc. Als je vastloopt = bug. Veel voorkomende fouten: hamburger-menu opent met klik maar niet met Enter; modal sluit niet met Esc; dropdown vereist hover (Pure-CSS-hover-menu's = onbereikbaar); carousel werkt alleen met muis-swipe; custom-checkbox krijgt geen focus; "Read more"-link is een <div onclick> in plaats van <a> of <button>.