Toetsenbordbediening van een button
Veel gebruikers navigeren door een formulier met hun Tab-toets om van focusable element naar focusable element te springen (buttons, links, invoervelden, radio buttons, checkboxes etc).
Krijgt een button de toetsenbordfocus, dan kan die met “enter” of “spatiebalk” worden geactiveerd. Zorg ervoor dat deze functionaliteit blijft werken als je een webcomponent bouwt, dit is standaard en verwacht gedrag van een button.
Een consistente toetsenbordbediening is nodig om te voldoen aan het WCAG-succescriterium 2.1.1 Toetsenbord (niveau A).
En ook volg je dan de WCAG-richtlijn 3.2 Voorspelbaar: maak het uiterlijk en de bediening van webpagina's voorspelbaar.
Doen
Gebruik een button, zodat de toetsenbordinteractie vanzelf goed gaat.
<button class="doFancyStuff button">Geef je op</button>
Niet doen
Een div gebruiken die alleen met de muis aanklikbaar is.
<div class="doFancyStuff button">Geef je op</div>
Over deze richtlijnen
Deze richtlijnen worden onderhouden door het NL Design System en zijn op dit moment in beta.
We willen graag van de community horen of ze werkbaar en nuttig zijn. Heb je vragen, aanvullingen of opmerkingen? Deel je mening op GitHub met je suggesties.