Hoe toegankelijk zijn de top 300 webwinkels in Nederland voor mensen met een beperking?

Samenvatting

Hoe toegankelijk zijn webwinkels in Nederland voor mensen met een beperking? Level Level onderzocht de voorpagina meer dan 300 websites van bedrijven uit de Twinkle 300. Hiervoor zijn de voorpagina’s  automatisch gescand op fouten.

De conclusie: alle onderzochte websites bevatten problemen betreffende toegankelijkheid. Veel van de problemen zijn dezelfde: 

• onvoldoende kleurcontrast voor tekst;
• geen alternatieve teksten bij afbeeldingen;
• links en knoppen zonder naam. 

Het goede nieuws is: deze drie problemen zijn goed op te lossen zonder ingrijpende verbouwing van de websites. De bedrijven moeten echter wel snel aan de slag, in juni 2025 wordt een toegankelijke website wettelijk verplicht.

Waarom dit onderzoek?

We stelden ons de vraag: hoe goed zijn bedrijven voorbereid op de nieuwe wetgeving, de European Accessibility Act? In juni 2025 moeten grote webwinkels voldoen aan de richtlijnen voor webtoegankelijkheid (WCAG AA) . 

Hoe ver zijn bedrijven met het toegankelijk maken van hun webshop voor bijvoorbeeld bezoekers die slechtziend of blind zijn of de muis niet kunnen gebruiken? Wat is de algemene trend?

Mensen met een beperking hebben geld te besteden en zijn potentiële klanten. Het uitsluiten van (geschat) 20% van de bevolking heeft grote consequenties voor de omzet. 

Daarnaast: toegang tot een webshop is voor veel mensen met een beperking de toegang tot onafhankelijkheid. Je hoeft niet meer naar de supermarkt met een lijstje, waar een medewerker de spullen voor je bij elkaar zoekt omdat je blind bent. Je kunt gewoon je boodschappen thuis laten bezorgen. 

Een toegankelijke website zorgt voor de vrijheid om zelf je inkopen te doen, ook als je bijvoorbeeld in een rolstoel zit en niet makkelijk zelf het huis uit kunt. 

De meetmethode

300 Websites testen op toegankelijkheid, hoe pak je dan aan? Sinds 2021 test Level Level de top 15 van de Twinkle100, en dat is steeds een hele klus. De hele bestelprocedure wordt handmatig en gedeeltelijk geautomatiseerd getest. Dit om goed te kunnen beoordelen of een gebruiker met een beperking echt kan bestellen. 

Om toch een beeld te krijgen van de toegankelijkheid van een website zijn de voorpagina’s met een automatisch gescand met axe-scan. Hiermee kun je verschillende websites tegelijk geautomatiseerd testen.

Een toegankelijke website moet aan een aantal richtlijnen voldoen. De Web Accessibility Content Guidelines (WCAG). Een aantal van deze richtlijnen is geautomatiseerd te meten. Op dit moment is nog niet alles zo te meten, voor een goede beoordeling moet nog veel handmatig getest worden. Maar een scan geeft toch een goed algemeen beeld.

We hebben gekeken naar kritieke en serieuze overtredingen van WCAG; overtredingen die mensen met een beperking echt verhinderen de website goed te begrijpen en te gebruiken. Hier gaat het om gebruikers die bijvoorbeeld blind zijn of de muis niet kunnen gebruiken.

Hoeveel fouten in de toegankelijkheid op de voorpagina?

Totaal aantal fouten

In de 312 websites vonden we totaal 38349 fouten. Welke fouten worden gemaakt en hoe vaak komen ze voor?

• 39%: Links hebben geen naam
• 22%: Knoppen hebben geen naam
• 20%: Afbeeldingen hebben geen alternatieve tekst
• 14%: Teksten hebben te weinig kleurcontrast
• 4%: Verkeerd gebruik van ARIA in de HTML-code
• 1%: Links in de tekst worden alleen aangegeven met een andere kleur en zijn niet onderstreept
• minder dan 1% zijn fouten in de HTML code, zoals het blokkeren van inzoomen en niet aangeven in welke taal een webpagina is geschreven.

Disclaimer: Een automatische test geeft een algemeen beeld en geen exacte weergave per website. Voor een goed beeld van de toegankelijkheid van een website is naast een automatische scan ook een handmatige toetsing nodig.

Fouten per website

Bij hoeveel websites komen deze fouten voor?

• 71%: Teksten hebben te weinig kleurcontrast
• 70%: Links hebben geen naam
• 64%: Knoppen hebben geen naam
• 40%: Afbeeldingen hebben geen alternatieve tekst
• 33%: Blokkeren van inzoomen
• 30%: Verkeerd gebruik van ARIA in de HTML-code
• 10%: Niet aangeven in welke taal een webpagina is geschreven
• 10%: Links in de tekst worden alleen aangegeven met een andere kleur en zijn niet onderstreept
• 4%: Fouten in de HTML- code

Elk jaar publiceert WebAIM een vergelijkbaar onderzoek van 1 miljoen websites wereldwijd: de WebAIM Million.

Opvallend dat de vaakst gemeten fouten in Nederlandse webwinkels overeenkomen met de wereldwijde trend: te weinig kleurcontrast voor teksten, links en knoppen zonder naam en afbeeldingen zonder teksten.

De meest voorkomende fouten

Teksten hebben te weinig kleurcontrast

Je wilt natuurlijk dat je bezoeker de tekst kan lezen. Als je jong en gezond bent kun je zelfs heel licht grijs van wit onderscheiden. Als we ouder worden, kleurenblind zijn of slechtziend, gaat een goed kleurcontrast echt een rol spelen. Voldoende kleurcontrast voor tekst is daarom essentieel voor een goed werkende webwinkel. 

Ga in gesprek met de webdesigner.

Links en knoppen hebben geen naam

Als je blind bent zie je niet wat er op het scherm staat. Een schermlezer zoals VoiceOver of NVDA leest de website voor en helpt de gebruiker op de website te navigeren.

Links of knoppen worden vaak alleen als een plaatje weergegeven. Zoals een link naar Facebook, of de knop om het menu te openen. De beste manier om dit weer te geven is om de naam erbij te zetten. Dus naast het Facebook icoontje het woord Facebook. En naast de drie streepjes het woord Menu. Een screen reader kan niet veel met een plaatje, maar tekst is altijd duidelijk.

Er zijn manieren om tekst toe te voegen die je niet ziet, maar die wel voorgelezen worden. En hier gaat het vaak fout. Veel programmeurs weten niet goed hoe dit moet. Dus laten ze de tekst weg en geven geen alternatief.

De consequentie is dat een blinde koper geen idee heeft wat een knop of link doet. En dat is echt jammer als die knop nu juist het winkelwagentje opent.

Ga in gesprek met de designer en je developer. Voeg toegankelijke namen toe aan links en knoppen.

Afbeeldingen hebben geen alternatieve tekst

Als een plaatje geen alternatieve tekst heeft maar toch betekenis heeft voor de inhoud, mist een blinde of slechtziende gebruiker de inhoud. Jammer als dit plaatje vertelt hoe een product eruit ziet, uitverkocht is, dat er korting wordt gegeven of een speciale actie.

Een korte, beschrijvende tekst is vaak al voldoende. Bijvoorbeeld: “Korting 50%.”, “rode trui met lange mouwen.”, “Sleutelhanger met Nijntje.”. 

Je hoeft geen extra tekst toe te voegen. De tekst “dit is een afbeelding van” is overbodig. De schermlezer leest al voor dat het een plaatje is.

Het schrijven van een goede “alt-tekst” wordt vaak als een lastig en overbodig klusje gezien. Sluit geen mensen uit die bij je willen kopen en afhaken omdat ze niet te weten komen wat ze kopen.

Ga in gesprek met je content-team. 

Conclusie

De meest genoemde fouten zijn meteen ook de makkelijkste om te fixen. 

• Voor het web-team: geef afbeeldingen een alternatieve tekst mee. 
• Voor de developer: geef knoppen en links een goede (toegankelijke) naam.
• Voor de designer: geef tekst voldoende kleurcontrast ten opzichte van de achtergrond. 

Al deze verbeteringen kun je (laten) maken zonder grote ingrijpende verbouwing van de website. Verbeter zo stapsgewijs de website. Als je deze problemen hebt opgelost, scoor je al beter dan de meeste websites (wereldwijd). 

Precies weten wat jij moet doen voor de European Accessibility Act?

In ons handboek ‘Bouwen aan een digitaal toegankelijke organisatie’ lees je exact wat je nodig hebt om klaar te zijn voor 2025.

✓ Wetgeving en richtlijnen.
✓ Wat digitale toegankelijkheid je oplevert.
✓ Naar een toegankelijke organisatie in 6 stappen.
✓ 10 punten om direct actie op te ondernemen.