We willen in ons vakgebied eigenlijk allemaal precies hetzelfde: gave dingen bouwen die foutloos werken en door een groot publiek gebruikt en bejubeld worden. En hoewel dat fantastische dingen zijn (ook ik maak me er schuldig aan), verliezen we de gebruiker soms uit het oog. En dan bedoel ik niet de gebruiker uit onze focusgroep, maar de gebruiker die net iets minder goed met onze oplossing overweg kan.
4,5 miljoen Nederlanders uitgesloten
Nederland kent ongeveer 4,5 miljoen mensen met een zichtbare of onzichtbare beperking. En dat kan van alles zijn. Motorisch, audiologisch, visueel of neurologisch. Die 4,5 miljoen mensen in Nederland is, met 18 miljoen inwoners, gelijk aan 25%. 25% die we online keihard uitsluiten!
Kan ik dat zo hard schrijven? Helaas wel. Onderzoek door Autoriteit Consument en Markt laat zien dat 95% van de websites in Nederland niet voldoet aan de wettelijke richtlijnen voor digitale toegankelijkheid. 61% van de grootste Nederlandse webwinkels en sites van telecom- en energieaanbieders is niet toegankelijk.
Dit is een onderzoeksrapport dat eind maart 2026 is gepubliceerd. Ik ben dus bang dat er sinds die tijd geen heel grote verandering heeft plaatsgevonden.
Gevolgen zijn er ook voor de site-eigenaar
Sinds 2018 zijn er in Nederland wettelijke richtlijnen voor toegankelijkheid. Hoewel er niet op grote schaal boetes worden opgelegd voor het niet-toegankelijk zijn, kan de slechte toegankelijkheid toch veel kosten.
Onderzoeksbureau Level Level publiceerde vorig jaar bijvoorbeeld dat niet één van de 300 grootste webwinkels in Nederland voldoet aan de toegankelijkheidseisen. En dan gaat het om grote namen in de branche. Concreet betekent het voor hen dat een grote groep klanten geen bestelling kan plaatsen of online klantzaken kan regelen. Je hebt al gelezen dat die groep rond de 25% groot is. Dat zijn heel veel klanten die gemist worden!
Daarnaast zijn er ook gevolgen voor de vindbaarheid van je website in zoekmachines. Een toegankelijke website heeft bijvoorbeeld de structuur goed op orde. Denk aan de bekende alt-tags (die vergeet niemand toch nog? Helaas kom ik daar zo op terug.) Een toegankelijke website is dus beter vindbaar dan een niet-toegankelijke website.
Wat gaat er mis?
Een niet-toegankelijke website kan dus veel verborgen kosten met zich meebrengen. De oplossing is vaak wat technischer. Laten we daarom eens kijken naar de meest voorkomende toegankelijkheidsproblemen en hoe je die op kunt lossen.
Slecht kleurcontrast (83%)
Wanneer we bezig zijn met design, kijken we vaak naar wat mooi is. Mooie teksten over een mooie achtergrond of foto. En natuurlijk is dat mooi, maar het levert vaak onvoldoende contrast op. Voor mensen die slechter zien, is de tekst dan niet leesbaar. Denk hierbij ook aan mensen die kleurenblind zijn. Het contrast tussen de achtergrond en de tekst is dan gewoon te weinig.
Natuurlijk is dit vooral een designaangelegenheid, maar het is het zeker waard om technisch te testen. Dit kun je bijvoorbeeld doen met een tool als Wave. Hiermee kun je een URL testen, maar ook heb je de mogelijkheid om een Chrome-plugin te installeren.
Pro tip: installeer de plugin en check ook je eigen website eens.
Ontbrekende ALT-teksten (46%)
Ergens voelt het invullen van ALT-teksten als iets wat je toch standaard wel meeneemt. Helaas laat de praktijk toch wat anders zien. In 46% van de onderzochte websites ontbraken deze tags bij afbeeldingen.
De SEO-goeroes onder ons zullen hier de koude rillingen van krijgen. Die tags zijn ontzettend hard nodig om een beetje lekker te scoren in zoekmachines. Maar los van zoekmachines houd je ook een hele grote groep gebruikers buiten de deur.
Mensen met een schermlezer of braille-apparaat bijvoorbeeld. Die komen dan niet verder dan een beschrijving: ‘PLAATJE’. Ik durf te wedden dat het marketingtechnisch handiger is als die apparaten een beschrijving zouden geven als: “Superkekke voetbalschoenen die je voor de verjaardag van je neefje moet kopen.” Maar goed, wat weet ik van marketing?
In ieder geval niet meer doen:
<img src=”/producten/product-voetbalschoen-8473466” />
Maar netjes die alt-tag erbij:
<img src=”/producten/product-voetbalschoen-8473466” alt=“Superkekke voetbalschoenen die je voor de verjaardag van je neefje moet kopen.”/>
Onbruikbare online formulieren (25%)
Formulieren zijn op websites vaak de levensader voor commercie. Ze zijn hét middel om in contact te komen met een bedrijf. Maar dit geldt natuurlijk net zo goed voor die webapplicatie die je ontwikkelt. Een formulier zorgt ervoor dat je applicatie de informatie krijgt die het nodig heeft om te doen wat deze moet doen. Wat heb je immers aan een leeg CRM-systeem?
Toch is het in 25% van de gevallen niet best gesteld met die online formulieren. Ze missen bijvoorbeeld duidelijke labels. En hoewel het er best mooi uitziet om de tekst van je label als placeholder neer te zetten, kunnen die schermlezers er weer niet mee overweg. Een gebruiker die daarvan afhankelijk is, heeft dus geen idee wat er ingevuld moet worden.
Ook komt het nog verbazend vaak voor dat een formulier enkel met de muis te bedienen is. Voor iemand met een spasme of Parkinson is dat simpelweg niet te doen. Formulieren moeten minstens met het toetsenbord te doorlopen zijn.
En tegenwoordig hoef je helemaal geen ingewikkelde dingen meer te doen om formulieren toegankelijk te maken. Een eenvoudig voorbeeld met wat uitleg zie je hieronder:
<!doctype html>
<html lang="nl">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Toegankelijk Contactformulier</title>
<style>
/* Basis styling */
.form-groep {
margin-bottom: 20px;
display: flex;
flex-direction: column;
}
/* 1. Zorg voor duidelijke, grote labels */
label {
font-weight: bold;
margin-bottom: 6px;
font-family: sans-serif;
font-size: 1rem;
color: #1a1a1a;
}
/* 2. Toegankelijke invoervelden met goed contrast */
input[type="text"],
input[type="email"],
textarea {
padding: 12px;
font-size: 1rem;
border: 2px solid #767676;
border-radius: 4px;
width: 100%;
max-width: 400px;
box-sizing: border-box;
}
/* Hulptekst styling */
.hulptekst {
font-size: 0.85rem;
color: #595959;
margin-bottom: 4px;
font-family: sans-serif;
}
/* 3. BELANGRIJK: Verwijder NOOIT outline zonder een duidelijke :focus-visible-vervanger! Dit zorgt ervoor dat toetsenbordgebruikers zien waar ze zijn. */
input:focus-visible,
textarea:focus-visible,
button:focus-visible {
outline: 3px solid #005a9c;
outline-offset: 2px;
}
/* 4. Toegankelijke verzendknop */
button[type="submit"] {
background-color: #005a9c;
color: #ffffff;
padding: 12px 24px;
font-size: 1rem;
font-weight: bold;
border: none;
border-radius: 4px;
cursor: pointer;
}
button[type="submit"]:hover {
background-color: #004475;
}
</style>
</head>
<body>
<!-- Het formulier maakt gebruik van een 'aria-labelledby' voor context in screenreaders -->
<form action="#" method="POST" novalidate aria-labelledby="form-titel">
<h2 id="form-titel">Neem contact met ons op</h2>
<!-- Veld: Naam -->
<div class="form-groep">
<!-- Het 'for' attribuut koppelt het label onlosmakelijk aan het 'id' van de input -->
<label for="naam">Volledige naam</label>
<input
type="text"
id="naam"
name="naam"
required
autocomplete="name"
/>
</div>
<!-- Veld: E-mail -->
<div class="form-groep">
<label for="email">E-mailadres</label>
<!-- aria-describedby koppelt de extra hulptekst aan het invoerveld voor screenreaders -->
<span class="hulptekst" id="email-instructie"
>Bijvoorbeeld: [email protected]</span
>
<input
type="email"
id="email"
name="email"
required
autocomplete="email"
aria-describedby="email-instructie"
/>
</div>
<!-- Veld: Opmerking -->
<div class="form-groep">
<label for="opmerking">Opmerking of vraag</label>
<textarea
id="opmerking"
name="opmerking"
rows="5"
required
></textarea>
</div>
<!-- Verzendknop -->
<button type="submit">Bericht verzenden</button>
</form>
</body>
</html>
Tot slot
Ik begon dit artikel met de beschrijving van het doel om mooie dingen te maken die door veel mensen gebruikt worden. En wanneer je iets maakt dat door veel mensen gebruikt moet worden, moet je er ook voor zorgen dat het gebruikt kán worden. Door aandacht te besteden aan toegankelijkheid vergroot je de groep potentiële gebruikers met 25%. Dat zijn 4,5 miljoen mensen, alleen al in Nederland!
Sinds 28 juni 2025 is de European Accessibility Act (EAA) van kracht. Dit verplicht grotere commerciële bedrijven en webshops om digitaal toegankelijk te zijn. Helaas blijft de praktijk, zoals je gelezen hebt, nog vaak achter. Aan de andere kant liggen hier enorme kansen voor onze sector!
Daarom mijn oproep om je doel aan te scherpen: gave dingen bouwen die foutloos werken, toegankelijk zijn voor iedereen, en daardoor door een groot publiek gebruikt en bejubeld worden, awards winnen en misschien wel ‘the next thing’ op het web worden.
