Customer Impact

Website & Development

WCAG 2.1 AA uitgelegd: checklist voor marketingteams (en wat 2.2 toevoegt)

Kopieer voor AI

Een WCAG-checklist zet de toegankelijkheidsrichtlijnen om in controlepunten die je zelf afvinkt.

Heeft je tekst genoeg contrast? Werkt alles met het toetsenbord? Begrijpt een screenreader je formulieren? Dat soort vragen.

Het verdict: WCAG 2.1 AA is het juridische ijkpunt in Europa, maar bouw naar WCAG 2.2 AA. Dan zit je voor beide goed.

Hieronder: wat AA concreet vraagt, wie in je marketingteam welk criterium bezit, en een checklist per thema.

Je ziet ook welke audit-tools (zoals WAVE en axe) het zware werk doen, en waar handmatig testen onmisbaar blijft.

Wat is WCAG 2.1 AA, en wat voegt 2.2 toe?

WCAG 2.1 AA is de set van 50 succescriteria die een pagina moet halen voor niveau AA.

WCAG 2.1 in het kort

WCAG 2.1 verscheen op 5 juni 2018 als W3C-aanbeveling. De norm ordent toegankelijkheid in 13 richtlijnen onder vier principes.

Elke richtlijn heeft toetsbare succescriteria op drie niveaus. Voor niveau AA haalt een pagina alle criteria van niveau A en AA. In WCAG 2.1 zijn dat er 50.

Dat is ook het niveau dat telt voor de European Accessibility Act. De Europese norm EN 301 549 neemt WCAG 2.1 AA over voor webcontent.

Wie eraan moet voldoen, lees je in onze uitleg over de European Accessibility Act. De officiële tekst bestaat ook in een Nederlandse vertaling van het W3C.

De drie niveaus: A, AA en AAA

WCAG 2.2 is de actuele versie en telt 86 succescriteria, verdeeld over drie niveaus:

  • Niveau A: het absolute minimum.
  • Niveau AA: alle A- en AA-criteria samen, de praktische norm.
  • Niveau AAA: het strengst, en vaak niet haalbaar voor een hele site.

AA is streng genoeg om echt bruikbaar te zijn en realistisch genoeg om vol te houden.

Wat verandert er in WCAG 2.2?

Versie 2.2 voegde negen nieuwe succescriteria toe ten opzichte van 2.1. Het verouderde criterium 4.1.1 (parsing) werd geschrapt.

Volgens het W3C is content die aan WCAG 2.2 voldoet ook conform met 2.1 en 2.0. WCAG 2.2 verscheen op 5 oktober 2023.

Bouw je naar 2.2 AA, dan zit je dus ook goed voor het juridische ijkpunt.

Een aantal nieuwe criteria is direct relevant voor marketingsites:

  • Klikdoelen: een minimale grootte voor knoppen en links.
  • Zichtbare focus: de focus mag niet verborgen raken achter een sticky balk.
  • Eenvoudiger inloggen: authenticatie zonder geheugenpuzzel.

Hoe groot is groot genoeg? Het W3C-criterium 2.5.8 vraagt op niveau AA minstens 24 bij 24 CSS-pixels per klikdoel, met een paar uitzonderingen zoals links in lopende tekst.

POUR: het kapstokje

De richtlijnen draaien om vier principes, samengevat als POUR. Content moet waarneembaar, bedienbaar, begrijpelijk en robuust zijn.

Twijfel je waar een probleem onder valt? Hang het aan een van die vier woorden.

Wie in je marketingteam bezit welk criterium?

De meeste fouten ontstaan bij het publiceren, niet bij het bouwen.

Toegankelijkheid strandt vaak omdat iedereen denkt dat de developer het oplost. In werkelijkheid gaat het mis in de dagelijkse routine:

  • een afbeelding zonder alt-tekst
  • een knop in een campagnekleur met te weinig contrast
  • een PDF die niemand controleerde

Deze tabel koppelt de WCAG 2.1 AA-criteria die op marketingsites het vaakst misgaan aan de rol die ze kan voorkomen:

Criterium (WCAG 2.1)Wat het vraagtEigenaar
1.1.1 Niet-tekstuele content (A)Een tekstalternatief voor elke inhoudelijke afbeelding, grafiek of icoonknopContentredactie
1.2.2 Ondertiteling (A)Ondertitels bij video met spraakContentredactie, video
1.3.1 Info en relaties (A)Koppen, lijsten en tabellen in echte HTML-structuur, niet alleen visueelDeveloper, redactie
1.3.5 Doel van invoer bepalen (AA)Velden zoals naam en e-mail technisch herkenbaar, zodat browsers ze kunnen invullenDeveloper
1.4.3 Contrast minimum (AA)Minstens 4,5:1 voor tekst, 3:1 voor grote tekstDesign, merk
1.4.4 Tekst herschalen (AA)Tekst tot 200% vergroten zonder verlies van contentDesign, developer
1.4.10 Reflow (AA)Bruikbaar op een breedte van 320 CSS-pixels zonder horizontaal scrollenDesign, developer
1.4.11 Contrast niet-tekstuele content (AA)Minstens 3:1 voor knoppen, invoervelden en grafische elementenDesign
2.1.1 Toetsenbord (A)Alle functies bedienbaar met het toetsenbordDeveloper
2.4.4 Linkdoel (A)Linktekst die zegt waar je terechtkomtContentredactie
2.4.7 Focus zichtbaar (AA)Een zichtbare focusindicatorDesign, developer
3.3.1 en 3.3.2 Fouten en labels (A)Duidelijke labels, instructies en foutmeldingen in formulierenMarketing, developer
4.1.2 Naam, rol, waarde (A)Knoppen, menu’s en sliders die een schermlezer correct benoemtDeveloper

De criteriumteksten vind je in de WCAG 2.1-specificatie.

Zo verdeel je het werk

Contentredactie: alt-teksten, ondertitels, linkteksten en koppenstructuur bij elke publicatie.

Design en merk: contrast, focusstijl en klikdoelen, vastgelegd in je huisstijl. Hulp bij die keuze vind je in een kleurenpalet voor je B2B-website.

Developer: toetsenbord, HTML-structuur, formuliercode en componenten zoals menu’s en sliders.

Vuistregel: geef elke rol zijn eigen regels in je publicatieproces. Dan hoeft niemand de volledige norm uit het hoofd te kennen.

Welke fouten komen het vaakst voor?

Zes fouttypes verklaren het grootste deel van wat een scan vindt.

WebAIM scant elk jaar een miljoen homepages. In de WebAIM Million van 2026 had 95,9% van die homepages detecteerbare WCAG-fouten, gemiddeld 56,1 per pagina.

De top zes ziet er zo uit:

WEBAIM MILLION 2026 De zes fouten op de meeste homepages Laag contrast 83,9% Ontbrekende alt-tekst 53,1% Geen formulierlabel 51% Lege links 46,3% Lege knoppen 30,6% Geen documenttaal 13,5% Aandeel homepages met dit fouttype. Bron: WebAIM Million, 2026.
Laag contrast staat op meer dan acht op de tien homepages. Bron: WebAIM Million 2026.

Wat dat voor je team betekent

Vijf van die zes fouten ontstaan in content en design, niet in de code.

Contrast hoort bij je merk. Alt-tekst en lege links horen bij de redactie. Formulierlabels horen bij wie het formulier opzet.

Let op: WebAIM schrijft er zelf bij dat een scan zonder fouten nog niet betekent dat een pagina toegankelijk is.

Meer voorbeelden staan in onze lijst met fouten in webtoegankelijkheid.

Welke controlepunten staan op de checklist?

De kern van een WCAG 2.2 AA-checklist valt uiteen in vijf thema’s.

Loop ze per pagina na. Begin bij je belangrijkste templates: homepage, dienstenpagina, contactpagina en blogartikel.

Kleur en contrast

Normale tekst heeft volgens het W3C minstens 4,5:1 contrast met de achtergrond. Grote tekst minstens 3:1.

Drie checks:

  • Haalt je bodytekst 4,5:1, ook op gekleurde vlakken?
  • Is kleur nooit de enige drager van informatie?
  • Blijven knoppen en velden zichtbaar in hover- en focusstatus?

Voorbeeld: een foutmelding is niet alleen rood, maar krijgt ook tekst of een icoon.

Tekst en structuur

Koppen volgen een logische hiërarchie: één H1, daaronder H2’s, zonder niveaus over te slaan.

Links hebben een beschrijvende tekst. Vermijd losse “lees meer”-links zonder context.

Tekst blijft leesbaar als je inzoomt tot 200 procent, zonder dat content wegvalt of overlapt.

Afbeeldingen en media

Inhoudelijke afbeeldingen krijgen een zinvolle alt-tekst. Puur decoratieve afbeeldingen krijgen een lege alt, zodat een screenreader ze overslaat.

Video’s met spraak krijgen ondertiteling.

Toetsenbord en focus

Alles wat met de muis werkt, werkt ook met alleen het toetsenbord: Tab, Enter en de pijltjes.

De focusvolgorde is logisch en de focusindicator is altijd zichtbaar. Ook als er een sticky header bovenaan staat, een nieuw aandachtspunt in 2.2.

Er zit geen toetsenbordval in: je kunt overal weer uit weg navigeren.

Formulieren

Elk veld heeft een zichtbaar, gekoppeld label, niet alleen een placeholder.

Foutmeldingen benoemen wat er misging en hoe je het oplost.

Klikbare elementen zijn groot genoeg om op mobiel comfortabel te raken. Reken met minstens 24 bij 24 CSS-pixels.

Waarom de laatste twee je conversie raken

Een formulier dat onduidelijk is voor een screenreader-gebruiker, is meestal ook verwarrend voor een gehaaste bezoeker.

Meer daarover lees je in onze gids over conversie-optimalisatie van formulieren.

Voor de teksten rond je velden helpt microcopy en UX-writing.

Hoe test je dit met audit-tools zoals WAVE en axe?

Begin met een geautomatiseerde scan: die vindt in minuten een flink deel van de technische fouten.

De gratis tools

Drie tools dekken het meeste werk:

  • WAVE (van WebAIM): een browser-extensie die fouten op de pagina zelf markeert.
  • axe DevTools (van Deque): een extensie in je ontwikkelaarstools.
  • Lighthouse: ingebouwd in Chrome, met een toegankelijkheidsscore.

Je opent een pagina en krijgt direct een overzicht van fouten, waarschuwingen en de structuur.

Hoe je die Lighthouse-rapporten leest, staat in onze uitleg over Google Lighthouse.

Lighthouse via PageSpeed Insights

PageSpeed Insights draait Lighthouse in de browser, zonder installatie.

Bovenaan staan de velddata van echte bezoekers. Lager in hetzelfde rapport volgt de toegankelijkheidsscore met de gevonden fouten:

Mobiele velddata in PageSpeed Insights voor customerimpact.be, hetzelfde rapport waarin Lighthouse ook de toegankelijkheidsscore voor een WCAG checklist toont Onze eigen mobiele velddata in PageSpeed Insights, oktober 2026. De toegankelijkheidscontrole van Lighthouse staat lager in hetzelfde rapport.

Tip: gebruik de toegankelijkheidsscore als signaal, niet als bewijs van conformiteit.

Een hele site crawlen

Een extensie test één pagina tegelijk. Voor honderden pagina’s gebruik je een crawler.

Screaming Frog SEO Spider gebruikt volgens zijn eigen productpagina de open-source axe-regels om tegen WCAG te testen. De crawler vindt ook afbeeldingen zonder alt-tekst:

Productpagina van Screaming Frog SEO Spider, een crawler die met de axe-regels een WCAG checklist over een hele site kan draaien De productpagina van Screaming Frog SEO Spider, oktober 2026. De gratis versie crawlt 500 URL’s per keer.

Wat scans wel en niet vinden

Wat deze tools goed opsporen:

  • ontbrekende alt-teksten
  • te laag contrast
  • ontbrekende formulierlabels
  • een foute koppenstructuur

Wat ze niet kunnen: beoordelen of een alt-tekst inhoudelijk klopt, of de focusvolgorde logisch aanvoelt, of een foutmelding echt begrijpelijk is.

Daarom is de realistische verwachting dat geautomatiseerde tools grofweg een derde tot de helft van de problemen vangen. Ze zijn een vertrekpunt, geen eindstation.

De praktische werkwijze

  1. Draai WAVE of axe over je belangrijkste paginatypes.
  2. Los de gemelde fouten op.
  3. Gebruik de waarschuwingen als checklist voor handmatige controle.

Wil je zonder installatie een eerste beeld? Gebruik onze toegankelijkheidscheck.

Die test je homepage, een productpagina en een formulier op automatisch detecteerbare WCAG-fouten.

Waar blijft handmatig testen nodig?

Bij alles wat context vraagt: alleen een mens beoordeelt of iets echt werkt.

De meest impactvolle toegankelijkheidsproblemen zijn contextueel. Drie checks doe je zonder veel voorkennis zelf.

1. De toetsenbordtest

Leg je muis weg.

Navigeer een belangrijke flow, bijvoorbeeld van homepage naar contactformulier, met alleen Tab, Shift+Tab en Enter.

Stel jezelf drie vragen:

  • Kun je overal komen?
  • Zie je steeds waar de focus staat?
  • Kun je het formulier verzenden?

Zo niet, dan heb je een blokkade gevonden die geen scan oppikt.

2. De screenreader-test

Zet een screenreader aan: VoiceOver op Mac, of het gratis NVDA op Windows. Laat een pagina voorlezen.

Klinken je links en knoppen logisch los van hun context?

Worden afbeeldingen zinvol beschreven?

Dit voelt onwennig. Maar twintig minuten leert je enorm veel.

3. De zoom- en mobieltest

Zoom in tot 200 procent en bekijk de pagina op een smal scherm.

Blijft alles leesbaar en bruikbaar, of valt er content weg?

Voor die smalle schermen helpt onze gids over mobiele conversie op een B2B-website.

Wanneer schakel je een specialist in?

Voor een volledige audit of een juridisch onderbouwd conformiteitsrapport schakel je een gespecialiseerde tester in. Vaak is dat iemand die zelf met hulptechnologie werkt.

Maar het meeste laaghangend fruit pluk je met deze handmatige checks zelf.

Wat wil je weten?AanpakWie
Technische fouten per paginaWAVE, axe of LighthouseRedactie, developer
Fouten over de hele siteCrawler met axe-regelsDeveloper
Werkt de flow zonder muis?ToetsenbordtestIedereen in het team
Klinkt de pagina logisch?Screenreader-testRedactie, developer
Conformiteitsrapport voor de EAAExterne auditSpecialist

Een bredere aanpak in stappen vind je in je website toegankelijk maken.

Waarom is dit relevant voor B2B-marketeers?

Om twee redenen: het helpt je conversie, en het wordt steeds vaker een vereiste.

De wet: de European Accessibility Act

De European Accessibility Act is sinds 28 juni 2025 van kracht. Ze verplicht een groeiende groep organisaties om hun digitale diensten toegankelijk te maken.

De wet richt zich vooral op consumentgerichte producten en diensten. Niet elke pure B2B-site valt dus binnen de strikte juridische scope.

Maar de richting is duidelijk: toegankelijkheid verschuift van nice-to-have naar standaardverwachting. Voor publieke instellingen geldt al langer een verplichting.

Hoe je van die verplichting zelfs een bron van aanvragen maakt, lees je in de EAA als leadbron.

De praktijk: meer leads

Belangrijker voor het dagelijkse werk is het effect op leads.

Dezelfde dingen die een site toegankelijk maken, maken hem ook prettiger voor iedereen:

  • leesbare tekst
  • duidelijke knoppen
  • logische navigatie
  • formulieren die in één keer goed gaan

Daar sturen wij bij Customer Impact op: een site die bezoekers omzet in aanvragen, niet in vanity-statistieken.

Een logische, toegankelijke menustructuur helpt daar direct bij. Zie ook onze gids over website-navigatie en onze UX best practices voor B2B.

Bouw het mee in

Toegankelijkheid hoeft geen apart project te zijn. Bouw het mee in als onderdeel van een doordachte, conversiegerichte website, en het kost veel minder dan achteraf repareren.

Het hoort thuis in de bredere aanpak uit de B2B-website gids.

Veelgestelde vragen

Wat is het verschil tussen WCAG 2.1 AA en WCAG 2.2 AA?

WCAG 2.2 voegt negen criteria toe, onder meer over de minimale grootte van klikdoelen, focus die niet verborgen mag zijn en eenvoudiger inloggen, en schrapt het verouderde criterium 4.1.1. Alles wat aan 2.2 voldoet, voldoet ook aan 2.1.

Moet mijn website WCAG 2.1 AA halen?

Valt je site onder de European Accessibility Act, bijvoorbeeld omdat consumenten er online kopen of boeken, dan is WCAG 2.1 AA in de praktijk het ijkpunt. Een louter informatieve B2B-site valt meestal buiten die verplichting, maar dezelfde criteria maken je site wel bruikbaarder.

Hoeveel van de fouten vindt een automatische tool?

Een deel. Ontbrekende labels, alt-attributen en te laag contrast vindt een tool betrouwbaar. Of een alt-tekst klopt, of de focusvolgorde logisch is en of een foutmelding begrijpelijk is, beoordeelt alleen een mens.

Moet ik ook mijn toegankelijkheid publiek melden?

Bedrijven onder de EAA moeten beschrijven hoe hun dienst aan de eisen voldoet. Veel organisaties doen dat met een toegankelijkheidsverklaring; hoe die eruitziet, lees je in onze gids over de toegankelijkheidsverklaring.

De korte samenvatting

WCAG 2.1 AA is het juridische ijkpunt, WCAG 2.2 AA de versie waar je best naartoe bouwt.

Verdeel de criteria over redactie, design en development. Werk daarna in twee lagen:

  1. Laat WAVE of axe de technische fouten opsporen.
  2. Doe zelf de toetsenbord-, screenreader- en zoomtest.

Begin bij je belangrijkste paginatypes en je conversiepunten. Daar levert toegankelijkheid meteen ook betere resultaten op.

Wil je je website laten nakijken op toegankelijkheid en conversie tegelijk? Bekijk onze aanpak voor digitale toegankelijkheid of neem contact op.

Gratis website-scan

Geef je website in en krijg binnen enkele minuten een automatische scan met concrete technische en SEO-verbeterpunten. Geen verkooppraatje.

Waar mogen we je rapport naartoe sturen?

Je gegevens gebruiken we alleen voor je scan. Geen spam, uitschrijven kan altijd.

Gerelateerde dienst Website laten maken →