Voorbeeldrapport · volledige versie

Dit is het hele rapport. Niet een stukje ervan.

Bekijk de opbouw van een volledig rapport: cover, score-opbouw, 21 bevindingen en controlepunten met codevoorbeelden, de roadmap, een concept-toegankelijkheidsverklaring en de briefing voor je bouwer. Dit geanonimiseerde praktijkvoorbeeld komt uit een echte scan van een Nederlandse webshop.

Scan je eigen website, gratis Download als pdf (1.2 MB)

De pdf toont dezelfde opbouw en rapportonderdelen als een klantrapport; je eigen bevindingen en teksten zijn uiteraard anders.

Eindscore: 59/100 · Matig
Bevindingen: 21 · 5 uit de interactietest
Pagina's gescand: 7 van de webshop
Scandatum: 10 oktober 2026

Waarom er geen naam bij staat. De webshop hieronder is echt gescand, maar wij publiceren geen namen van gescande websites. Die van jou dus ook niet. Weggehaald is alles wat naar de winkel terugleidt: het webadres werd voorbeeldwebshop.nl, en productnamen, categorieën, het telefoonnummer en de naam van de websitebouwer staan er als [productnaam A] of [categorie A]. Die haken zie je staan, zodat duidelijk is dát daar iets is weggelaten.

Meetlat van dit voorbeeld: WCAG 2.2 AA. De scan is op 10 oktober 2026 gedraaid met de scanner die ook klantrapporten maakt: de code-analyse, de interactietest met het toetsenbord en de koopflow van productpagina tot winkelwagen. Score, aantallen en tekst komen ongewijzigd uit die scan. Alleen wat naar de winkel terugleidt is weggehaald.

Eén verschil met een klantrapport: daar staat bij de focusbevinding een schermafbeelding van het onderdeel op je eigen pagina, met focus, die pixel voor pixel gelijk is aan de opname zonder focus. Hier is die weggelaten, want hij zou de winkel laten zien.

De bevindingen omvatten ook punten die handmatige controle vragen. De score bewijst geen conformiteit. Wat een handmatige audit daarnaast toevoegt, lees je in wat kost een toegankelijkheidsaudit.

Voorbeeldrapport-2026-10-10.pdf Geredigeerd praktijkvoorbeeld

eaachecker.nl

EAA-toegankelijkheidsrapport

Hoe staat jouw website ervoor?

Een geautomatiseerde technische analyse tegen WCAG 2.2 AA, waarbij je dienst onder de European Accessibility Act (EAA) kan vallen, inclusief fix-instructies voor je websitebouwer.

Praktijkvoorbeeld: diepe scan van een Nederlandse webshop op 10 oktober 2026, gemeten tegen WCAG 2.2 AA met dezelfde scanner als een klantrapport. De naam van de winkel en alles wat ernaar terugleidt is weggehaald, net als de schermafbeeldingen bij de focusbevinding. De score bewijst geen conformiteit. Het rapport bevat ook punten die handmatige controle vragen.

/ 100

Eindscore

Matig

Voorbeeldwebshop haalt 59 van 100: de belangrijkste drempel is dat op alle onderzochte pagina's niet zichtbaar is waar je met het toetsenbord bent.

Risico-indicatie: middel 21 bevindingen en controlepunten

Gescande website

https://voorbeeldwebshop.nl

Sector

ecommerce

Datum

10 oktober 2026

Inhoudsopgave

Managementsamenvatting

Wat we vonden, wat het betekent, en hoe urgent het is.
Wat is onderzocht?

Gescande pagina’s, meetmethode en beperkingen.
Score-opbouw en verdeling

Hoe de eindscore tot stand kwam en waar de vastgestelde fouten zitten.
WCAG-principes (POUR)

Score per categorie: waarneembaar, bedienbaar, begrijpelijk, robuust.
Per-pagina analyse

Wat is gevonden op elke gescande pagina.
Bevindingen in detail

21 bevindingen en controlepunten met impact, oplossing en hertest.
Quick wins

Bevindingen die je bouwer in een uur of minder kan oplossen.
Roadmap

Wat je deze week, deze maand en dit kwartaal oppakt.
Toegankelijkheidsverklaring

Concept om na beoordeling van je website aan te vullen en te publiceren.
Briefing voor je websitebouwer

Tekst die je direct kunt doorsturen naar je bouwer.
Begrippenlijst

Uitleg van de gebruikte termen.

Managementsamenvatting

Voor de ondernemer

Voorbeeldwebshop scoort 59 van 100 (Matig), met 9 vastgestelde fouten: 7 ernstige en 2 matige, geen kritieke. Het zwaarst weegt dat op zeven onderzochte pagina's niet te zien is waar je met het toetsenbord bent, ook bij de knop Toevoegen aan winkelwagen. Verder heeft de blauwe balk bovenaan te weinig kleurcontrast en heeft de Facebook-link geen naam voor hulpsoftware. Een webwinkel kan onder de EAA vallen. Is dat bij jou zo, dan is de ACM de toezichthouder en is het verstandig de ernstige punten snel te herstellen. Wat dit voor klanten betekent, meet de scan niet, maar wie zonder muis werkt kan bij zoeken, kiezen en bestellen wel hinder ondervinden. Let op: de winkelwagen is leeg getoetst en tekstvergroting kon op geen enkele pagina worden gemeten.

Risico-indicatie: middel

Er zijn geen kritieke fouten maar wel 7 ernstige, en vanaf 3 ernstige fouten staat het risico op middel. De EAA is sinds 28 juni 2025 van kracht en deze webwinkel kan eronder vallen, afhankelijk van onder meer de omvang van het bedrijf, en die kent de scan niet. Geldt de EAA, dan is de ACM de toezichthouder.

Wat dit betekent voor jouw sector

Een webwinkel wordt gebruikt om te zoeken, te kiezen en te bestellen, en elke stap vraagt iets van toetsenbord of schermlezer. Op de productpagina krijgt de knop Toevoegen aan winkelwagen na 23 keer Tab de focus, zonder zichtbare markering. De scan toetst tegen WCAG 2.2 AA als vooruitlopende technische meetlat, terwijl de ACM voor webwinkels nu nog WCAG 2.1 AA noemt.

Als de EAA voor deze webwinkel geldt, is de ACM toezichthouder en kunnen boetes oplopen tot €900.000 of 1% van de jaaromzet. Of dat het geval is, hangt onder meer af van de omvang van het bedrijf.

Wat is onderzocht?

7 pagina’s zijn onderzocht tegen WCAG 2.2 AA. De score vat gevonden problemen samen; 100 punten bewijst geen volledige toegankelijkheid.

Deze scan is een steekproef. De scanner onderzoekt code en een beperkte reeks interacties. Een volledige schermlezertest, inhoudelijke beoordeling van alternatieve teksten en een doorlopen bestel- of formulierproces ontbreken.

De scanner herkende op de onderzochte pagina’s geen cookiemelding, dus er is geen cookiemelding getoetst. Verschijnt er bij jou wel een, laat die dan afzonderlijk toetsen. De bouwer moet oplossingen in de werkelijke gebruikersroute controleren.

Homepage

https://voorbeeldwebshop.nl/

HTTP 200 · Interactietests: Afgerond, met een beperking · analyse-engine 4.13.0

Tekst vergroten tot 200% (1.4.4) liet zich op deze pagina niet nabootsen. Dat criterium is hier niet gemeten.

Productpagina

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

HTTP 200 · Interactietests: Afgerond, met een beperking · analyse-engine 4.13.0

Tekst vergroten tot 200% (1.4.4) liet zich op deze pagina niet nabootsen. Dat criterium is hier niet gemeten.

Winkelwagen

https://voorbeeldwebshop.nl/winkelmand/

HTTP 200 · Interactietests: Afgerond, met een beperking · analyse-engine 4.13.0

Tekst vergroten tot 200% (1.4.4) liet zich op deze pagina niet nabootsen. Dat criterium is hier niet gemeten.

De winkelwagen is leeg gemeten. De scanner legt nooit iets in de winkelwagen, dus aantallen wijzigen, verwijderen en doorgaan naar afrekenen zijn niet getoetst.

Contact

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

HTTP 200 · Interactietests: Afgerond, met een beperking · analyse-engine 4.13.0

Tekst vergroten tot 200% (1.4.4) liet zich op deze pagina niet nabootsen. Dat criterium is hier niet gemeten.

Categoriepagina

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

HTTP 200 · Interactietests: Afgerond, met een beperking · analyse-engine 4.13.0

Tekst vergroten tot 200% (1.4.4) liet zich op deze pagina niet nabootsen. Dat criterium is hier niet gemeten.

Overige pagina

https://voorbeeldwebshop.nl/zelf-samenstellen/

HTTP 200 · Interactietests: Afgerond, met een beperking · analyse-engine 4.13.0

Tekst vergroten tot 200% (1.4.4) liet zich op deze pagina niet nabootsen. Dat criterium is hier niet gemeten.

Categoriepagina

https://voorbeeldwebshop.nl/product-category/categorie/

HTTP 200 · Interactietests: Afgerond, met een beperking · analyse-engine 4.13.0

Tekst vergroten tot 200% (1.4.4) liet zich op deze pagina niet nabootsen. Dat criterium is hier niet gemeten.

De koopflow

Welke stap van het bestellen gemeten is. Behalve de weigerknop van de cookiemelding klikt de scanner niets aan.

Vinden · Gemeten

https://voorbeeldwebshop.nl/

Product kiezen · Gemeten

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

Bestelknop: "Toevoegen aan winkelwagen" · bereikt na 23 keer Tab · focus niet zichtbaar · 301×50 pixels.

Winkelwagen · Gemeten

https://voorbeeldwebshop.nl/winkelmand/

Leeg gemeten.

Contact en hulp · Gemeten

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

Score-opbouw en verdeling

Hoe de eindscore tot stand kwam

100

Startpunt

→

−24

5 ernstige fouten

→

−3

1 matige fout

→

−12

2 ernstige fouten

→

−2

1 matige fout

Eindscore

De code-analyse kostte 27 punten (5 ernstige en 1 matige fout). De interactietest, waarbij de scanner zelf met het toetsenbord door de pagina's liep, kostte 14 punten (2 ernstige en 1 matige fout). Controlepunten en aanbevelingen kosten geen punten.

Twee meetlagen

De score kan bevindingen uit code-analyse en interactietests bevatten. Interactietests onderzoeken onder meer Tab-navigatie, een venster van 320 pixels, tekst op 200%, bewegende inhoud en formuliervelden. Alleen daadwerkelijk vastgestelde fouten geven aftrek; handmatige controlepunten en aanbevelingen staan apart. De meetdekking vermeldt welke tests konden worden uitgevoerd.

Onderdeel	Gevonden	Aftrek
Code-analyse (axe-core)	6 vastgestelde fouten	−27
Interactietest (toetsenbord, zoom, formulieren)	3 vastgestelde fouten · 2 om na te kijken of advies	−14

Vastgestelde fouten per ernstniveau

Kritiek

Ernstig

Matig

Laag

WCAG-principes: waar zit de pijn?

WCAG kent vier principes: een goede website is waarneembaar, bedienbaar, begrijpelijk en robuust. Hieronder zie je hoe jouw website per principe scoort.

Elk principe krijgt een eigen cijfer. Dat cijfer staat los van de hoofdscore: het zegt hoe zwaar dit ene onderdeel geraakt is, niet hoeveel het van de hoofdscore afhaalt. Daarom wegen bevindingen hier zwaarder. Een principe kleurt alleen groen als we er niets vonden.

Waarneembaar · 4 vastgestelde fouten

37/100

Inhoud die voor iedereen zichtbaar of hoorbaar is: alt-teksten, contrast, ondertiteling.

Op alle zeven pagina's staat witte tekst op een lichtblauwe balk met een contrast van 2,74 tegen de vereiste 4,5, en op de productpagina zijn links in lopende tekst alleen aan kleur te herkennen. Ook staat inzoomen op telefoons uit en missen 3 velden van het aanmeldformulier op de homepage een signaal voor automatisch invullen.

Bedienbaar · 4 vastgestelde fouten

16/100

Elke functie te bedienen met toetsenbord, geen tijdklemmen.

Bedienen zonder muis is het zwakste punt: bij 230 van de 235 gemeten onderdelen is niet te zien dat ze de focus hebben. Daar komen een Facebook-link zonder naam, een zoekveld dat achter de vaste balk verdwijnt en een te kleine paginalink bij.

Begrijpelijk · 0 vastgestelde fouten

100/100

Voorspelbare navigatie, duidelijke foutmeldingen, leesbare taal.

In deze steekproef geen probleem aangetoond. Of formuliermeldingen begrijpelijk en behulpzaam zijn, is niet getest en vraagt een handmatige controle.

Robuust · 1 vastgestelde fout

76/100

Werkt met schermlezers en hulptechnologie, dankzij semantische HTML.

Op de pagina Zelf samenstellen staat een ingesloten onderdeel van 1200 pixels hoog zonder naam. Hulpsoftware kan het daardoor niet benoemen.

Per-pagina analyse

Hieronder staan 7 bezochte pagina's, inclusief eventueel onvolledig geladen pagina’s. Hieronder zie je per pagina wat is gevonden.

Homepage

https://voorbeeldwebshop.nl/

6 vastgestelde fouten 4 hoog 2 middel 5 om na te kijken · 3 adviezen

Zes vastgestelde fouten, van de naamloze Facebook-link tot drie aanmeldvelden zonder automatisch invullen. Fouten die op meer pagina's terugkomen, tellen in dit overzicht per pagina mee.

5 automatische controles vragen handmatige beoordeling (27 elementwaarnemingen).

Productpagina

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

6 vastgestelde fouten 5 hoog 1 middel 2 om na te kijken · 3 adviezen

De knop Toevoegen aan winkelwagen heeft een duidelijke naam en is 301 bij 50 pixels groot, maar krijgt na 23 keer Tab de focus zonder zichtbare markering. Links in lopende tekst zijn alleen aan kleur te herkennen.

1 automatische controles vragen handmatige beoordeling (1 elementwaarnemingen).

Winkelwagen

https://voorbeeldwebshop.nl/winkelmand/

5 vastgestelde fouten 4 hoog 1 middel 1 om na te kijken · 3 adviezen

De winkelmand is leeg gemeten, dus wijzigen, verwijderen en doorgaan naar afrekenen zijn niet getoetst. Wat wel gemeten is: geen zichtbare focus, te weinig contrast in de balk bovenaan en de naamloze Facebook-link.

1 automatische controles vragen handmatige beoordeling (1 elementwaarnemingen).

Contact

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

5 vastgestelde fouten 4 hoog 1 middel 2 om na te kijken · 3 adviezen

Dezelfde basisfouten als elders: focus, contrast, Facebook-link en zoomblokkade. Het ene formulier op deze pagina heeft geen statusgebied, een controlepunt.

1 automatische controles vragen handmatige beoordeling (1 elementwaarnemingen).

Categoriepagina

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

6 vastgestelde fouten 5 hoog 1 middel 4 om na te kijken · 3 adviezen

De link naar pagina 2 meet 21,8 bij 28 pixels en is daarmee te klein. Het contrast van 62 elementen kon niet worden vastgesteld en vraagt een handmatige controle.

4 automatische controles vragen handmatige beoordeling (66 elementwaarnemingen).

Overige pagina

https://voorbeeldwebshop.nl/zelf-samenstellen/

6 vastgestelde fouten 5 hoog 1 middel 1 om na te kijken · 3 adviezen

Een ingesloten onderdeel van 1200 pixels hoog heeft geen naam. Wat erin gebeurt, kon de scanner niet inzien.

1 automatische controles vragen handmatige beoordeling (2 elementwaarnemingen).

Categoriepagina

https://voorbeeldwebshop.nl/product-category/categorie/

5 vastgestelde fouten 4 hoog 1 middel 5 om na te kijken · 2 adviezen

Bij 48 van de 49 gemeten onderdelen is geen focus te zien. Controlepunten zijn het contrast van 12 elementen en een verborgen fotovenster.

5 automatische controles vragen handmatige beoordeling (16 elementwaarnemingen).

Bevindingen in detail

Hoog · 7 fouten

B-03 · Geen zichtbare markering bij toetsenbordgebruik

Hoog

WCAG · 2.4.7 Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 1 uur

Wat is er aan de hand?

De scanner liep op zeven pagina's met de Tab-toets door alle bereikbare onderdelen. Bij 230 van de 235 zichtbare onderdelen veranderde er niets in beeld zodra ze de focus kregen. Op elke pagina is dat bij minstens 12 onderdelen met schermafbeeldingen bevestigd, en het geldt ook voor de knop Toevoegen aan winkelwagen, die op de productpagina na 23 keer Tab de focus krijgt.

Vastgesteld door de pagina zelf te bedienen

Impact op gebruikers

Het raakt mensen die met het toetsenbord of een schakelaar navigeren, zoals mensen met een motorische beperking. Slechtziende bezoekers die het toetsenbord gebruiken, missen de markering ook.

Impact op je business

Wie zonder muis een product zoekt en wil bestellen, ziet niet waar hij zit, en dat kan zoeken, kiezen en bestellen bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

47 elementwaarnemingen · meetregel focus-not-visible

47 van de 47 met Tab bereikte, zichtbare elementen veranderen niet zichtbaar als ze focus krijgen (100%). Bij 12 daarvan is dat met schermafbeeldingen bevestigd: met en zonder focus pixel voor pixel gelijk. Wie zonder muis navigeert, ziet niet waar hij is.

div#et-info > a

div#et-info > ul.et-social-icons > li.et-social-icon.et-social-facebook > a.icon

div#et-secondary-menu > a.et-cart-info

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

32 elementwaarnemingen · meetregel focus-not-visible

32 van de 33 met Tab bereikte, zichtbare elementen veranderen niet zichtbaar als ze focus krijgen (97%). Bij 13 daarvan is dat met schermafbeeldingen bevestigd: met en zonder focus pixel voor pixel gelijk. Wie zonder muis navigeert, ziet niet waar hij is.

div#et-info > a

div#et-info > ul.et-social-icons > li.et-social-icon.et-social-facebook > a.icon

div#et-secondary-menu > a.et-cart-info

https://voorbeeldwebshop.nl/winkelmand/

21 elementwaarnemingen · meetregel focus-not-visible

21 van de 21 met Tab bereikte, zichtbare elementen veranderen niet zichtbaar als ze focus krijgen (100%). Bij 12 daarvan is dat met schermafbeeldingen bevestigd: met en zonder focus pixel voor pixel gelijk. Wie zonder muis navigeert, ziet niet waar hij is.

div#et-info > a

div#et-info > ul.et-social-icons > li.et-social-icon.et-social-facebook > a.icon

div#et-secondary-menu > a.et-cart-info

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

21 elementwaarnemingen · meetregel focus-not-visible

div#et-info > a

div#et-info > ul.et-social-icons > li.et-social-icon.et-social-facebook > a.icon

div#et-secondary-menu > a.et-cart-info

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

46 elementwaarnemingen · meetregel focus-not-visible

46 van de 49 met Tab bereikte, zichtbare elementen veranderen niet zichtbaar als ze focus krijgen (94%). Bij 12 daarvan is dat met schermafbeeldingen bevestigd: met en zonder focus pixel voor pixel gelijk. Wie zonder muis navigeert, ziet niet waar hij is.

div#et-info > a

div#et-info > ul.et-social-icons > li.et-social-icon.et-social-facebook > a.icon

div#et-secondary-menu > a.et-cart-info

https://voorbeeldwebshop.nl/zelf-samenstellen/

15 elementwaarnemingen · meetregel focus-not-visible

15 van de 15 met Tab bereikte, zichtbare elementen veranderen niet zichtbaar als ze focus krijgen (100%). Bij 12 daarvan is dat met schermafbeeldingen bevestigd: met en zonder focus pixel voor pixel gelijk. Wie zonder muis navigeert, ziet niet waar hij is.

div#et-info > a

div#et-info > ul.et-social-icons > li.et-social-icon.et-social-facebook > a.icon

div#et-secondary-menu > a.et-cart-info

https://voorbeeldwebshop.nl/product-category/categorie/

48 elementwaarnemingen · meetregel focus-not-visible

48 van de 49 met Tab bereikte, zichtbare elementen veranderen niet zichtbaar als ze focus krijgen (98%). Bij 12 daarvan is dat met schermafbeeldingen bevestigd: met en zonder focus pixel voor pixel gelijk. Wie zonder muis navigeert, ziet niet waar hij is.

div#et-info > a

div#et-info > ul.et-social-icons > li.et-social-icon.et-social-facebook > a.icon

div#et-secondary-menu > a.et-cart-info

Fragment uit de meting
<a href="mailto:info@voorbeeldwebshop.nl"><span id="et-info-email">info@voorbeeldwebshop.nl</span></a>

Mogelijke correctie
<a href="mailto:info@voorbeeldwebshop.nl"><span id="et-info-email">info@voorbeeldwebshop.nl</span></a>
/* CSS: a:focus-visible { outline: 2px solid [kleur met voldoende contrast]; outline-offset: 2px; } */

Oplossing en hertest voor B-03

Juridische relevantie

Criterium 2.4.7 (niveau AA) staat in WCAG 2.1 en 2.2, dus ook in de norm die de ACM nu noemt als de EAA voor jou geldt.

Voor je bouwer: wat te doen

Zoek in het thema of de aangepaste CSS naar regels als outline: none of outline: 0 op a, button en input, en verwijder ze. Voeg een eigen :focus-visible stijl toe met een rand van minstens 2px in een kleur met voldoende contrast tegen de achtergrond. Controleer vooral de koopknop, de menulinks en het zoekveld.

Hertest en verwacht resultaat

1. Open de homepage, een productpagina en de winkelmand en druk herhaaldelijk op Tab. Verwacht: elke link, knop en elk veld toont een duidelijke rand of achtergrond zodra het de focus heeft. 2. Controleer dat de knop Toevoegen aan winkelwagen zichtbaar is gemarkeerd zodra hij de focus krijgt. 3. Draai de scan opnieuw; verwacht geen melding meer over ontbrekende focus.

B-04 · Te weinig kleurcontrast in de balk bovenaan

Hoog

WCAG · 1.4.3 Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 1 uur

Wat is er aan de hand?

De scanner telde 51 elementen met te weinig contrast, opgeteld over zeven pagina's (17 op de homepage, 10 op de productpagina). De voorbeelden zijn wit op lichtblauw: het telefoonnummer, het e-mailadres en de winkelwagenteller in de balk bovenaan, met een contrast van 2,74 tegen de vereiste 4,5 voor kleine tekst. Omdat die balk op elke pagina terugkomt, telt dezelfde plek op elke pagina mee.

Vastgesteld in de code van de pagina

Impact op gebruikers

Het raakt slechtziende bezoekers, mensen met een kleurzwakte en iedereen die op een telefoon in fel licht kijkt. Voor hen is contact zoeken via de balk bovenaan lastiger.

Impact op je business

Telefoonnummer en e-mailadres zijn voor sommige bezoekers moeilijk te lezen, en dat kan contact opnemen over een bestelling bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

17 elementwaarnemingen · meetregel color-contrast

["#et-info-phone"]

["#et-info-email"]

[".et-cart-info > span"]

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

10 elementwaarnemingen · meetregel color-contrast

["#et-info-phone"]

["#et-info-email"]

[".et-cart-info > span"]

https://voorbeeldwebshop.nl/winkelmand/

4 elementwaarnemingen · meetregel color-contrast

["#et-info-phone"]

["#et-info-email"]

[".et-cart-info > span"]

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

3 elementwaarnemingen · meetregel color-contrast

["#et-info-phone"]

["#et-info-email"]

[".et-cart-info > span"]

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

7 elementwaarnemingen · meetregel color-contrast

["#et-info-phone"]

["#et-info-email"]

[".et-cart-info > span"]

https://voorbeeldwebshop.nl/zelf-samenstellen/

4 elementwaarnemingen · meetregel color-contrast

["#et-info-phone"]

["#et-info-email"]

[".et-cart-info > span"]

https://voorbeeldwebshop.nl/product-category/categorie/

6 elementwaarnemingen · meetregel color-contrast

["#et-info-phone"]

["#et-info-email"]

[".et-cart-info > span"]

Fragment uit de meting
<span>Items 0</span>

Mogelijke correctie
<span id="et-info-phone">[telefoonnummer]</span>
/* CSS: pas de achtergrond #2ea3f2 aan naar [donkerder blauw, contrast met wit minstens 4.5:1] */

Oplossing en hertest voor B-04

Juridische relevantie

Criterium 1.4.3 is een AA-criterium dat in zowel WCAG 2.1 als 2.2 staat.

Voor je bouwer: wat te doen

Maak de achtergrond van de bovenbalk donkerder of de tekst donkerder, zodat kleine tekst minstens 4.5:1 haalt (nu 2.74:1 voor #ffffff op #2ea3f2 bij 12px). Pas dit aan in de themakleuren, zodat het op alle pagina's tegelijk verandert. Controleer daarna de overige elementen die de scanner telde, zoals de 17 op de homepage.

Hertest en verwacht resultaat

1. Meet na de aanpassing het contrast van telefoonnummer, e-mailadres en winkelwagenteller met een contrastmeter of de ontwikkelaarstools van de browser. Verwacht: minstens 4.5:1. 2. Draai de scan opnieuw op de homepage en de productpagina; verwacht geen melding meer voor de balk bovenaan.

B-05 · Facebook-link zonder naam voor hulpsoftware

Hoog

WCAG · 2.4.4, 4.1.2 Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 15 min

Wat is er aan de hand?

Op alle zeven pagina's staat in de balk bovenaan een Facebook-icoon dat als link werkt, steeds dezelfde link. In de code staat het woord Facebook wel, maar de scanner meldt dat die tekst voor een schermlezer niet beschikbaar is.

Vastgesteld in de code van de pagina

Impact op gebruikers

Het raakt gebruikers van een schermlezer, zoals blinde en slechtziende bezoekers, en mensen die de pagina met spraak bedienen.

Impact op je business

Wie via Facebook meer over de winkel wil weten, kan die link met hulpsoftware niet herkennen, wat het zoeken naar informatie over de winkel kan bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

1 elementwaarnemingen · meetregel link-name

["#et-info > .et-social-icons > .et-social-icon.et-social-facebook > .icon"]

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

1 elementwaarnemingen · meetregel link-name

["#et-info > .et-social-icons > .et-social-icon.et-social-facebook > .icon"]

https://voorbeeldwebshop.nl/winkelmand/

1 elementwaarnemingen · meetregel link-name

["#et-info > .et-social-icons > .et-social-icon.et-social-facebook > .icon"]

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel link-name

["#et-info > .et-social-icons > .et-social-icon.et-social-facebook > .icon"]

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel link-name

["#et-info > .et-social-icons > .et-social-icon.et-social-facebook > .icon"]

https://voorbeeldwebshop.nl/zelf-samenstellen/

1 elementwaarnemingen · meetregel link-name

["#et-info > .et-social-icons > .et-social-icon.et-social-facebook > .icon"]

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel link-name

["#et-info > .et-social-icons > .et-social-icon.et-social-facebook > .icon"]

Fragment uit de meting
<a href="https://www.facebook.com/[accountnaam]/" class="icon">
<span>Facebook</span>
</a>

Mogelijke correctie
<a href="https://www.facebook.com/[accountnaam]/" class="icon" aria-label="Facebook">
<span>Facebook</span>
</a>

Oplossing en hertest voor B-05

Juridische relevantie

Dit raakt de criteria 2.4.4 en 4.1.2, beide niveau A in WCAG 2.1 en 2.2.

Voor je bouwer: wat te doen

Geef de link een aria-label="Facebook". Controleer ook waarom de tekst in de span niet door hulpsoftware wordt gelezen: staat daar display:none, visibility:hidden of font-size:0 op? Gebruik zo nodig een visually-hidden stijl en markeer het icoon zelf met aria-hidden="true".

Hertest en verwacht resultaat

1. Open de homepage met een schermlezer en tab naar het Facebook-icoon. Verwacht: de schermlezer leest Facebook en link voor. 2. Draai de scan opnieuw; verwacht geen melding meer over een link zonder naam.

B-06 · Links in lopende tekst alleen aan kleur herkenbaar

Hoog

WCAG · 1.4.1 Pagina: Productpagina Geschatte werktijd: 15 min

Wat is er aan de hand?

Op de productpagina vond de scanner 2 links die midden in een stuk tekst staan: aanbiedingen en [websitebouwer]. Het kleurverschil met de grijze tekst eromheen is 2,08 tegen 1, terwijl 3 tegen 1 nodig is. Een onderstreping hebben ze niet.

Vastgesteld in de code van de pagina

Impact op gebruikers

Het raakt mensen met kleurenblindheid of een verminderd kleurzicht. Zij zien niet dat er in de tekst iets te klikken valt.

Impact op je business

Een link naar de aanbiedingen die niet opvalt, kan het vinden van acties en kortingen bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

2 elementwaarnemingen · meetregel link-in-text-block

["a[href$=\"aanbiedingen\"]"]

["a[href$=\"[websitebouwer]\"]"]

Fragment uit de meting
<a href="/aanbiedingen">aanbiedingen</a>

Mogelijke correctie
<a href="/aanbiedingen" style="text-decoration: underline">aanbiedingen</a>

Oplossing en hertest voor B-06

Juridische relevantie

Criterium 1.4.1 (niveau A) staat in alle WCAG-versies.

Voor je bouwer: wat te doen

Geef links in lopende tekst standaard een onderstreping (text-decoration: underline). Een alternatief is een kleurverschil van minstens 3:1 met de omliggende tekst, maar combineer dat dan met een tweede kenmerk, zoals onderstreping bij hover en focus.

Hertest en verwacht resultaat

1. Open de productpagina en kijk naar de links aanbiedingen en [websitebouwer], eventueel met een kleurenblindheidsfilter in de browser. Verwacht: beide links zijn onderstreept. 2. Draai de scan opnieuw; verwacht geen melding meer over links die op kleur steunen.

B-07 · Focus verdwijnt achter de balk bovenaan

Hoog

WCAG · 2.4.11 Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 1 uur

Wat is er aan de hand?

Op alle zeven pagina's zat 1 tabstop op het moment van focus helemaal achter de vaste balk bovenaan, bijvoorbeeld 1 van de 50 op de categoriepagina [categorie B]. Het voorbeeld dat de scanner meegaf is het zoekveld: wie er met Tab naartoe gaat, ziet het niet.

Vastgesteld door de pagina zelf te bedienen

Impact op gebruikers

Het raakt toetsenbordgebruikers, onder wie mensen met een motorische beperking. Zij verliezen op dat punt het zicht op hun positie.

Impact op je business

Een zoekveld dat bij toetsenbordgebruik uit beeld verdwijnt, kan het zoeken naar een bepaald product bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

1 elementwaarnemingen · meetregel focus-obscured

1 van de 49 tabstops zaten op het moment van focus helemaal achter een vaste laag op de pagina (div#top-header). Wie met Tab door de pagina gaat, ziet op die momenten niet waar de focus staat.

div.et_search_outer > div.container.et_search_form_container > form.et-search-form > input.et-search-field

div#top-header

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

1 elementwaarnemingen · meetregel focus-obscured

1 van de 34 tabstops zaten op het moment van focus helemaal achter een vaste laag op de pagina (div#top-header). Wie met Tab door de pagina gaat, ziet op die momenten niet waar de focus staat.

div.et_search_outer > div.container.et_search_form_container > form.et-search-form > input.et-search-field

div#top-header

https://voorbeeldwebshop.nl/winkelmand/

1 elementwaarnemingen · meetregel focus-obscured

1 van de 22 tabstops zaten op het moment van focus helemaal achter een vaste laag op de pagina (div#top-header). Wie met Tab door de pagina gaat, ziet op die momenten niet waar de focus staat.

div.et_search_outer > div.container.et_search_form_container > form.et-search-form > input.et-search-field

div#top-header

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel focus-obscured

1 van de 22 tabstops zaten op het moment van focus helemaal achter een vaste laag op de pagina (div#top-header). Wie met Tab door de pagina gaat, ziet op die momenten niet waar de focus staat.

div.et_search_outer > div.container.et_search_form_container > form.et-search-form > input.et-search-field

div#top-header

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel focus-obscured

1 van de 50 tabstops zaten op het moment van focus helemaal achter een vaste laag op de pagina (div#top-header). Wie met Tab door de pagina gaat, ziet op die momenten niet waar de focus staat.

div.et_search_outer > div.container.et_search_form_container > form.et-search-form > input.et-search-field

div#top-header

https://voorbeeldwebshop.nl/zelf-samenstellen/

1 elementwaarnemingen · meetregel focus-obscured

1 van de 16 tabstops zaten op het moment van focus helemaal achter een vaste laag op de pagina (div#top-header). Wie met Tab door de pagina gaat, ziet op die momenten niet waar de focus staat.

div.et_search_outer > div.container.et_search_form_container > form.et-search-form > input.et-search-field

div#top-header

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel focus-obscured

1 van de 50 tabstops zaten op het moment van focus helemaal achter een vaste laag op de pagina (div#top-header). Wie met Tab door de pagina gaat, ziet op die momenten niet waar de focus staat.

div.et_search_outer > div.container.et_search_form_container > form.et-search-form > input.et-search-field

div#top-header

Fragment uit de meting
<input type="search" class="et-search-field" placeholder="Zoeken …" value="" name="s" title="Zoeken naar:">

Mogelijke correctie
<input type="search" class="et-search-field" placeholder="Zoeken …" value="" name="s" title="Zoeken naar:">
/* CSS: html { scroll-padding-top: [hoogte van de vaste balk]; } */

Oplossing en hertest voor B-07

Juridische relevantie

Criterium 2.4.11 komt uit WCAG 2.2 (niveau AA), de vooruitlopende meetlat van deze scan; de ACM noemt voor webwinkels nu nog WCAG 2.1 AA.

Voor je bouwer: wat te doen

Het zoekveld zit waarschijnlijk in een uitklapbare zoekbalk die dicht staat. Controleer dat. Haal het veld uit de tabvolgorde zolang de zoekbalk gesloten is (display:none of tabindex="-1") en open de balk bij het activeren van de zoekknop. Gebruik anders scroll-padding-top gelijk aan de hoogte van de vaste balk.

Hertest en verwacht resultaat

1. Tab op de homepage en een productpagina door de pagina tot het zoekveld de focus krijgt. Verwacht: het veld is volledig zichtbaar of niet bereikbaar zolang de zoekbalk dicht is. 2. Draai de scan opnieuw; verwacht geen tabstops meer achter de vaste balk.

B-08 · Paginalink te klein om aan te raken

Hoog

WCAG · 2.5.8 Pagina: Categoriepagina Geschatte werktijd: 15 min

Wat is er aan de hand?

Op de categoriepagina [categorie B] meet de link naar pagina 2 21,8 bij 28 pixels, terwijl minstens 24 bij 24 nodig is. De vrije ruimte rond de link is 23,8 pixels in plaats van 24.

Vastgesteld in de code van de pagina

Impact op gebruikers

Het raakt mensen met een motorische beperking en iedereen die op een telefoon met een dikke vinger tikt.

Impact op je business

Een paginalink die moeilijk te raken is, kan het doorbladeren door het assortiment bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel target-size

["a[aria-label=\"Pagina 2\"]"]

Fragment uit de meting
<a aria-label="Pagina 2" class="page-numbers" href="/product-category/[categorie A]/[categorie B]/?product-page=2">2</a>

Mogelijke correctie
<a aria-label="Pagina 2" class="page-numbers" href="/product-category/[categorie A]/[categorie B]/?product-page=2" style="display:inline-block; min-width:24px; min-height:24px">2</a>

Oplossing en hertest voor B-08

Juridische relevantie

Criterium 2.5.8 komt uit WCAG 2.2 (niveau AA), de vooruitlopende meetlat van deze scan; de ACM noemt nu nog 2.1 AA.

Voor je bouwer: wat te doen

Geef de paginanummer-links (klasse page-numbers) een minimale breedte en hoogte van 24px, bijvoorbeeld met min-width, min-height en padding, of vergroot de ruimte tussen de nummers.

Hertest en verwacht resultaat

1. Meet op de categoriepagina [categorie B] met de ontwikkelaarstools de afmeting van de paginalinks. Verwacht: minstens 24 bij 24 pixels of voldoende ruimte eromheen. 2. Draai de scan opnieuw; verwacht geen melding meer over de grootte.

B-09 · Onderdeel op samenstelpagina heeft geen naam

Hoog

WCAG · 4.1.2 Pagina: Overige pagina Geschatte werktijd: 15 min

Wat is er aan de hand?

Op de pagina Zelf samenstellen staat een ingesloten onderdeel van een andere pagina, 1200 pixels hoog. Het heeft geen titel waarmee hulpsoftware kan zeggen wat het is. Wat er in dat onderdeel gebeurt, kon de scanner niet inzien.

Vastgesteld in de code van de pagina

Impact op gebruikers

Het raakt gebruikers van een schermlezer. Zij horen niet waar dit onderdeel voor dient.

Impact op je business

Als dit onderdeel het samenstellen van een eigen product mogelijk maakt, kan een naamloos blok die stap voor schermlezergebruikers bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/zelf-samenstellen/

1 elementwaarnemingen · meetregel frame-title

[".et_pb_code_inner > iframe"]

Fragment uit de meting
<iframe src="https://voorbeeldwebshop.nl/[pad samenstelhulp]" style="width:100%;max-width:100%;height:1200px;border:0" loading="lazy"></iframe>

Mogelijke correctie
<iframe title="[korte omschrijving van wat dit onderdeel doet]" src="https://voorbeeldwebshop.nl/[pad samenstelhulp]" style="width:100%;max-width:100%;height:1200px;border:0" loading="lazy"></iframe>

Oplossing en hertest voor B-09

Juridische relevantie

Criterium 4.1.2 (niveau A) staat in alle WCAG-versies.

Voor je bouwer: wat te doen

Voeg een title-attribuut toe aan de iframe dat in een paar woorden zegt wat erin staat. Laat de bouwer van dit onderdeel ook nagaan of de inhoud met toetsenbord en schermlezer bruikbaar is, want die inhoud is hier niet getest.

Hertest en verwacht resultaat

1. Tab met een schermlezer naar het onderdeel op Zelf samenstellen. Verwacht: de titel wordt voorgelezen. 2. Test handmatig of de inhoud erin met het toetsenbord te bedienen is.

Middel · 2 fouten

B-17 · Inzoomen op telefoons is geblokkeerd

Middel

WCAG · 1.4.4 Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 15 min

Wat is er aan de hand?

In de code van alle zeven pagina's staat een instelling die vergroten met twee vingers op een telefoon uitschakelt. Of tekstvergroting tot 200% werkt, kon de scanner op geen enkele pagina meten.

Vastgesteld in de code van de pagina

Impact op gebruikers

Het raakt slechtziende bezoekers en iedereen die op een telefoon kleine letters moet vergroten.

Impact op je business

Wie productinformatie of prijzen niet kan vergroten, kan het kiezen en bestellen op een telefoon moeilijker vinden.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

1 elementwaarnemingen · meetregel meta-viewport

["meta[name=\"viewport\"]"]

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

1 elementwaarnemingen · meetregel meta-viewport

["meta[name=\"viewport\"]"]

https://voorbeeldwebshop.nl/winkelmand/

1 elementwaarnemingen · meetregel meta-viewport

["meta[name=\"viewport\"]"]

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel meta-viewport

["meta[name=\"viewport\"]"]

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel meta-viewport

["meta[name=\"viewport\"]"]

https://voorbeeldwebshop.nl/zelf-samenstellen/

1 elementwaarnemingen · meetregel meta-viewport

["meta[name=\"viewport\"]"]

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel meta-viewport

["meta[name=\"viewport\"]"]

Fragment uit de meting
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

Mogelijke correctie
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Oplossing en hertest voor B-17

Juridische relevantie

Criterium 1.4.4 (niveau AA) staat in WCAG 2.1 en 2.2.

Voor je bouwer: wat te doen

Pas de meta viewport-tag aan in de header van het thema: verwijder maximum-scale=1.0 en user-scalable=0 en laat width=device-width, initial-scale=1.0 staan.

Hertest en verwacht resultaat

1. Open een productpagina op een telefoon en zoom met twee vingers in. Verwacht: de pagina vergroot. 2. Draai de scan opnieuw; verwacht geen melding meer over geblokkeerd zoomen. Controleer handmatig ook tekstvergroting tot 200%, dat is nog niet gemeten.

B-18 · Aanmeldvelden missen automatisch invullen

Middel

WCAG · 1.3.5 Pagina: Homepage Geschatte werktijd: 15 min

Wat is er aan de hand?

Op de homepage hebben 3 velden voor persoonsgegevens (Voornaam, Achternaam en E-mail) geen aanduiding waarvoor ze dienen. Browsers kunnen ze daardoor niet automatisch invullen.

Vastgesteld door de pagina zelf te bedienen

Impact op gebruikers

Het raakt mensen met een motorische of cognitieve beperking, voor wie elk teken typen extra moeite kost.

Impact op je business

Een aanmeldformulier dat niet automatisch invulbaar is, kan het aanmelden voor sommige bezoekers bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

3 elementwaarnemingen · meetregel input-purpose-missing

3 veld(en) voor persoonsgegevens hebben geen autocomplete-attribuut. Browsers en hulpsoftware kunnen ze daardoor niet automatisch invullen. Voor mensen met een motorische of cognitieve beperking scheelt dat veel typwerk en fouten.

input#et_pb_signup_firstname

input#et_pb_signup_lastname

input#et_pb_signup_email

Fragment uit de meting
<input class="input" id="et_pb_signup_email" type="text" placeholder="E-mail" name="et_pb_signup_email">

Mogelijke correctie
<input class="input" id="et_pb_signup_firstname" type="text" placeholder="Voornaam" name="et_pb_signup_firstname" autocomplete="given-name">

Oplossing en hertest voor B-18

Juridische relevantie

Criterium 1.3.5 (niveau AA) staat in WCAG 2.1 en 2.2.

Voor je bouwer: wat te doen

Voeg autocomplete toe aan de drie velden: given-name, family-name en email. Overweeg ook type="email" voor het e-mailveld.

Hertest en verwacht resultaat

1. Laat de browser de velden op de homepage automatisch invullen. Verwacht: voornaam, achternaam en e-mail worden aangeboden. 2. Draai de scan opnieuw; verwacht geen melding meer over ontbrekende autocomplete.

Handmatig beoordelen · 9 controlepunten

B-01 · Formulier verwijst mogelijk naar ontbrekende onderdelen

Handmatig beoordelen

WCAG · 4.1.2 Pagina: Homepage Geschatte werktijd: 1 uur ⚠ Verificatie nodig

Wat is er aan de hand?

Op de homepage staat een formuliercontainer die met naamgevings-attributen verwijst naar een titel en een gebied voor foutmeldingen. De scanner kon niet vaststellen of die onderdelen bestaan. Op het meetmoment stond er nog een laadindicator in beeld.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij een onjuiste verwijzing raakt het gebruikers van een schermlezer, die de formuliertitel of foutmeldingen dan missen.

Impact op je business

Een formulier waarvan de meldingen niet worden voorgelezen, kan het contact opnemen voor schermlezergebruikers bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

1 elementwaarnemingen · meetregel aria-valid-attr-value

["#nf-form-2-cont"]

Oplossing en hertest voor B-01

Juridische relevantie

Pas als vaststaat dat de verwijzingen niet kloppen, raakt dit criterium 4.1.2 (niveau A); nu is het een controlepunt.

Voor je bouwer: wat te doen

Controleer in de geladen pagina of de elementen met id nf-form-title-2 en nf-form-errors-2 bestaan. Bestaan ze niet, verwijder dan de verwijzing of zorg dat het element wordt aangemaakt.

Hertest en verwacht resultaat

1. Open de homepage, wacht tot het formulier geladen is en zoek de elementen nf-form-title-2 en nf-form-errors-2 in de code. Bestaan ze, dan is er geen probleem. 2. Bestaan ze niet, herstel de verwijzing en draai de scan opnieuw.

Waarom verificatie nodig is

Het formulier was op het meetmoment nog aan het laden, waardoor de scanner niet kon vaststellen of de verwezen onderdelen bestaan. Dit moet na het laden handmatig worden gecontroleerd.

B-02 · Ingesloten onderdelen niet doorzocht

Handmatig beoordelen

WCAG · Aanbeveling (geen WCAG-criterium) Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: halve dag ⚠ Verificatie nodig

Wat is er aan de hand?

Op alle zeven pagina's staat minstens één ingesloten onderdeel van een andere partij: het keurmerkblok voor webwinkels (op de homepage twee keer) en op Zelf samenstellen ook een groot onderdeel van 1200 pixels hoog. Opgeteld zijn het 9 onderdelen. De scanner kan niet in zulke onderdelen kijken, dus wat daarin gebeurt is niet getoetst.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Wat er in deze onderdelen misgaat, is niet vast te stellen; het kan elke bezoeker raken die het onderdeel gebruikt.

Impact op je business

Het samenstelonderdeel kan voor een koper een stap in het kiezen zijn, en die stap is in deze scan niet beoordeeld.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

2 elementwaarnemingen · meetregel frame-tested

[".et_pb_code_inner > iframe"]

["#block-2 > iframe"]

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

1 elementwaarnemingen · meetregel frame-tested

["iframe"]

https://voorbeeldwebshop.nl/winkelmand/

1 elementwaarnemingen · meetregel frame-tested

["iframe"]

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel frame-tested

["iframe"]

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel frame-tested

["iframe"]

https://voorbeeldwebshop.nl/zelf-samenstellen/

2 elementwaarnemingen · meetregel frame-tested

[".et_pb_code_inner > iframe"]

[".litespeed-loading"]

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel frame-tested

["iframe"]

Oplossing en hertest voor B-02

Juridische relevantie

Geen WCAG-verplichting op zich, wel sterk aangeraden omdat de inhoud van deze onderdelen bij de pagina als geheel kan meetellen.

Voor je bouwer: wat te doen

Vraag de leverancier van het keurmerkblok en de bouwer van het samenstelonderdeel om bevestiging dat hun onderdeel toegankelijk is. Test beide apart met toetsenbord en schermlezer.

Hertest en verwacht resultaat

1. Tab op elke pagina door het ingesloten onderdeel en let op focus en bruikbaarheid. 2. Test het samenstelonderdeel op Zelf samenstellen met een schermlezer van begin tot eind.

Waarom verificatie nodig is

De scanner kan niet in ingesloten onderdelen van andere websites kijken. Een uitspraak over de toegankelijkheid daarvan vraagt een aparte handmatige toets.

B-10 · Contrast kon op 92 plekken niet worden gemeten

Handmatig beoordelen

WCAG · 1.4.3 Pagina: Homepage, Categoriepagina Geschatte werktijd: halve dag ⚠ Verificatie nodig

Wat is er aan de hand?

Op de homepage (18 elementen), de categoriepagina [categorie B] (62) en de categoriepagina [categorie A] (12) kon het contrast niet automatisch worden vastgesteld. Voorbeelden zijn de twee grote koppen bovenaan de homepage, de productnaam [productnaam A], het kruimelpad en de sorteerlijst. Dit is een controlepunt en geen vastgestelde fout.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij een te laag contrast raakt het slechtziende bezoekers en mensen die op een telefoon in fel licht lezen.

Impact op je business

Zouden koppen en productnamen een te laag contrast hebben, dan kan dat het kiezen uit het assortiment bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

18 elementwaarnemingen · meetregel color-contrast

[".et_pb_text_16 > .et_pb_text_inner > h1"]

[".et_pb_text_17 > .et_pb_text_inner > h1"]

[".post-[id] > .woocommerce-LoopProduct-link.woocommerce-loop-product__link > .woocommerce-loop-product__title"]

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

62 elementwaarnemingen · meetregel color-contrast

[".woocommerce-breadcrumb"]

["a[href$=\"voorbeeldwebshop.nl\"]"]

[".woocommerce-breadcrumb > a:nth-child(2)"]

https://voorbeeldwebshop.nl/product-category/categorie/

12 elementwaarnemingen · meetregel color-contrast

[".woocommerce-breadcrumb"]

["a[href$=\"voorbeeldwebshop.nl\"]"]

["select"]

Oplossing en hertest voor B-10

Juridische relevantie

Pas als handmatig een contrast onder 4,5 tegen 1 is vastgesteld, is dit een overtreding van criterium 1.4.3 (AA); nu is het een controlepunt.

Voor je bouwer: wat te doen

Meet deze elementen handmatig met een contrastmeter of de kleurkiezer in de ontwikkelaarstools. Ligt het contrast onder 4.5:1 (3:1 bij grote tekst), pas dan de tekstkleur of achtergrond aan.

Hertest en verwacht resultaat

1. Meet per genoemd element het contrast tegen de werkelijke achtergrond. Is het 4.5:1 of hoger (3:1 bij grote tekst), dan is er niets te herstellen. 2. Is het lager, pas dan de kleur aan en meet opnieuw.

Waarom verificatie nodig is

De scanner kon niet vaststellen welke achtergrondkleur achter de tekst zit, bijvoorbeeld bij tekst boven een afbeelding. Daarom is geen uitspraak gedaan over het contrast; een handmatige controle moet dat vaststellen.

B-11 · Twee keurmerkblokken mogelijk met dezelfde titel

Handmatig beoordelen

WCAG · 4.1.2 Pagina: Homepage Geschatte werktijd: 15 min ⚠ Verificatie nodig

Wat is er aan de hand?

Op de homepage staan 2 ingesloten keurmerkblokken die beide beginnen met de titel Webshop Keurmerk lid. In de meting is de titel afgekapt. De scanner kon niet vaststellen of dit een probleem is.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij een echt probleem raakt het schermlezergebruikers, die twee gelijk genoemde blokken horen.

Impact op je business

Een dubbel voorgelezen keurmerkblok kan voor schermlezergebruikers verwarrend zijn, maar raakt het bestellen waarschijnlijk niet direct.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

2 elementwaarnemingen · meetregel frame-title-unique

[".et_pb_code_inner > iframe"]

["#block-2 > iframe"]

Oplossing en hertest voor B-11

Juridische relevantie

Pas als handmatig een probleem is vastgesteld, raakt dit criterium 4.1.2 (niveau A); nu is het een controlepunt.

Voor je bouwer: wat te doen

Controleer of de homepage het keurmerkblok twee keer nodig heeft. Laat anders één blok weg, of geef elk blok een eigen title die het verschil noemt.

Hertest en verwacht resultaat

1. Open de homepage met een schermlezer en tab langs beide keurmerkblokken. Horen ze hetzelfde, dan is een eigen titel gewenst. 2. Pas de titel aan en controleer dat beide blokken apart te herkennen zijn.

Waarom verificatie nodig is

De scanner kon niet vaststellen of de twee blokken dezelfde inhoud tonen, en of dezelfde titel daarom een probleem is. Dat vraagt een handmatige controle van beide blokken.

B-12 · Afmetingen van categorielinks niet vast te stellen

Handmatig beoordelen

WCAG · 2.5.8 Pagina: Homepage Geschatte werktijd: 15 min ⚠ Verificatie nodig

Wat is er aan de hand?

Op de homepage kon de scanner bij 4 links niet vaststellen of ze groot genoeg zijn om aan te raken (minstens 24 bij 24 pixels). Voorbeelden zijn de afbeeldingslinks naar [categorie A], [categorie C] en Accessoires. Dit is een controlepunt.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij te kleine links raakt het mensen met een motorische beperking en gebruikers van een telefoon.

Impact op je business

Categorielinks die moeilijk te raken zijn, kunnen het doorklikken naar het assortiment bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

4 elementwaarnemingen · meetregel target-size

[".et_pb_image_10 > a"]

[".et_pb_image_11 > a"]

[".et_pb_image_12 > a"]

Oplossing en hertest voor B-12

Juridische relevantie

Criterium 2.5.8 komt uit WCAG 2.2 (niveau AA), de vooruitlopende meetlat van deze scan; nu is dit nog een controlepunt.

Voor je bouwer: wat te doen

Meet de afmetingen van deze links in de ontwikkelaarstools. Zijn ze kleiner dan 24 bij 24 pixels en staat er minder ruimte omheen, vergroot ze dan met min-width en min-height.

Hertest en verwacht resultaat

1. Meet de vier links op de homepage met de ontwikkelaarstools. Zijn ze minstens 24 bij 24 pixels, dan is er niets te herstellen. 2. Zijn ze kleiner, vergroot ze en meet opnieuw.

Waarom verificatie nodig is

De scanner kon de afmetingen van deze afbeeldingslinks niet betrouwbaar vaststellen. Een handmatige meting moet uitwijzen of er echt een probleem is.

B-13 · Huidig paginanummer heeft mogelijk verboden label

Handmatig beoordelen

WCAG · 4.1.2 Pagina: Categoriepagina Geschatte werktijd: 15 min ⚠ Verificatie nodig

Wat is er aan de hand?

Op de twee categoriepagina's staat bij het huidige paginanummer een extra label voor hulpsoftware (Pagina 1) op een element zonder rol. Zo'n label is op zo'n element niet toegestaan. De scanner kon niet vaststellen of dit in de praktijk misgaat.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij een echt probleem raakt het schermlezergebruikers, die niet horen op welke pagina van de lijst ze zijn.

Impact op je business

Een niet voorgelezen paginanummer kan het bladeren door het assortiment voor schermlezergebruikers bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel aria-prohibited-attr

[".current"]

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel aria-prohibited-attr

[".current"]

Oplossing en hertest voor B-13

Juridische relevantie

Pas als handmatig een probleem is vastgesteld, raakt dit criterium 4.1.2 (niveau A); nu is het een controlepunt.

Voor je bouwer: wat te doen

Verwijder aria-label van de span en zet de tekst Pagina 1 als visually-hidden tekst in het element. Laat aria-current="page" staan.

Hertest en verwacht resultaat

1. Open een categoriepagina met een schermlezer en ga naar het huidige paginanummer. Verwacht: Pagina 1, huidige pagina wordt voorgelezen. 2. Wordt alleen 1 voorgelezen, pas de code aan en test opnieuw.

Waarom verificatie nodig is

De scanner kon niet vaststellen hoe hulpsoftware dit element in de praktijk voorleest. Test het met een schermlezer.

B-14 · Verborgen fotovenster mogelijk toch focusbaar

Handmatig beoordelen

WCAG · 4.1.2 Pagina: Categoriepagina Geschatte werktijd: 1 uur ⚠ Verificatie nodig

Wat is er aan de hand?

Op de categoriepagina [categorie A] staat een venster voor afbeeldingen op volledig scherm dat voor hulpsoftware verborgen is. De scanner kon niet vaststellen of daarin focusbare onderdelen staan. Het venster zelf is niet via Tab bereikbaar, dus mogelijk is er geen probleem.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij een echt probleem raakt het toetsenbord- en schermlezergebruikers die onverwacht in een verborgen venster belanden.

Impact op je business

Een verborgen venster dat toch focus krijgt, kan het bladeren door producten met het toetsenbord verwarrend maken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel aria-hidden-focus

["#photoswipe-fullscreen-dialog"]

Oplossing en hertest voor B-14

Juridische relevantie

Pas als handmatig een probleem is vastgesteld, raakt dit criterium 4.1.2 (niveau A); nu is het een controlepunt.

Voor je bouwer: wat te doen

Controleer of er in het gesloten venster knoppen of links met focus staan. Zo ja, maak het venster onbereikbaar zolang het gesloten is (inert of display:none).

Hertest en verwacht resultaat

1. Tab op de categoriepagina [categorie A] door de hele pagina en let op focus in een onzichtbaar venster. Verwacht: de focus komt nergens in dat venster terecht. 2. Gebeurt dat wel, pas de code aan en test opnieuw.

Waarom verificatie nodig is

De scanner kon niet vaststellen of er binnen het gesloten venster focusbare onderdelen zitten. Dit vraagt een handmatige test met het toetsenbord.

B-15 · Kruimelpadlinks mogelijk alleen aan kleur herkenbaar

Handmatig beoordelen

WCAG · 1.4.1 Pagina: Categoriepagina Geschatte werktijd: 15 min ⚠ Verificatie nodig

Wat is er aan de hand?

In het kruimelpad boven de producten (Home, [categorie A], [categorie B]) kon de scanner niet vaststellen of de links zonder kleur te onderscheiden zijn: 2 elementen op [categorie B] en 1 op [categorie A]. Dit is een controlepunt. De links in lopende tekst op de productpagina zijn wel als fout vastgesteld, zie die aparte bevinding.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij een echt probleem raakt het mensen met kleurenblindheid of een verminderd kleurzicht.

Impact op je business

Een kruimelpad dat niet als links herkenbaar is, kan het terugkeren naar een bovenliggende categorie bemoeilijken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

2 elementwaarnemingen · meetregel link-in-text-block

["a[href$=\"voorbeeldwebshop.nl\"]"]

[".woocommerce-breadcrumb > a:nth-child(2)"]

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel link-in-text-block

["a[href$=\"voorbeeldwebshop.nl\"]"]

Oplossing en hertest voor B-15

Juridische relevantie

Pas als handmatig een probleem is vastgesteld, raakt dit criterium 1.4.1 (niveau A); nu is het een controlepunt.

Voor je bouwer: wat te doen

Controleer of de kruimelpadlinks een onderstreping hebben of 3:1 verschillen met de omliggende tekst. Zo niet, onderstreep ze.

Hertest en verwacht resultaat

1. Bekijk het kruimelpad op beide categoriepagina's met een kleurenblindheidsfilter. Verwacht: de links zijn onderstreept of duidelijk anders dan de tekst. 2. Zo niet, onderstreep ze en controleer opnieuw.

Waarom verificatie nodig is

De scanner kon niet vaststellen welke kleur de omliggende tekst precies heeft. Een handmatige meting moet uitwijzen of het kleurverschil volstaat.

B-19 · Formuliermeldingen worden waarschijnlijk niet voorgelezen

Handmatig beoordelen

WCAG · 4.1.3 Pagina: Productpagina, Contact Geschatte werktijd: 1 uur ⚠ Verificatie nodig

Wat is er aan de hand?

Op de productpagina (3 formulieren) en de pagina Veelgestelde vragen (1 formulier) staat geen gebied dat als statusbericht is gemarkeerd. Of foutmeldingen of bevestigingen worden aangekondigd, is niet getest.

Aanwijzing die nog beoordeeld moet worden; geen vastgestelde overtreding

Impact op gebruikers

Bij een echt probleem raakt het schermlezergebruikers, die een melding of bevestiging missen.

Impact op je business

Een niet aangekondigde bevestiging kan het bestellen of contact opnemen voor schermlezergebruikers onzeker maken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

3 elementwaarnemingen · meetregel no-status-region

De pagina heeft 3 formulier(en) maar geen enkel gebied dat als "statusbericht" is gemarkeerd (role="alert" of aria-live). Of foutmeldingen of bevestigingen worden aangekondigd is niet getest; daarvoor moet het formulier worden gebruikt.

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel no-status-region

De pagina heeft 1 formulier(en) maar geen enkel gebied dat als "statusbericht" is gemarkeerd (role="alert" of aria-live). Of foutmeldingen of bevestigingen worden aangekondigd is niet getest; daarvoor moet het formulier worden gebruikt.

Oplossing en hertest voor B-19

Juridische relevantie

Criterium 4.1.3 (niveau AA) staat in WCAG 2.1 en 2.2; nu is het een controlepunt.

Voor je bouwer: wat te doen

Laat foutmeldingen en bevestigingen verschijnen in een gebied met role="alert" of aria-live="polite". Test daarna met een ingevuld formulier of de melding wordt voorgelezen.

Hertest en verwacht resultaat

1. Gebruik het formulier met een schermlezer en lok een melding uit, bijvoorbeeld door een verplicht veld leeg te laten. Verwacht: de melding wordt voorgelezen. 2. Gebeurt dat niet, plaats de meldingen in een gebied met role alert en test opnieuw.

Waarom verificatie nodig is

We meten of de pagina überhaupt een gebied heeft dat schermlezers voorleest bij wijzigingen. Of foutmeldingen echt worden aangekondigd, vraagt een test met een ingevuld formulier.

Aanbevelingen · 3 aanbevelingen

B-16 · Zoekveld heeft geen zichtbaar label

Aanbeveling

Advies · Aanbeveling (geen WCAG-criterium) Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 15 min

Wat is er aan de hand?

Het zoekveld in de balk bovenaan heeft alleen een voorbeeldtekst (Zoeken …) en een title (Zoeken naar:), geen zichtbaar label. Dat geldt voor alle zeven pagina's. Hulpsoftware krijgt via de title wel een naam.

Aanbeveling; geen vastgestelde WCAG-overtreding

Impact op gebruikers

Het raakt vooral mensen met een cognitieve beperking en gebruikers van spraakbesturing.

Impact op je business

Een zoekveld zonder zichtbaar label kan het zoeken naar een bepaald product voor sommige bezoekers minder duidelijk maken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

1 elementwaarnemingen · meetregel label-title-only

[".et-search-field"]

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

1 elementwaarnemingen · meetregel label-title-only

[".et-search-field"]

https://voorbeeldwebshop.nl/winkelmand/

1 elementwaarnemingen · meetregel label-title-only

["input"]

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel label-title-only

["input"]

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel label-title-only

[".et-search-field"]

https://voorbeeldwebshop.nl/zelf-samenstellen/

1 elementwaarnemingen · meetregel label-title-only

["input"]

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel label-title-only

[".et-search-field"]

Fragment uit de meting
<input type="search" class="et-search-field" placeholder="Zoeken …" value="" name="s" title="Zoeken naar:">

Mogelijke correctie
<label for="[id van het zoekveld]">Zoeken</label>
<input type="search" id="[id van het zoekveld]" class="et-search-field" placeholder="Zoeken …" value="" name="s" title="Zoeken naar:">

Oplossing en hertest voor B-16

Juridische relevantie

Geen WCAG-verplichting zoals gemeten, wel sterk aangeraden.

Voor je bouwer: wat te doen

Voeg een label toe dat aan het veld is gekoppeld. Mag het niet zichtbaar zijn in de vormgeving, gebruik dan een visually-hidden label.

Hertest en verwacht resultaat

1. Open een pagina en klik in het zoekveld. Verwacht: er blijft een label zichtbaar of beschikbaar voor hulpsoftware. 2. Draai de scan opnieuw; verwacht geen melding meer over het zoekveld.

B-20 · Pagina's hebben geen hoofdgedeelte

Aanbeveling

Advies · Aanbeveling (geen WCAG-criterium) Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 1 uur

Wat is er aan de hand?

Op 6 van de 7 pagina's ontbreekt in de code een hoofdgedeelte (main). Alleen de categoriepagina [categorie A] werd daarop niet aangemerkt.

Aanbeveling; geen vastgestelde WCAG-overtreding

Impact op gebruikers

Het raakt gebruikers van een schermlezer, die de inhoud moeilijker vinden zonder dit herkenningspunt.

Impact op je business

Voor schermlezergebruikers kan het vinden van de productinformatie meer moeite kosten.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

1 elementwaarnemingen · meetregel landmark-one-main

["html"]

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

1 elementwaarnemingen · meetregel landmark-one-main

["html"]

https://voorbeeldwebshop.nl/winkelmand/

1 elementwaarnemingen · meetregel landmark-one-main

["html"]

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel landmark-one-main

["html"]

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel landmark-one-main

["html"]

https://voorbeeldwebshop.nl/zelf-samenstellen/

1 elementwaarnemingen · meetregel landmark-one-main

["html"]

Fragment uit de meting
<html lang="nl-NL" prefix="og: https://ogp.me/ns#">

Mogelijke correctie
<main id="content">[paginainhoud]</main>

Oplossing en hertest voor B-20

Juridische relevantie

Geen WCAG-verplichting, wel sterk aangeraden.

Voor je bouwer: wat te doen

Wikkel de hoofdinhoud van elke pagina in een main-element in het thema.

Hertest en verwacht resultaat

1. Open een pagina met een schermlezer en spring naar het hoofdgedeelte. Verwacht: de focus gaat naar de hoofdinhoud. 2. Draai de scan opnieuw; verwacht geen melding meer over ontbrekend hoofdgedeelte.

B-21 · Geen link om direct naar de inhoud te gaan

Aanbeveling

Advies · Aanbeveling (geen WCAG-criterium) Pagina: Homepage, Productpagina, Winkelwagen, Contact, Categoriepagina, Overige pagina Geschatte werktijd: 1 uur

Wat is er aan de hand?

Bij de eerste drie tabstops staat geen link Direct naar inhoud en de pagina's hebben geen hoofdgedeelte om naartoe te springen. Wie met Tab navigeert, loopt eerst door de balk bovenaan en het menu: de scanner telde 54 zichtbare links en knoppen op de homepage en 65 op de categoriepagina [categorie A].

Aanbeveling; geen vastgestelde WCAG-overtreding

Impact op gebruikers

Het raakt toetsenbordgebruikers, die zonder deze link op elke pagina eerst langs de balk en het menu moeten.

Impact op je business

Wie zonder muis werkt, heeft meer toetsaanslagen nodig voordat hij bij de producten is, en dat kan het zoeken en bestellen vermoeiender maken.

Waar is dit gemeten?

De aantallen hieronder zijn waarnemingen per pagina. Een gedeeld onderdeel kan op meerdere pagina’s terugkomen. Er worden maximaal drie voorbeeldlocaties per pagina getoond.

https://voorbeeldwebshop.nl/

1 elementwaarnemingen · meetregel no-skip-link

Er is geen link "direct naar de inhoud" bij de eerste drie tabstops. De pagina heeft geen hoofdgedeelte (main) om naartoe te springen, en 54 zichtbare links en knoppen. Schermlezers kunnen via koppen of gebieden wel naar de inhoud springen, dus dit is een aanbeveling en geen fout.

div#et-info > a

https://voorbeeldwebshop.nl/product/voorbeeldproduct/

1 elementwaarnemingen · meetregel no-skip-link

Er is geen link "direct naar de inhoud" bij de eerste drie tabstops. De pagina heeft geen hoofdgedeelte (main) om naartoe te springen, en 34 zichtbare links en knoppen. Schermlezers kunnen via koppen of gebieden wel naar de inhoud springen, dus dit is een aanbeveling en geen fout.

div#et-info > a

https://voorbeeldwebshop.nl/winkelmand/

1 elementwaarnemingen · meetregel no-skip-link

Er is geen link "direct naar de inhoud" bij de eerste drie tabstops. De pagina heeft geen hoofdgedeelte (main) om naartoe te springen, en 22 zichtbare links en knoppen. Schermlezers kunnen via koppen of gebieden wel naar de inhoud springen, dus dit is een aanbeveling en geen fout.

div#et-info > a

https://voorbeeldwebshop.nl/veel-gestelde-vragen/

1 elementwaarnemingen · meetregel no-skip-link

div#et-info > a

https://voorbeeldwebshop.nl/product-category/categorie/subcategorie/

1 elementwaarnemingen · meetregel no-skip-link

Er is geen link "direct naar de inhoud" bij de eerste drie tabstops. De pagina heeft geen hoofdgedeelte (main) om naartoe te springen, en 55 zichtbare links en knoppen. Schermlezers kunnen via koppen of gebieden wel naar de inhoud springen, dus dit is een aanbeveling en geen fout.

div#et-info > a

https://voorbeeldwebshop.nl/zelf-samenstellen/

1 elementwaarnemingen · meetregel no-skip-link

div#et-info > a

https://voorbeeldwebshop.nl/product-category/categorie/

1 elementwaarnemingen · meetregel no-skip-link

Er is geen link "direct naar de inhoud" bij de eerste drie tabstops. De pagina heeft geen hoofdgedeelte (main) om naartoe te springen, en 65 zichtbare links en knoppen. Schermlezers kunnen via koppen of gebieden wel naar de inhoud springen, dus dit is een aanbeveling en geen fout.

div#et-info > a

Fragment uit de meting
<a href="mailto:info@voorbeeldwebshop.nl"><span id="et-info-email">info@voorbeeldwebshop.nl</span></a>

Mogelijke correctie
<a class="skip-link" href="#main-content">Direct naar inhoud</a>
<a href="mailto:info@voorbeeldwebshop.nl"><span id="et-info-email">info@voorbeeldwebshop.nl</span></a>

Oplossing en hertest voor B-21

Juridische relevantie

Geen WCAG-verplichting zoals gemeten, wel sterk aangeraden.

Voor je bouwer: wat te doen

Plaats als eerste element in de pagina een link Direct naar inhoud die naar het hoofdgedeelte springt, en maak dat hoofdgedeelte aan met een main-element.

Hertest en verwacht resultaat

1. Druk na het laden van de homepage één keer op Tab. Verwacht: een link Direct naar inhoud verschijnt. 2. Druk op Enter. Verwacht: de focus springt naar het hoofdgedeelte.

Quick wins: start hier

Deze bevindingen lijken relatief weinig werk te vragen. De tijden zijn schattingen; laat je bouwer de aanpak en benodigde tijd bevestigen.

1 uur

Geen zichtbare markering bij toetsenbordgebruik

1 uur

Te weinig kleurcontrast in de balk bovenaan

15 min

Facebook-link zonder naam voor hulpsoftware

15 min

Links in lopende tekst alleen aan kleur herkenbaar

1 uur

Focus verdwijnt achter de balk bovenaan

15 min

Paginalink te klein om aan te raken

Geef de paginanummer-links (klasse page-numbers) een minimale breedte en hoogte van 24px, bijvoorbeeld met min-width, min-height en padding, of vergroot de ruimte tussen de nummers.

15 min

Onderdeel op samenstelpagina heeft geen naam

15 min

Inzoomen op telefoons is geblokkeerd

Pas de meta viewport-tag aan in de header van het thema: verwijder maximum-scale=1.0 en user-scalable=0 en laat width=device-width, initial-scale=1.0 staan.

15 min

Aanmeldvelden missen automatisch invullen

Voeg autocomplete toe aan de drie velden: given-name, family-name en email. Overweeg ook type="email" voor het e-mailveld.

Roadmap: wat oppakken in welke volgorde

Een concrete planning gebaseerd op de findings. Kopieer dit naar je projectbord of stuur het door naar je bouwer.

Stap 1

Deze week: eerste prioriteit

Laat in het thema een zichtbare focusstijl instellen voor alle links, knoppen en velden.

Pas de kleur van de blauwe balk of de tekst daarin aan tot een contrast van minstens 4,5 tegen 1.

Geef de Facebook-link een naam voor hulpsoftware.

Haal de zoomblokkade uit de instelling voor weergave op telefoons.

Stap 2

Binnen 1 maand

Onderstreep de links in lopende tekst op de productpagina.

Zorg dat het zoekveld niet achter de vaste balk verdwijnt.

Vergroot de paginalinks op de categoriepagina tot minstens 24 bij 24 pixels.

Geef het ingesloten onderdeel op Zelf samenstellen een titel.

Voeg autocomplete toe aan de drie velden van het aanmeldformulier.

Plaats bovenaan een link Direct naar inhoud en geef de pagina's een hoofdgedeelte.

Stap 3

Binnen 3 maanden: verifiëren en publiceren

Meet het contrast van de 92 niet vastgestelde elementen handmatig na.

Controleer of de verwijzingen van het formulier op de homepage kloppen na het laden.

Controleer of de twee keurmerkblokken een eigen titel nodig hebben.

Meet de afmetingen van de vier categorielinks op de homepage.

Test met een schermlezer of het huidige paginanummer goed wordt voorgelezen.

Controleer het verborgen fotovenster op focusbare onderdelen.

Controleer of de kruimelpadlinks zonder kleur te herkennen zijn.

Test of formuliermeldingen en bevestigingen worden voorgelezen.

Laat de leveranciers van de ingesloten onderdelen hun toegankelijkheid bevestigen.

Wikkel de hoofdinhoud van alle pagina's in een main-element.

Geef het zoekveld een zichtbaar of verborgen label.

Handmatige WCAG-audit uitvoeren, inclusief een bestelling met alleen het toetsenbord en een schermlezer.

Toegankelijkheidsverklaring publiceren nadat de audit is afgerond.

Toegankelijkheidsverklaring: concept

Informatie over toegankelijkheid. Dit concept helpt je uit te leggen wat is onderzocht en welke verbeteringen je plant. Het is een zelfverklaring, geen keurmerk. De status is "niet volledig onderzocht": een geautomatiseerde steekproef stelt geen volledige of gedeeltelijke conformiteit vast. Controleer welke informatieplicht voor je organisatie en dienst geldt, laat ontbrekende controles uitvoeren en vul de placeholders [zo aangeduid] in. Publiceer het concept alleen als de inhoud klopt.

Toegankelijkheidsverklaring van [bedrijfsnaam] (concept, [datum]) [bedrijfsnaam] wil dat iedereen de webshop op voorbeeldwebshop.nl kan gebruiken. Als technische meetlat gebruiken wij WCAG 2.2 niveau AA. Voor webwinkels noemt de ACM nu nog WCAG 2.1 AA en loopt in 2026 de overgang naar 2.2, dus wij kijken bewust vooruit. Status: niet volledig onderzocht. Uit deze steekproef trekken wij geen conclusie over volledige of gedeeltelijke conformiteit. Deze verklaring is gebaseerd op een geautomatiseerde steekproef. De onderzochte pagina’s en afgeronde controles staan in het rapport. Een volledige handmatige audit met schermlezer heeft nog niet plaatsgevonden. Bekende onderdelen die niet voldoen: de markering bij bediening met het toetsenbord is op de onderzochte pagina's niet zichtbaar; de balk bovenaan heeft te weinig kleurcontrast; de Facebook-link heeft geen naam voor hulpsoftware; links in lopende tekst op de productpagina zijn alleen aan kleur te herkennen; het zoekveld verdwijnt bij toetsenbordgebruik achter de vaste balk; één paginalink is te klein; één ingesloten onderdeel heeft geen naam; inzoomen op telefoons is uitgezet; drie aanmeldvelden missen automatisch invullen. Nog handmatig te beoordelen: contrast van koppen en kruimelpad, de inhoud van ingesloten onderdelen, formuliermeldingen, tekstvergroting tot 200% en de begrijpelijkheid van foutmeldingen. Planning: wij herstellen de genoemde punten uiterlijk [datum] en laten daarna een handmatige beoordeling uitvoeren. Na die beoordeling actualiseren wij deze verklaring. Vragen of klachten over toegankelijkheid: [contactemail].

Briefing voor je websitebouwer

Hoe te gebruiken. Selecteer de tekst hieronder, kopieer hem en stuur 'm naar je websitebouwer. Vraag om een offerte of een planning. Pas eventueel [naam bouwer] aan.

Hoi [naam bouwer], Ik heb voorbeeldwebshop.nl laten scannen op toegankelijkheid. De scan keek naar zeven pagina's: de homepage, een productpagina, de winkelmand, Veelgestelde vragen, twee categoriepagina's en Zelf samenstellen. Score 59 van 100, met 9 vastgestelde fouten. Het rapport hangt bij, dit zijn de punten op volgorde van belang. Eerst de markering bij toetsenbordgebruik. Bij 230 van de 235 gemeten onderdelen verandert er niets in beeld als ze de focus krijgen, ook niet bij de knop Toevoegen aan winkelwagen. Ik vermoed één stijlregel in het thema, kun je dat nagaan? Dan het contrast van de blauwe balk bovenaan (wit op #2ea3f2, 2,74 terwijl 4,5 nodig is), de Facebook-link zonder naam en de zoomblokkade in de instelling voor telefoons. Kleiner maar ook vastgesteld: links in lopende tekst op de productpagina hebben geen onderstreping, het zoekveld verdwijnt bij focus achter de vaste balk, een paginalink op de categoriepagina is 21,8 bij 28 pixels, het ingesloten onderdeel op Zelf samenstellen heeft geen title en drie aanmeldvelden missen autocomplete. In het rapport staan ook controlepunten die handmatig bekeken moeten worden, zoals het contrast op de koppen en de verwijzingen van het formulier op de homepage. Kun je de punten bekijken en me een offerte sturen, met een tijdschatting per onderdeel? Dan plannen we de eerste vier voor deze week in.

Begrippenlijst

Uitleg van de termen die in dit rapport worden gebruikt.

WCAG

De internationale richtlijnen voor toegankelijke websites; versie 2.2 niveau AA is hier de technische meetlat.

EAA

De European Accessibility Act, een Europese wet die sinds 28 juni 2025 eisen stelt aan de toegankelijkheid van onder meer webwinkels, voor zover die eronder vallen.

Schermlezer

Software die de inhoud van een pagina voorleest, gebruikt door blinde en slechtziende mensen.

ARIA-label

Een onzichtbare naam in de code die hulpsoftware voorleest bij bijvoorbeeld een knop of link.

Toegankelijkheidsverklaring

Een tekst die je zelf publiceert over hoe toegankelijk je website is en wat nog niet klopt; het is geen certificaat.

ACM

De Autoriteit Consument en Markt, toezichthouder voor webwinkels als de EAA op hen van toepassing is.

Kleurcontrast

Het verschil in helderheid tussen tekst en achtergrond; gewone tekst heeft minstens 4,5 tegen 1 nodig.

Focus

De markering die laat zien welk onderdeel op dat moment met het toetsenbord is geselecteerd.

Hoe ziet dit er voor jouw website uit?

De gratis scan kijkt naar tot vier pagina's en laat je de score plus maximaal drie bevindingen zien. Een volledig rapport onderzoekt tot acht pagina's en bevat alle gerapporteerde bevindingen, codevoorbeelden, een roadmap en een bouwerbriefing. Je krijgt het als pdf per mail, met een btw-factuur.

Start je gratis scan

Het volledige rapport kost €149 excl. btw. Niet tevreden? Binnen 14 dagen geld terug.