Deze vertaling is nog niet redactioneel gecontroleerd. De Duitse versie is leidend. Deutsche Fassung →
Barrierefreiheit
Hoe groot moet een knop op een website minstens zijn?
Een knop moet minstens 24 bij 24 beeldpunten groot zijn — zo verlangt het met WCAG 2.2 nieuw ingevoerde criterium 2.5.8 'Doelgrootte (minimum)'. Kleinere doelen missen mensen met trillende handen of brede vingers regelmatig, vooral op telefoon. Uitzonderingen zijn koppelingen in vloeiende tekst en kleine doelen met voldoende vrije ruimte rond nabuur doelen.
24 bij 24 beeldpunten: de ondergrens voor het raken
Een vingerdruk is minder nauwkeurig dan een muisklik, en bij trillen of beperkte fijnmotorik groeit de spreiding verder. Is het doel te klein, mist de druk — in het beste geval gebeurt er niets, in slechtere gevallen opent de buurkoppeling zich. Typische probleemgebieden zijn symboolbalken met dicht opeengepakte pictogrammen, minuscule sluit-kruizen op waarschuwingsvensters en datumvelden in kalenders. De 24 bij 24 beeldpunten zijn daarbij de ondergrens, geen comfortmaat. Het criterium voorziet twee uitzonderingen: koppelingen in vloeiende tekst mogen de tekstgrootte volgen, en kleine doelen zijn toegestaan als eromheen voldoende vrije ruimte blijft, zodat geen nabuur doel per ongeluk raakt.
Zo meet de controledienst de doelgroottes
De controledienst meet de zichtbare bedieningselementen van de pagina — koppelingen, knoppen, formuliervelden — in hun werkelijk weergegeven grootte, tot 300 doelen per pagina. Op elk te klein doel past hij de uitzonderingen van het criterium toe: Ligger het als koppeling in vloeiende tekst, telt het niet; bleibt eromheen een voldoende cirkel vrij van nabuur doelen, telt het ook niet. Bleibt daarna tenminste één doel onder 24 bij 24 beeldpunten over, geldt het criterium als geschonden — het rapport noemt het aantal, het eerste getroffen element en legt een bewijsschermfoto bij. De grootte van de steekproef staat als meetnoot in het rapport.
Beispiele
Symbol-Links in einer Zeile
.symbol { width: 16px; height: 16px; margin: 0; }.symbol { width: 24px; height: 24px; }
/* oder: 16 px Symbol mit 8 px Abstand zum Nachbarn */Auf Stufe AA sind 24 × 24 CSS-Pixel die Grenze, oder ein Abstand, der einen 24-Pixel-Kreis um das Ziel frei hält. Links im Fließtext sind ausgenommen.
- Test uw website op telefoon met de duim: raakt u elk symbool in de bovenbalk bij eerste poging?
- Vergroot de tipoppervlakte van kleine symbolen via een onzichtbare binnenafstand — het symbool mag klein lijken, de oppervlakte moet groot zijn.
- Controleer sluit-kruizen van waarschuwingsvensters en cookie-banners — zij behoren tot de meest voorkomende te kleine doelen.
- schaltflaeche-mindestgroesse-24-pixel