De Web Content Accessibility Guidelines (WCAG) zijn de internationale standaard voor toegankelijke webcontent, uitgegeven door het Web Accessibility Initiative (WAI) van het W3C. De actuele versie, WCAG 2.2, werd op 5 oktober 2023 officieel W3C Recommendation. Ze bevat 86 toetsbare succescriteria, verdeeld over 4 principes en 13 richtlijnen, en elk criterium hoort bij één van drie conformiteitsniveaus: A, AA of AAA. Level AA is in de praktijk het niveau dat telt, omdat wetten wereldwijd hun eisen daaraan ophangen. In de EU verwijst de geharmoniseerde norm EN 301 549 naar WCAG 2.1 Level AA, waarmee dat het technische ijkpunt is voor de European Accessibility Act en het Duitse BFSG. WCAG 2.2 voegt negen nieuwe succescriteria toe bovenop 2.1, over zaken als minimale doelgroottes, zichtbare toetsenbordfocus en inloggen zonder cognitieve puzzels, en schrapt het verouderde parsing-criterium 4.1.1.
Wie geeft de Web Content Accessibility Guidelines uit?
WCAG komt van het World Wide Web Consortium (W3C), dezelfde organisatie die HTML en CSS standaardiseert, via het Web Accessibility Initiative. De richtlijnen hebben een lange geschiedenis: WCAG 1.0 verscheen in 1999, WCAG 2.0 volgde in 2008 en bleef een decennium lang de referentie, WCAG 2.1 kwam in 2018 met de nadruk op mobiel gebruik en slechtziendheid, en WCAG 2.2 werd in oktober 2023 gepubliceerd.
De 2.x-versies zijn bewust achterwaarts compatibel. Een pagina die aan WCAG 2.2 AA voldoet, voldoet ook aan 2.1 AA en 2.0 AA. Dat is belangrijk omdat wetten vaak achterlopen op de nieuwste versie, en bouwen op 2.2 houdt je aan beide kanten veilig.
De vier WCAG-principes: waarneembaar, bedienbaar, begrijpelijk en robuust
Elk succescriterium hangt onder één van vier principes, samen te onthouden met het acroniem POUR:
- Perceivable (waarneembaar): gebruikers moeten de content kunnen waarnemen. Voorbeelden: tekstalternatieven voor afbeeldingen, ondertiteling voor video's, voldoende kleurcontrast.
- Operable (bedienbaar): gebruikers moeten de interface kunnen bedienen. Voorbeelden: alles werkt met het toetsenbord, gebruikers krijgen genoeg tijd, niets knippert op een manier die aanvallen kan uitlokken, doelen zijn groot genoeg om te raken.
- Understandable (begrijpelijk): content en bediening moeten te begrijpen zijn. Voorbeelden: leesbare taal, voorspelbare navigatie, behulpzame foutmeldingen in formulieren.
- Robust (robuust): content moet betrouwbaar werken met huidige en toekomstige user agents, inclusief schermlezers. Voorbeeld: statusmeldingen die hulptechnologie kan aankondigen.
De principes zijn bewust technologieneutraal. Ze gelden net zo goed voor een WordPress-blog als voor een React-app of een PDF.
WCAG-conformiteitsniveaus A, AA en AAA vergeleken
| Niveau | Criteria in WCAG 2.2 | Betekenis | Typische voorbeelden |
|---|---|---|---|
| A | 31 | Absoluut minimum. Wie hier faalt, sluit hele gebruikersgroepen buiten. | Alt-tekst voor afbeeldingen, bediening met het toetsenbord, geen toetsenbordvallen |
| AA | 24 | Het gangbare doel, waar wetten wereldwijd naar verwijzen. | Contrast 4,5:1, zichtbare focus, consistente navigatie, suggesties bij fouten |
| AAA | 31 | Hoogste niveau, voor de meeste sites een streefbeeld. | Contrast 7:1, gebarentaal bij video's, eisen aan het leesniveau |
Conformiteit is cumulatief: AA betekent dat je aan alle Level A- en alle Level AA-criteria voldoet. Het W3C zegt zelf dat volledige AAA-conformiteit niet als algemeen beleid moet worden geëist, omdat sommige AAA-criteria simpelweg niet voor elk soort content haalbaar zijn. Niemand verwacht een gebarentolk op de site van een bakker. Losse AAA-criteria zijn nog steeds de moeite waard waar ze passen, en de verhoogde contrastverhouding is daarvan een populair voorbeeld.
Hoeveel succescriteria heeft WCAG 2.2?
WCAG 2.2 bevat 86 succescriteria: 31 op Level A, 24 op Level AA en 31 op Level AAA. Ter vergelijking: WCAG 2.1 had er 78. Het rekensommetje klopt omdat 2.2 negen criteria toevoegt en er één schrapt: 4.1.1 Parsing, een overblijfsel uit de tijd dat kapotte HTML een schermlezer echt kon laten crashen. Moderne browsers en hulptechnologie parsen HTML op dezelfde manier, waardoor het criterium overbodig was geworden.
Wat is nieuw in WCAG 2.2? De negen nieuwe succescriteria
De toevoegingen in 2.2 richten zich op gebruikers met motorische en cognitieve beperkingen, en eerlijk gezegd is het merendeel gewoon goede UX:
- 2.4.11 Focus Not Obscured (Minimum), AA: het element met focus mag niet volledig verborgen raken achter sticky headers, cookiebanners of chatwidgets.
- 2.4.12 Focus Not Obscured (Enhanced), AAA: het element met focus mag helemaal niet verborgen raken, ook niet gedeeltelijk.
- 2.4.13 Focus Appearance, AAA: de focusindicator moet aan minimale eisen voor grootte en contrast voldoen.
- 2.5.7 Dragging Movements, AA: alles wat met slepen werkt heeft een alternatief nodig dat met simpele klikken of taps werkt.
- 2.5.8 Target Size (Minimum), AA: klik- en aanraakdoelen moeten minstens 24 bij 24 CSS-pixels zijn of genoeg ruimte om zich heen hebben.
- 3.2.6 Consistent Help, A: hulpopties zoals contactlinks of chat moeten op elke pagina op dezelfde plek staan.
- 3.3.7 Redundant Entry, A: dwing gebruikers niet om dezelfde gegevens twee keer in te tikken binnen één proces. Bezorgadres is gelijk aan factuuradres hoort een vinkje te zijn, geen tweede formulier.
- 3.3.8 Accessible Authentication (Minimum), AA: inloggen mag niet afhangen van een cognitieve puzzel. Vervormde tekens overtikken of geheugenspelletjes oplossen kan niet meer, en wachtwoordmanagers en plakken moeten werken.
- 3.3.9 Accessible Authentication (Enhanced), AAA: dezelfde regel zonder de uitzonderingen die 3.3.8 nog toestaat.
Welk WCAG-niveau is wettelijk verplicht?
In de EU bepaalt de geharmoniseerde norm EN 301 549 de technische eisen voor zowel de regels voor de publieke sector als voor de European Accessibility Act, en die norm verwijst op dit moment naar WCAG 2.1 Level AA. Daarmee is 2.1 AA het formele juridische ijkpunt voor het Duitse BFSG en BITV 2.0. Een update van EN 301 549 naar WCAG 2.2 wordt verwacht, en precies daarom is vandaag al op 2.2 bouwen de pragmatische keuze: je voldoet tegelijk aan de huidige eis en aan de waarschijnlijke toekomstige.
Elders is het beeld vergelijkbaar. In de Verenigde Staten stelde het ministerie van Justitie in 2024 een regel vast die lagere overheden verplicht aan WCAG 2.1 AA te voldoen onder ADA Title II, en rechters gebruiken WCAG standaard als referentie in private ADA-rechtszaken. Als je één ding uit deze paragraaf onthoudt, laat het dan dit zijn: WCAG AA is het niveau dat de wet bedoelt als ze toegankelijk zegt.
Hoe zien WCAG-succescriteria er in de praktijk uit?
Drie voorbeelden laten zien hoe concreet de criteria worden. Criterium 1.4.3 Contrast (Minimum) eist een contrastverhouding van minstens 4,5:1 tussen gewone tekst en de achtergrond, en 3:1 voor grote tekst. Die grijze footertekst van #999999 op #ffffff? Die zakt met 2,85:1. Criterium 2.1.1 Keyboard eist dat alle functionaliteit zonder muis werkt, en juist daar sneuvelen de meeste zelfgebouwde dropdowns en afbeeldingssliders stilletjes. En criterium 1.1.1 Non-text Content is de klassieke regel voor alt-tekst:
<!-- Informatieve afbeelding: beschrijf wat erop staat -->
<img src="warehouse.jpg" alt="Medewerker scant pakketten in het magazijn">
<!-- Decoratieve afbeelding: lege alt zodat schermlezers hem overslaan -->
<img src="divider.svg" alt="">Elk criterium in het officiële document verwijst naar technieken en voorbeelden van fouten, en met de WCAG quick reference filter je alle 86 criteria op niveau en technologie, wat een stuk werkbaarder is dan de specificatie van voor naar achter lezen.
Hoe test ik of ik aan WCAG 2.2 voldoe?
Begin met geautomatiseerde tools: WAVE, axe DevTools, Lighthouse of de toegankelijkheidscontroles in InspectWP vinden ontbrekende alt-attributen, contrastfouten, ontbrekende labels en structuurproblemen in seconden. Houd wel de grenzen in het oog. Geautomatiseerde controles detecteren betrouwbaar ergens tussen een derde en de helft van de WCAG-fouten, omdat veel criteria menselijk oordeel vragen. Een machine ziet dat een afbeelding alt-tekst heeft, maar niet of die tekst de afbeelding ook echt beschrijft.
Maak het plaatje dus handmatig compleet: trek je muis eruit en navigeer de hele site met het toetsenbord, doe een sessie met een schermlezer als NVDA (gratis) of VoiceOver, zoom de pagina naar 200 procent, en loop je belangrijkste gebruikersroute, meestal checkout of contact, van begin tot eind door. Betrek als het kan gebruikers met een beperking bij het testen. Zij vinden in tien minuten problemen die geen enkele auditchecklist boven water haalt.
Wat komt er na WCAG 2.2? Een korte blik op WCAG 3.0
Het W3C werkt aan WCAG 3.0, een herschrijving vanaf de grond met een nieuw scoremodel dat afstapt van de binaire logica van geslaagd of gezakt. Het is al jaren een concept en blijft dat nog jaren, en het W3C zegt expliciet dat 3.0 versie 2.2 voorlopig niet vervangt. Voor je planning: WCAG 2.2 AA is het doel, en niets aan 3.0 zou je routekaart voor vandaag moeten veranderen.
Hoe controleert InspectWP WCAG-criteria?
InspectWP neemt geautomatiseerde toegankelijkheidscontroles op in de websiterapporten en koppelt veelvoorkomende fouten aan de onderliggende WCAG-criteria: ontbrekende alternatieve teksten, onvoldoende kleurcontrast, formuliervelden zonder label, een ontbrekende documenttaal en een kapotte koppenhiërarchie, om er een paar te noemen. Elke bevinding krijgt een ernstscore, zodat je eerst de blokkades op Level A oplost en daarna doorwerkt naar AA. In combinatie met geplande rapporten wordt toegankelijkheid daarmee geen eenmalige audit meer, maar iets waar je echt zicht op houdt, en dat is precies wat de European Accessibility Act sowieso van je verwacht.