WCAG 2.2 vs 2.1: wat is er nieuw?

Het verschil in het kort

WCAG 2.2 bouwt voort op 2.1. Op één na staan alle criteria van 2.1 er nog in, met hetzelfde nummer en dezelfde eis. Wat erbij komt, raakt in een webshop bekende plekken: de vaste kopbalk, de knopjes in de winkelwagen, het prijsfilter, de checkout en het inlogscherm. Nieuw met WCAG? Lees dan eerst wat WCAG is en hoe de niveaus A, AA en AAA werken.

De negen nieuwe criteria

De tabel noemt ze alle negen, met de Nederlandse naam uit de geautoriseerde vertaling van W3C. De laatste kolom zegt of onze scan het criterium meet. Die labels zijn dezelfde als in onze WCAG 2.2 checklist.

Handmatig betekent dat onze scan het criterium niet meet. Hieronder per criterium op niveau A en AA wat het in een webshop betekent.

2.4.11 Focus niet bedekt (minimum)

Wie met Tab door je pagina gaat, moet zien waar hij is. Het onderdeel met focus hoeft niet helemaal in beeld te blijven, maar mag niet volledig verdwijnen achter iets wat de site zelf over de pagina legt. In een webshop is dat meestal een kopbalk die bij het scrollen blijft staan, een cookiebalk onderin of een chatknop in de hoek. Vaak is één regel CSS genoeg: scroll-padding-top op de pagina, net zo hoog als de kopbalk. De browser zet de focus dan onder de balk.

Onze scan: deels. Hij meldt focus die helemaal achter een vaste balk verdwijnt, binnen de tabstops die hij doorloopt. Verder in een lange pagina en op je telefoon kijk je zelf.

2.5.7 Sleepbewegingen

Alles wat je met slepen bedient, moet ook lukken met klikken of tikken. Voor iemand met trillende handen, of die de muis met zijn hoofd bestuurt, is een knop ingedrukt houden en tegelijk bewegen soms onmogelijk. Het bekendste geval in een webshop is het prijsfilter met twee schuifknoppen. Zet er twee invulvelden naast voor de laagste en hoogste prijs. Een kaart waarop je een afhaalpunt kiest door te verschuiven, heeft ook een tweede bediening nodig.

Onze scan: handmatig.

2.5.8 Grootte van het aanwijsgebied (minimum)

Elk klikdoel is minstens 24 bij 24 CSS-pixels. Kleiner mag, als een cirkel van 24 pixels rond het midden geen ander klikdoel raakt. Links in een lopende zin vallen erbuiten.

In een webshop zitten de kleinste doelen op vaste plekken: de plus- en minknopjes voor het aantal, het kruisje om een product te verwijderen, kleurstalen, vinkjes in het filter en de bolletjes onder een fotocarrousel. Op een telefoon is dat al lastig. Met een tremor wordt een knopje van twaalf pixels een gok.

Onze scan: automatisch. Hij meet grootte en tussenruimte van alles wat je kunt aanklikken. Twijfelgevallen worden een controlepunt.

3.2.6 Consistente hulp

Bied je op meerdere pagina's hulp aan, zoals een telefoonnummer, chat of pagina met veelgestelde vragen, dan staat die steeds op dezelfde plek ten opzichte van de rest van de pagina. Hulp aanbieden is niet verplicht. Een klant die in de checkout vastloopt, zoekt de klantenservice waar hij die op de productpagina zag. Zweeft de link daar ineens als knop rechtsboven, dan zoekt juist wie hulp het hardst nodig heeft op de verkeerde plek.

Onze scan: handmatig.

3.3.7 Overbodige invoer

Wat een klant in hetzelfde proces al heeft ingevuld, hoeft hij niet opnieuw te typen. Je vult het voor hem in, of hij kiest het met één klik. Uitzonderingen zijn er voor beveiliging en voor gegevens die niet meer kloppen. In een webshop gaat dit vooral over de checkout, met het vinkje "factuuradres is gelijk aan bezorgadres" als schoolvoorbeeld. Voor iemand met dyslexie is elk veld dat opnieuw moet een kans op een tikfout.

Onze scan: handmatig. De scan verstuurt nooit formulieren op je site.

3.3.8 Toegankelijke authenticatie (minimum)

Inloggen mag geen geheugen- of denktest zijn, zoals een wachtwoord uit je hoofd intypen of een puzzel oplossen, tenzij er een hulpmiddel of andere route is. Het bekendste hulpmiddel is de wachtwoordmanager. Die werkt alleen als je site plakken toestaat, ook in het veld voor een code uit een sms of e-mail. Een test waarin je voorwerpen herkent, zoals "klik alle fietsen aan", mag op niveau AA nog wel.

Onze scan: handmatig. De scan logt nergens in.

De drie criteria op niveau AAA

2.4.12 Focus niet bedekt (uitgebreid) staat geen enkel bedekt stukje toe. 2.4.13 Focusweergave eist een markering van minstens een rand van twee pixels, met 3:1 contrast tussen de toestand met en zonder focus. 3.3.9 schrapt de uitzondering voor herkenningspuzzels. AAA is geen eis onder de EAA.

Waarom 4.1.1 Parsen verviel

Parsen eiste technisch nette HTML: elementen goed geopend en gesloten, unieke id's. In 2008 liepen hulpmiddelen op zulke fouten vast. Moderne browsers repareren ze voordat een schermlezer de pagina leest, dus W3C heeft 4.1.1 geschrapt. Voor HTML geldt het ook onder 2.0 en 2.1 voortaan als altijd gehaald. Verwijst een label naar een id die twee keer op de pagina staat, dan is dat nog steeds een fout, nu onder 1.3.1 Info en relaties of 4.1.2 Naam, rol, waarde.

Vraagt de EAA nu 2.1 of 2.2?

De European Accessibility Act zegt welke bedrijven toegankelijk moeten zijn. Hoe je dat technisch invult, staat in de Europese norm EN 301 549. Onder de EAA is nog geen versie van die norm formeel aangewezen. De ACM noemt voor webshops nu WCAG 2.1 niveau AA. Versie v3.2.1 uit 2021 geldt formeel voor overheidssites en verwijst ook naar WCAG 2.1 AA.

Die norm wordt bijgewerkt. Op 2 september 2026 is versie 4.1.1 gepubliceerd, en die verwijst naar WCAG 2.2 niveau AA. Juridisch telt een nieuwe versie pas als de Europese Commissie hem vermeldt in het Publicatieblad van de EU. De Ierse National Disability Authority (NDA) verwacht die vermelding op 16 december 2026; de Europese Commissie heeft dat nog niet bevestigd. Bron: National Disability Authority, Ierland (Engelstalig).

Voor je webshop maakt het weinig uit. WCAG 2.2 bevat alles uit 2.1, dus met 2.2 AA zit je onder beide versies goed. Onze scan meet daarom tegen WCAG 2.2 AA. Of de EAA voor jou geldt, lees je op val ik onder de EAA. Deze pagina is geen juridisch advies.

Waar je in je webshop begint

1. Druk op Tab door een productpagina en de checkout. Verdwijnt de focus achter een vaste balk? (2.4.11)
2. Open de winkelwagen op je telefoon. Raak je de knopjes zonder misser? (2.5.8)
3. Stel het prijsfilter in zonder te slepen. (2.5.7)
4. Bestel tot vlak voor betalen en tel hoe vaak je iets opnieuw typt. (3.3.7)
5. Log in met een wachtwoordmanager en plak een code. (3.3.8)
6. Zoek de klantenservice op drie pagina's. Staat hij steeds op dezelfde plek? (3.2.6)

De andere 49 criteria loop je na met de WCAG 2.2 checklist in gewoon Nederlands, of je begint met website toegankelijkheid testen.