WCAG uitgelegd
Heldere uitleg van WCAG 2.2 succescriteria. Per criterium lees je wat het betekent, waarom het belangrijk is en hoe je eraan voldoet.
Op deze pagina vind je onze uitleg van WCAG 2.2, stap voor stap. Per succescriterium lees je in gewone taal wat de regel betekent, waar het in de praktijk misgaat en hoe je het zelf kunt controleren.
De artikelen zijn geschreven voor developers, designers en webredacties die digitale toegankelijkheid concreet willen verbeteren — zonder te verdwalen in normteksten.
Wil je weten hoe je website er in de praktijk voor staat? Lees wat je krijgt bij een toegankelijkheidsaudit.
Kolommen waarvan de inhoud door elkaar loopt
Twee projecten naast elkaar. Links een afbeelding, rechts een afbeelding. Daaronder links een beschrijving, rechts een beschrijving.
Afbeelding van prefix
Je hebt een overzichtspagina in je webwinkel met 100 producten. In elke alt-tekst staat “Afbeelding van…”. Klinkt netjes, toch? Tot je luistert wat er gebeurt. Voorleessoftware zegt bij elke afbeelding al automatisch “afbeelding.” Dus als jij “Afbeelding van Nike schoenen” in de alt-tekst zet, hoort je klant: “Afbeelding. Afbeelding van Nike schoenen.” Bij de vierde rij producten word je daar helemaal gek van. En dat wil je niet als winkelier.
Tabellen in WCAG 1.3.1
Een tabel met openingstijden. Maandag: 09:00 tot 17:00. Visueel snap je direct welke dag bij welke tijd hoort. Maar als die tabel is gebouwd met divjes in plaats van echte table-elementen, ziet een schermlezer alleen losse stukjes tekst. “Maandag.” “09:00 - 17:00.” Zonder de relatie ertussen.
WCAG 4.1.2: knop zonder naam
“Knop.” Dat is wat een schermlezer zegt. Knop. Maar welke knop? Wat doet die?
"Klik op Zoeken." Niets gebeurt.
Je gebruikt spraakbesturing. Je ziet een knop met “Zoeken” erop. Je zegt: “Klik op Zoeken.”
Focus springt onverwacht door de pagina
Tab. Je bent in het hoofdmenu. Tab. Je bent in de sidebar. Tab. Je bent terug in het hoofdmenu. Tab. Nu ben je in de content.
Paginatitel ontbreekt
Je opent een pagina. De schermlezer zegt: “https colon slash slash w-w-w dot example dot com slash pagina dash 3-b dot html.”
Klikbare div in plaats van een button
Een div met een onclick. Ziet eruit als een knop. Doet iets als je erop klikt.
Informatief icoon dat onzichtbaar is
Drie streepjes. Een hamburgericoon. Dat is je menu. Tenminste, als je het kunt zien.
Lichtgrijze tekst op een witte achtergrond
Contrastverhouding: 2,85:1. Vereist: 4,5:1. Laag contrast is een van de meest voorkomende toegankelijkheidsproblemen op het web. In de WebAIM Million 2025 werd laag-contrasttekst gevonden op 79,1% van de onderzochte homepages. En ik snap waarom lichtgrijze tekst populair is. Het ziet er strak uit. Rustig. Modern.