Je Shopify-webshop toegankelijk maken: een praktische gids

Kort antwoord: Shopify legt een goede basis, maar levert geen toegankelijke webshop "uit de doos". De meeste fouten zitten in je thema en je content — en juist die kun je vaak themabreed in één keer oplossen. Deze gids loopt de belangrijkste punten langs.

Waarom Shopify alleen niet genoeg is

Een Shopify-thema is een sjabloon. Of je site voldoet aan WCAG hangt af van hoe dat thema is gebouwd, welke kleuren je koos, welke apps je installeerde en hoe je je producten invulde. Twee shops op hetzelfde thema kunnen dus heel verschillend scoren. Het goede nieuws: omdat veel terugkomt via het thema, dekt één fix vaak honderden pagina's.

1. Controleer je kleurcontrast

De meest voorkomende fout. Ga naar thema-instellingen → kleuren en zorg dat tekst en achtergrond minstens 4,5:1 contrast hebben (3:1 voor grote tekst). Let vooral op knopteksten, prijslabels en links. Eén keer goed instellen en het geldt winkelbreed.

2. Geef je productfoto's alt-teksten

Ga per product naar media → "alt-tekst bewerken" en beschrijf kort wat erop staat. Begin bij je bestverkopende producten en je homepage-banners. Decoratieve beelden krijgen een lege alt.

3. Controleer je koppenstructuur

Gebruik koppen in logische volgorde (H1 → H2 → H3) en niet alleen voor de opmaak. In de Shopify-editor zie je de koppen terug in je secties en rich-text-blokken; sla geen niveaus over.

4. Let op je apps

Geïnstalleerde apps (pop-ups, reviews, chat, filters) injecteren hun eigen code en zijn een veelvoorkomende bron van problemen: knoppen zonder naam, onjuiste ARIA, of elementen die niet met het toetsenbord te bedienen zijn. Test je site met geïnstalleerde apps actief, niet zonder.

5. Test met het toetsenbord

Probeer je site eens helemaal zonder muis: alleen met de Tab-toets en Enter. Kun je bij alles komen — menu, filters, winkelwagen, afrekenen — en zie je steeds waar de focus staat? Veel mensen navigeren zo, en het legt drempels snel bloot.

6. Controleer je taalinstelling

Zorg dat je thema het juiste taalattribuut zet (lang="nl"). Dit zit meestal in theme.liquid en is vaak al aanwezig, maar controleer het — een schermlezer gebruikt het om de juiste uitspraak te kiezen.

Begin met een scan

De snelste manier om te zien waar jóuw Shopify-shop staat: scan gratis één pagina. Je krijgt per bevinding te zien wat er fout is en hoe je het oplost — en omdat veel via je thema loopt, los je het vaak in één keer voor je hele winkel op.