Wat is Web Content Accessibility Guidelines (WCAG)
01 mei 2025
WCAG betekent Web Content Accessibility Guidelines. In het Nederlands noemen we dat: richtlijnen voor toegankelijke webinhoud. WCAG is een soort handleiding die uitlegt hoe je websites en apps maakt die voor iedereen goed te gebruiken zijn, ook voor mensen met een beperking. Denk bijvoorbeeld aan mensen die: (a) slecht kunnen zien of blind zijn, (b) doof of slechthorend zijn, (c) moeite hebben met lezen of leren, (d) hun handen niet goed kunnen gebruiken. Eenvoudig gezegd: WCAG helpt ervoor te zorgen dat websites duidelijk, begrijpelijk en bruikbaar zijn voor iedereen.
Er zijn 4 hoofdprincipes in WCAG:
- Waarneembaar: Informatie moet te zien of te horen zijn (bijvoorbeeld tekst in plaats van alleen een afbeelding).
- Bedienbaar: Je moet de website met toetsenbord of muis kunnen gebruiken.
- Begrijpelijk: De taal en functies moeten duidelijk zijn.
- Robuust: De website moet goed werken met verschillende apparaten en hulpmiddelen (zoals een schermlezer).
Er zijn ook niveaus van toegankelijkheid: A, AA en AAA.
- Niveau AA is het meest gebruikt en wordt vaak verplicht gesteld door overheden. Zeker! Hieronder geef ik per WCAG-hoofdprincipe eenvoudige, praktische tips die je als websitebeheerder zelf kunt doen om je website toegankelijker te maken.
1. Waarneembaar – Zorg dat mensen de inhoud kunnen zien of horen
Wat kun jij doen:
- Gebruik alt-teksten bij afbeeldingen
- Geef elke afbeelding een korte beschrijving van wat erop staat (tenzij het puur decoratief is).
- Gebruik duidelijke kleurcontrasten
- Zorg dat tekst goed leesbaar is, ook voor mensen met kleurenblindheid. Zwarte tekst op een witte achtergrond werkt meestal goed.
- Zorg voor ondertiteling bij video’s, Als je video’s plaatst, voeg dan ondertitels toe voor slechthorenden.
- Gebruik koppen (H1, H2, H3) op een logische manier, Dat helpt schermlezers en gebruikers om de pagina beter te begrijpen.
2. Bedienbaar – Zorg dat iedereen de website kan gebruiken, ook zonder muis
Wat kun jij doen:
- Test je site met alleen je toetsenbord
- Kun je met Tab, Enter en Shift + Tab alles bereiken, zoals menu’s en formulieren?
- Zorg voor een goed zichtbare focus
- Als je met Tab door de site gaat, moet je zien waar je bent (bijv. een randje om de knop die actief is).
- Gebruik duidelijke linkteksten, in plaats van "klik hier”, schrijf: "lees meer over onze diensten”.
3. Begrijpelijk – Maak de site en taal helder voor iedereen
Wat kun jij doen:
- Schrijf in eenvoudige taal
- Vermijd moeilijke woorden of leg ze uit. Gebruik korte zinnen.
- Gebruik consistente navigatie
- Zet menu’s en knoppen op dezelfde plek op elke pagina.
- Maak formulieren duidelijk en logisch
- Gebruik labels bij elk invoerveld en geef uitleg als iets verplicht is.
4. Robuust – Zorg dat je site goed werkt met hulptechnologie
Wat kun jij doen:
- Gebruik een goed CMS of thema dat toegankelijk is
- Laat je site testen met een schermlezer (zoals NVDA of VoiceOver)
- Zo ontdek je of alles goed wordt voorgelezen.
- Laat geen kapotte HTML achter
- Zorg dat de code van je website "netjes” is. Dat helpt hulptechnologie goed werken.
CHECKLIST
1. Waarneembaar – Is alles goed te zien of te horen?
☐ Afbeeldingen hebben alt-teksten (of zijn gemarkeerd als decoratief)
☐ Tekst heeft voldoende kleurcontrast met de achtergrond
☐ Video’s bevatten ondertiteling
☐ Belangrijke informatie is niet alleen via kleur aangegeven (bijv. foutmeldingen in formulieren)
☐ Koppen (H1, H2, H3) zijn logisch en hiërarchisch gebruikt
2. Bedienbaar – Kun je de site zonder muis gebruiken?
☐ De website is volledig te gebruiken via toetsenbordnavigatie (Tab, Enter)
☐ De focus (bijv. waar je Tab-cursor is) is duidelijk zichtbaar
☐ Links hebben duidelijke beschrijvende teksten ("Lees meer over product X”)
☐ Navigatie is consistent op elke pagina
☐ Knoppen en links zijn groot genoeg om makkelijk aan te klikken
3. Begrijpelijk – Is de inhoud duidelijk en logisch?
☐ Inhoud is geschreven in eenvoudige taal
☐ Lange teksten zijn opgedeeld in kopjes, korte paragrafen en opsommingen
☐ Formulieren hebben duidelijke labels en foutmeldingen
☐ Gebruikers krijgen bevestiging of uitleg na het invullen van een formulier
☐ Gebruikers kunnen niets per ongeluk verliezen (zoals invoer bij een foutmelding)
4. Robuust – Werkt het goed met hulpsoftware en verschillende apparaten?
☐ De website gebruikt toegankelijke HTML-structuur (zoals <button>, <label>, <nav>)
☐ Je gebruikt een CMS of thema dat WCAG-ondersteuning biedt
☐ De site is getest met een schermlezer (bijv. NVDA, VoiceOver)
☐ Pagina’s bevatten geen fouten in de HTML-code (gebruik bijv. W3C validator)
☐ Alle interactieve elementen (zoals knoppen, formulieren) zijn correct gelabeld