Je hebt waarschijnlijk wel eens gehoord van WCAG. Misschien kwam het ter sprake toen je website-ontwikkelaar het had over “toegankelijkheid” of “compliance”. Of je stuitte erop bij het lezen over nieuwe Europese wetgeving. Maar wat betekent wcag 2.2 nu concreet voor jouw bedrijfswebsite?
Inhoudsopgave
- Wat is WCAG en waarom is versie 2.2 relevant?
- De nieuwe richtlijnen in WCAG 2.2: wat is er veranderd?
- WCAG 2.2 AA: het nieuwe niveau voor digitale toegankelijkheid
- European Accessibility Act en Nederlandse wetgeving: wat moet je weten?
- Concrete aanpassingen voor jouw website: van theorie naar praktijk
- Controleer zelf: tools om je website te testen
- Wat kost het om je website WCAG 2.2-proof te maken?
- Stappenplan: zo breng je jouw website in lijn met WCAG 2.2
- Klaar voor WCAG 2.2?
In dit artikel leg ik uit wat er veranderd is in de nieuwste versie van de toegankelijkheidsrichtlijnen. Geen technisch jargon, maar een praktische blik op wat deze aanpassingen voor jou betekenen en wat je eraan kunt doen.
Wat is WCAG en waarom is versie 2.2 relevant?
WCAG staat voor Web Content Accessibility Guidelines. Het zijn internationale richtlijnen die beschrijven hoe je digitale content toegankelijk maakt voor iedereen, inclusief mensen met een beperking. Denk aan iemand die blind is en een screenreader gebruikt, maar ook aan iemand met motorische problemen die alleen een toetsenbord kan gebruiken.
De WCAG richtlijnen worden beheerd door het World Wide Web Consortium (W3C), de organisatie die webstandaarden ontwikkelt. Ze bestaan al sinds 1999, maar zijn door de jaren heen meegegaan met technologische ontwikkelingen.
WCAG 2.0 verscheen in 2008 en legde de basis. In 2018 kwam WCAG 2.1 met 17 extra succescriteria, vooral gericht op mobiel gebruik en mensen met cognitieve beperkingen. Nu, in 2023, is WCAG 2.2 gepubliceerd met nóg 9 nieuwe criteria.
Waarom zijn die nieuwe criteria belangrijk? Ze zijn gebaseerd op praktijkervaring. Het W3C verzamelde jarenlang feedback van mensen die websites gebruiken met een beperking. Hun frustraties (te kleine knoppen op mobiel, verwarrende inlogprocedures, formulieren die dezelfde gegevens twee keer vragen) zijn vertaald naar concrete verbeteringen.
Voor jou als ondernemer is WCAG 2.2 relevant om twee redenen. Ten eerste wordt het de nieuwe standaard waar je website aan moet voldoen als je juridisch compliant wilt zijn. Ten tweede verbetert het daadwerkelijk de bruikbaarheid van je website voor een bredere groep bezoekers.
De nieuwe richtlijnen in WCAG 2.2: wat is er veranderd?
WCAG 2.2 voegt 9 nieuwe succescriteria toe en schrapt er 1 (criterium 4.1.1 Parsing, dat obsoleet was geworden). Die nieuwe criteria richten zich op betere toetsenbordnavigatie, gebruiksvriendelijkere authenticatie en minder herhaling in formulieren.
Hieronder de belangrijkste veranderingen als concrete situaties die je waarschijnlijk herkent.
Focus Not Obscured: navigatie zonder verwarring
Stel je voor: een bezoeker navigeert door je website met de Tab-toets. Bij elk druk verschuift de focus naar een volgend element (een link, een knop, een invoerveld). Maar wat als er een cookiebanner of sticky menu over dat element heen valt? Dan weet de gebruiker niet waar de focus is.
Het nieuwe criterium “Focus Not Obscured” vereist dat het element waar de focus op ligt altijd zichtbaar blijft. In niveau AA mag het gedeeltelijk bedekt zijn, maar in niveau AAA moet het volledig zichtbaar zijn. Dit klinkt misschien als een detail, maar voor iemand die alleen het toetsenbord gebruikt, is het het verschil tussen een bruikbare en een frustrerende website.
Target Size: grotere klikgebieden voor mobiel
Heb je wel eens op je telefoon geprobeerd een klein kruisje weg te klikken of een minuscuul checkboxje aan te vinken? Lastig, toch? Voor iemand met een motorische beperking is dat niet alleen lastig – het is vaak onmogelijk.
WCAG 2.2 introduceert “Target Size (Minimum)”, dat stelt dat klikbare elementen minimaal 24 bij 24 pixels moeten zijn. Dat is kleiner dan het eerdere criterium in 2.1 (44×44 pixels, niveau AAA), maar nu een verplicht niveau AA-criterium. Het geldt voor knoppen, links en formulierelementen.
Er zijn uitzonderingen: inline links in tekstblokken hoeven niet 24×24 te zijn. En als het element zelf kleiner is maar de klikbare area groot genoeg (denk aan padding rondom een icoon), dan is dat ook goed.
Accessible Authentication: inloggen zonder frustratie
Wie heeft niet het gevoel dat inloggen steeds complexer wordt? Een willekeurig wachtwoord, een CAPTCHA met vage letters, of een puzzel waarbij je “alle verkeerslichten” moet selecteren.
Het criterium “Accessible Authentication” (niveau AA) vereist dat je als website-eigenaar geen cognitieve functietests opneemt in het inlogproces, tenzij er een alternatief is. Dat betekent: geen CAPTCHA’s waarbij je letters moet herkennen (tenzij er een audio-alternatief is), geen geheugentest waarbij je je wachtwoord uit je hoofd moet kennen (een wachtwoordmanager moet bruikbaar zijn), en geen puzzels of rekenopgaven zonder alternatief.
Dit helpt mensen met cognitieve beperkingen, maar ook gewoon iedereen die moe is of gehaast.
Redundant Entry: gegevens niet twee keer invullen
Je vult een lang aanvraagformulier in. Op pagina 3 wordt je gevraagd je e-mailadres nóg een keer in te voeren, terwijl je dat op pagina 1 al deed. Irritant.
“Redundant Entry” bepaalt dat informatie die een gebruiker al eerder in een proces heeft ingevoerd, automatisch moet worden ingevuld of beschikbaar moet zijn om te selecteren. Uitzonderingen: als het om veiligheid gaat (zoals wachtwoord bevestigen) of als de eerdere invoer niet meer geldig is.
Dit criterium helpt vooral mensen met geheugenproblemen of cognitieve beperkingen, maar maakt formulieren voor iedereen aangenamer.
Dragging Movements: alternatieven voor slepen
Denk aan een slider die je moet verslepen om een waarde in te stellen, of een drag-and-drop interface om bestanden te uploaden. Voor iemand die alleen een toetsenbord gebruikt of moeite heeft met fijne motoriek, is slepen niet werkbaar.
Het criterium “Dragging Movements” vereist dat voor elke functionaliteit die slepen vereist, er ook een alternatief is. Bijvoorbeeld: een slider met plus- en minknoppen, of een “Browse files” knop naast een drag-and-drop zone.
WCAG 2.2 AA: het nieuwe niveau voor digitale toegankelijkheid
WCAG kent drie conformiteitsniveaus: A, AA en AAA. Niveau A is de minimumbasis, AAA is de hoogste lat. Maar in de praktijk wordt niveau AA gezien als de standaard waaraan je moet voldoen.
Waarom AA? Omdat het een realistisch evenwicht biedt tussen toegankelijkheid en haalbaarheid. AAA-criteria zijn soms zo streng dat zelfs toegankelijkheidsexperts erkennen dat niet alle content eraan kan voldoen zonder disproportionele aanpassingen.
Voor jouw website betekent WCAG 2.2 AA concreet: je moet voldoen aan alle niveau A-criteria én alle niveau AA-criteria. Dat zijn in totaal 50 succescriteria (30 uit 2.0, 13 uit 2.1, en 7 nieuwe uit 2.2 op niveau A of AA).
Die 50 criteria klinken overweldigend, maar veel ervan zijn logische basisregels waar moderne websites vaak al aan voldoen. Denk aan: voldoende kleurcontrast, correcte gebruik van kopstructuur (H1, H2, etc.), alt-teksten bij afbeeldingen, en formulieren met duidelijke labels.
De uitdaging zit vaak in de details: is die blauwe link op een lichtgrijze achtergrond écht contrastrijk genoeg? Kunnen alle functies van die interactieve kaart ook zonder muis? Zijn foutmeldingen in formulieren helder genoeg voor een screenreader?
European Accessibility Act en Nederlandse wetgeving: wat moet je weten?
WCAG 2.2 is niet zomaar een set aanbevelingen – het wordt wettelijk verplicht. De European Accessibility Act (EAA) verplicht vanaf 28 juni 2025 bedrijven in de EU om hun digitale diensten toegankelijk te maken volgens wcag 2.2 aa.
De wetgeving richt zich in eerste instantie op specifieke sectoren: e-commerce platforms, bancaire en financiële diensten, telecommunicatiebedrijven, streaming- en mediabedrijven, transport en ticketingsystemen, en e-books en gerelateerde software.
Als je een webshop runt, online diensten aanbiedt, of bijvoorbeeld een booking-platform hebt, val je waarschijnlijk onder de EAA. Voor kleinere bedrijven (minder dan 10 medewerkers en jaarlijkse omzet onder 2 miljoen euro) gelden uitzonderingen, maar die zijn beperkt. Vooral voor bedrijven in de bovengenoemde sectoren.
Nederland implementeert de EAA via de Wet digitale toegankelijkheid, die op 28 juni 2025 van kracht wordt. Dat betekent dat vanaf die datum nieuwe producten en diensten aan WCAG 2.2 AA moeten voldoen. Bestaande producten en diensten hebben tot 28 juni 2030 de tijd om aan te passen.
Wat gebeurt er als je niet voldoet? De handhaving ligt bij de Autoriteit Consument & Markt (ACM). Ze kunnen boetes opleggen, en consumenten kunnen klachten indienen. De precieze boetesystematiek wordt nog uitgewerkt, maar het uitgangspunt is dat bedrijven eerst de kans krijgen om aanpassingen door te voeren.
Belangrijk: ook al val je officieel niet onder de verplichte scope van de eaa wetgeving, de maatschappelijke verwachting verschuift. Steeds meer grote opdrachtgevers eisen van hun leveranciers dat ze toegankelijk zijn. Als je meedoet aan aanbestedingen of samenwerkt met grote bedrijven of overheidsinstellingen, wordt WCAG-compliance vaak een harde eis.
Concrete aanpassingen voor jouw website: van theorie naar praktijk
Genoeg theorie. Wat betekenen die nieuwe criteria nu praktisch voor je website? Hieronder de meest voorkomende elementen en hoe je ze aanpakt.
Formulieren toegankelijker maken
Formulieren zijn overal: contactformulieren, nieuwsbriefinschrijvingen, bestelprocessen. Ze zijn ook een veelvoorkomende bron van toegankelijkheidsproblemen.
Als je een meerstaps formulier hebt (bijvoorbeeld een aanvraagproces of checkout) zorg dan dat gegevens die eerder zijn ingevoerd automatisch worden ingevuld. Moderne frameworks ondersteunen dit vaak out-of-the-box. Controleer vooral of je een multi-page formulier gebruikt: sla tussentijds op en vul eerder ingevoerde velden automatisch in. Vraag je tweemaal hetzelfde zoals een e-mailadres? Gebruik autocomplete-attributen zodat de browser kan helpen.
Heb je een inlogformulier, check dan of je wachtwoordmanagers
ondersteunt. Dat betekent: het invoerveld heeft het juiste
autocomplete="current-password" attribuut. Als je extra
verificatie wilt (2FA), bied dan opties zoals authenticatie-apps of
SMS-codes. Geen CAPTCHAs die je moet “oplossen” zonder alternatief.
Navigatie verbeteren voor toetsenbordgebruikers
Probeer eens je eigen website te navigeren met alleen de Tab-toets. Spring je logisch van element naar element? Is het altijd duidelijk waar je bent?
Heb je een sticky menu dat bovenaan blijft plakken? Test of het geen focuselementen bedekt als iemand door de pagina tabt. Gebruik je een cookiebanner of popup? Zorg dat de focus naar de banner springt zodra deze verschijnt, en dat gebruikers er met Tab doorheen kunnen navigeren en sluiten. Controleer of je focusindicator (meestal een blauwe rand om het element) altijd zichtbaar is. Veel ontwerpers vinden deze rand lelijk en verbergen hem met CSS. Niet doen, of vervang hem door een duidelijk alternatief.
Knoppen en links groot genoeg maken
Op desktop lijken kleine knoppen vaak geen probleem. Maar op mobiel, of voor iemand met een trilling in de hand, is een te klein klikgebied frustrerend.
Meet je belangrijkste interactieve elementen op. Een simpele test: inspecteer een knop in je browser (rechtermuisknop > Inspecteer element) en kijk naar de afmetingen. Is het minstens 24×24 pixels? Zo niet, pas de padding aan.
Let vooral op kleine kruisjes om popups te sluiten, hamburger menu iconen, pijltjes in sliders of carousels, en checkboxes of radiobuttons in formulieren.
CSS kan hier wonderen doen. Een knop hoeft niet visueel groter te
lijken, maar kan wel een grotere klikbare area hebben door ruimere
padding of een ::before pseudo-element.
Inlogprocedures vereenvoudigen
Als je website een login vereist, doorloop het proces eens kritisch.
- Ondersteun je wachtwoordmanagers? Test het met een populaire manager zoals 1Password of Bitwarden.
- Gebruik je een CAPTCHA? Overweeg alternatieven zoals hCaptcha met toegankelijkheidsmodus, of spam-detectie op de achtergrond (honeypot-velden, rate limiting).
- Bied je “wachtwoord vergeten” duidelijk aan, zonder dat iemand door hoepels moet springen?
Controleer zelf: tools om je website te testen
Je hoeft niet direct een dure toegankelijkheidsaudit in te kopen. Er zijn gratis tools waarmee je een eerste scan kunt doen.
WAVE (WebAIM) is er een van. Ga naar en voer je URL in. WAVE toont een visueel overzicht van toegankelijkheidsproblemen op je pagina: rode foutmeldingen, gele waarschuwingen, en groene succesjes. Het is niet perfect, maar geeft snel inzicht.
Een andere optie is axe DevTools, een browser-extensie voor Chrome en Firefox . Installeer het, open de developer tools (F12), en ga naar de axe-tab. Klik op “Scan”. Je krijgt een lijst met problemen, inclusief uitleg en suggesties om ze op te lossen. Handig voor ontwikkelaars, maar ook zonder technische kennis begrijpelijk.
Lighthouse Accessibility Audit zit ingebouwd in Chrome. Open developer tools (F12), ga naar de Lighthouse-tab, selecteer “Accessibility”, en klik op “Analyze page load”. Je krijgt een score en een lijst met aandachtspunten. Let op: een hoge Lighthouse-score betekent niet automatisch volledige WCAG-compliance, maar het is een goede start.
Geautomatiseerde tools detecteren maar 30-40% van toegankelijkheidsproblemen. Ze kunnen checken of een afbeelding een alt-tekst heeft, maar niet of die alt-tekst zinvol is. Ze zien of er een label bij een invoerveld staat, maar niet of het label helder genoeg is.
Voor een volledige WCAG 2.2-audit heb je handmatige toetsing nodig, vaak gecombineerd met tests door gebruikers met een beperking. Als je website complex is (bijv. met custom JavaScript-functionaliteit, video-content, of interactieve elementen), is het verstandig een toegankelijkheidsspecialist in te schakelen.
Wat kost het om je website WCAG 2.2-proof te maken?
De klassieke vraag. Het eerlijke antwoord: dat hangt af van je huidige staat van toegankelijkheid en de complexiteit van je website.
Als je site redelijk modern is en je voornamelijk dingen moet fixen zoals kleurcontrast, knoopgroottes, en focusindicatoren, kun je vaak met enkele uren werk (en dus honderden euro’s) een wereld van verschil maken. Veel van deze aanpassingen zijn CSS-only.
Als je formulieren moet herstructureren, alternatieven voor drag-and-drop moet toevoegen, of je navigatie toegankelijker moet maken, ben je eerder dagen dan uren bezig. Denk aan 1.000-3.000 euro voor een standaard bedrijfswebsite met contactformulier en basic interacties.
Heb je een webapplicatie, een configurator, een booking-systeem, of veel custom JavaScript? Dan kan een volledige WCAG 2.2 AA compliance traject al snel oplopen tot 5.000-15.000 euro of meer. Dit omvat audit, implementatie, en hertesting.
Toegankelijkheid is geen eenmalige klus. Nieuwe content, updates, of features moeten ook toegankelijk zijn. Veel bedrijven bouwen daarom een interne checklist op of werken met een CMS dat toegankelijkheid standaard ondersteunt (zoals moderne WordPress-thema’s of headless CMS-systemen met toegankelijkheidscontroles).
Los van de wettelijke verplichting: een toegankelijke website is bruikbaar voor een bredere doelgroep. . Dat is potentieel koopkrachtig publiek dat je nu mogelijk uitsluit. Daarnaast scoren toegankelijke websites vaak beter op SEO. Google waardeert bijvoorbeeld semantisch correcte HTML en snelle laadtijden, die ook belangrijk zijn voor toegankelijkheid.
Stappenplan: zo breng je jouw website in lijn met WCAG 2.2
Je weet nu wat er moet gebeuren. Maar waar begin je? Hier is een praktisch stappenplan.
Begin met een eerste scan (reken op 1 dag). Gebruik WAVE, axe DevTools en Lighthouse op je belangrijkste pagina’s: homepage, contactpagina, belangrijkste landingspagina’s. Maak een lijst van gedetecteerde problemen en prioriteer. Wat komt vaak voor? Wat is makkelijk op te lossen?
Voer vervolgens de quick wins door (1-2 dagen). Fix kleurcontrast-problemen door CSS aan te passen. Voeg ontbrekende alt-teksten toe aan afbeeldingen. Controleer of formulieren correcte labels hebben. Vergroot te kleine knoppen en links door padding aan te passen. Zorg dat focusindicatoren zichtbaar zijn.
Pak daarna complexere zaken aan (1-2 weken). Test toetsenbordnavigatie door je hele site en fix focus-volgorde en keyboard traps. Pas formulieren aan voor Redundant Entry en Accessible Authentication. Voeg alternatieven toe voor drag-and-drop of sliders. Controleer of video’s ondertiteling hebben.
Als je zeker wilt zijn dat je compliant bent, laat dan een toegankelijkheidsaudit uitvoeren. Een specialist test handmatig met screenreaders, toetsenbord-only, en andere hulpmiddelen. Ze identificeren problemen die tools missen.
Tot slot: documenteer en blijf onderhouden. Maak een toegankelijkheidsverklaring op je website (verplicht onder de EAA) waarin je je conformiteitsniveau en eventuele bekende beperkingen vermeldt. Stel een interne checklist op voor nieuwe content of features. Plan jaarlijkse checks in om te borgen dat je compliant blijft.
Voor een standaard bedrijfswebsite (10-20 pagina’s, contactformulier, geen complexe interacties) reken je op 2-4 weken part-time werk als je het zelf doet, of 1-2 weken voor een specialist. Voor complexere websites: 1-3 maanden.
Begin nu, ook al is de deadline 28 juni 2025. Toegankelijkheid is geen switch die je omzet, maar een proces. Hoe eerder je begint, hoe minder stress.
Klaar voor WCAG 2.2?
WCAG 2.2 is meer dan een set technische regels. Het is een manier om je website bruikbaar te maken voor iedereen, ongeacht hun beperkingen. De nieuwe criteria zijn gebaseerd op echte frustraties van echte gebruikers – en lossen problemen op die waarschijnlijk ook jouw bezoekers ervaren.
Met de European Accessibility Act die in 2025 van kracht wordt, is digitale toegankelijkheid geen nice-to-have meer, maar een must. Gelukkig hoef je niet alles in één keer perfect te hebben. Begin met een scan, pak de quick wins aan, en bouw van daaruit verder.
Wil je hulp bij het toegankelijk maken van je website? Of wil je weten of jouw bedrijf onder de EAA-wetgeving valt? Neem contact op voor hulp met digitale toegankelijkheid. We helpen je graag op weg.
