Webflow-toegankelijkheid
Maak je Webflow-site écht toegankelijk. EAA & WCAG, zonder overlay
Webflow geeft je pixel-controle, maar geen ingebouwde toegankelijkheid: de Designer laat aria-* bij complexe componenten standaard weg. Wij vinden de drempels en leveren de fix in je eigen Custom Attributes, geen widget dat je site vertraagt.
Zo pakt Seviranta je Webflow-site bij de bron aan
Waar de drempels zich verstoppen
Thema’s, uitbreidingen en formulieren introduceren stille barrières. Wij vinden ze allemaal.
De fix in de bron, niet eroverheen
Concrete reparaties in je Webflow-opzet, geen overlay-laag die de fouten alleen verbergt.
Geen widget, geen vertraging
We crawlen extern vanaf EU-servers, 0% impact op je laadsnelheid en Core Web Vitals.
Klaar voor de EAA
We toetsen je site tegen WCAG, op het niveau waarop toezichthouders toetsen.
Headless scan op axe-core, dezelfde motor die in Google Lighthouse zit, vanaf onze EU-servers. 0% impact op je laadsnelheid.
De waarheid: Webflow is niet automatisch toegankelijk
De Webflow Designer levert nette HTML, en Webflow's eigen componenten (Tabs, Dropdown, Navbar, Slider) zijn volgens Webflow zelf ARIA- en toetsenbordtoegankelijk. Het gaat mis in wat je zelf bouwt: tabs, modals en knoppen uit div's met interacties krijgen geen rol of status, de focus-stijl moet je overal zelf zetten, het Audit panel controleert maar vier dingen en de Lightbox ondersteunt geen alt-tekst. Precies daar vallen de bevindingen.
Wat er écht op het spel staat
- Een niet-toegankelijke checkout is een directe EAA-overtreding.
- Een accessibility-widget geldt niet als structurele oplossing.
- Toezichthouders testen de gegenereerde HTML, inclusief je apps.
- 'We gebruiken Webflow' is geen juridisch verweer: de verantwoordelijkheid ligt bij de webshop die live staat, niet bij het platform.
Wat het kan kosten als je wacht
tot € 1.000.000
EU-maximum · Spanje/Luxemburg
$ 4.000
VS · Californië (Unruh), per bezoek
Je wordt niet uit het niets beboet, eerst komt een herstelbevel met deadline. Maar wie dán een gedateerd dossier kan tonen, komt het goedkoopst weg.
Zie wat geldt voor jouw afzetmarkt →Het verborgen risico van third-party Webflow-uitbreidingen
Review-widgets, filters, bundlers en zoek-apps injecteren dynamische HTML in je frontend, en elke app-update kan er een nieuwe drempel bij zetten. In een audit telt die code volledig mee, ook al schreef je 'm niet zelf. Daarom bewaakt Seviranta doorlopend het eindresultaat zoals een toezichthouder het ziet: je Webflow-thema plus alle apps en dynamische content.
Wat er op Webflow vaak misgaat
- Custom tabs zonder role en aria-selectedBouw je je eigen tabs in de Designer, dan blijven het gewone div's. Zonder role="tab", aria-selected en aria-controls op de tab-knoppen weet een screenreader niet dat het om tabs gaat of welke actief is. Je voegt ze handmatig toe via de Custom Attributes.
- Dropdowns en modals zonder keyboard-trap-managementWebflow's interacties openen een dropdown of modal vaak zonder de focus te verplaatsen of vast te houden. Toetsenbordgebruikers tabben weg achter de overlay en raken de inhoud kwijt.
- Div-knoppen zonder role en tabindexEen div met een click-interactie ziet eruit als een knop, maar is er geen. Zonder role="button" en tabindex="0" via de Custom Attributes is hij voor toetsenbord- en screenreader-gebruikers onbereikbaar.
- Lightbox-afbeeldingen zonder alt-tekstWebflow's Lightbox ondersteunt geen alt-tekst voor de afbeeldingen erin, en het Audit panel signaleert dat niet. Elke productfoto of portfolio-afbeelding in een lightbox is daardoor onzichtbaar voor screenreaders. Kies een andere galerij-opzet of geef de beschrijving in de tekst eromheen.
Zo ziet een echte fix eruit
Neem een custom tab-component die je in de Designer met div's hebt opgebouwd. Een screenreader hoort dan alleen 'groep' in plaats van een tab-rij. De fix zit volledig in de Custom Attributes, geen herbouw: zet role="tab", aria-selected en aria-controls op de tab-knoppen.
<div class="tab-link">Overzicht</div><div class="tab-link"
role="tab"
aria-selected="true"
aria-controls="panel-overzicht">Overzicht</div>Waar je het in Webflow zelf regelt
Webflow heeft meer ingebouwd dan de meeste no-code-tools, maar de tooling dekt maar een deel van WCAG. Dit zijn de vijf plekken waar je in de Designer zelf het verschil maakt, en wat je daarbuiten moet oplossen.
- 1Audit panel: vier checks, niet meerHet Audit panel (linker toolbar, Option/Alt + U) controleert precies vier dingen: ontbrekende alt-tekst, niet-beschrijvende linkteksten, overgeslagen kopniveaus en dubbele element-ID's. Kleurcontrast, alles binnen Components, Lightbox-media en CMS-gebonden afbeeldingen vallen erbuiten. Groen in het Audit panel is dus geen WCAG-groen.
- 2Alt-tekst: beschrijvend of decoratiefZet de standaard-alt per asset in het Assets panel (tandwiel → Descriptive of Decorative) en overschrijf per instantie via Image settings → Alt text. Decorative geeft een lege alt, zodat screenreaders de afbeelding overslaan. Alt-tekst in een Lightbox wordt niet ondersteund; kies daar een andere galerij-opzet.
- 3Focus zichtbaar makenWebflow's eigen componenten zijn volgens Webflow ARIA- en toetsenbordtoegankelijk, maar de focus-stijl moet je zelf zetten. Style panel → States → 'Focused (keyboard)' en geef een duidelijke outline; voor slider-dots kan dat alleen via custom CSS op .w-slider-dot:focus.
- 4Custom attributes voor alles wat je zelf bouwtBouw je tabs, modals of knoppen met div's en interacties, dan weet een screenreader niet wat het is. Element settings → Custom attributes → '+' en voeg role, aria-label, aria-expanded of tabindex toe. Je kunt attributen ook aan CMS-velden en component-properties koppelen, zodat je het één keer instelt.
- 5Skip-link en bewegingEen 'skip naar inhoud'-link zit niet in Webflow; je bouwt hem zelf als eerste element in de header, verborgen tot focus, met een klein script onder Project settings → Custom code. Animaties: zet interacties op 'no animation' of 'skip to end' bij prefers-reduced-motion en geef achtergrondvideo's een play/pauze-knop.
Webflow zegt het zelf: geteste elementen voldoen 'tot' WCAG 2.1 AA, en de tool maakt het makkelijk om ontoegankelijke content te publiceren. Onze scan toetst de gepubliceerde pagina, precies wat een toezichthouder ziet, ongeacht wat het Audit panel groen kleurt.
Wat je krijgt
Per fout: wat, waarom en hoe
Voor elke bevinding zie je wat er fout is, wie het raakt, welke WCAG-regel het betreft en een concrete, Webflow-bewuste oplossing, met code-voorbeeld waar dat kan.
Platform-specifieke herkenning
Je vangt de fouten die juist op Webflow ontstaan, niet alleen wat een generieke WCAG-check oppikt.
Een dossier dat standhoudt
Een gedateerd overzicht van je scans en bevindingen dat je kunt tonen bij een audit of inspectie.
Bij een rapporteer-tool betaal je de licentie én je developers om de fouten op te lossen. Bij Seviranta zit de fix erin, geen dubbele rekening.
Bescherm je conversie én je juridische status
Een app die een toegankelijkheids-icoon over je Webflow-site plakt, is een risico voor je business. De feiten op een rij:
Webflow accessibility-widgets
- Laden extra externe scripts die je laadsnelheid (LCP) en daarmee je conversie schaden.
- Maskeren de fout in plaats van 'm op te lossen, de onderliggende code blijft fout.
- Beschermen niet tegen claims. De FTC beboette overlay-aanbieder accessiBe in 2025 met $1 miljoen wegens misleidende compliance-claims.
De Seviranta-aanpak
- 0% impact op je laadsnelheid, we scannen extern vanaf onze EU-servers.
- We repareren de échte broncode van je Webflow-templates.
- We bouwen automatisch je bewaarbare EAA-dossier op, klaar om aan een toezichthouder te tonen.
Vragen en antwoorden
- Webflow is toch al toegankelijk, waarom faalt mijn site dan?
- Webflow's eigen componenten zijn volgens Webflow ARIA- en toetsenbordtoegankelijk, maar alles wat je zelf bouwt met div's en interacties, je kleurkeuzes, je alt-teksten en je kopvolgorde bepaal jij. Daar zitten de meeste bevindingen, en die ziet het Audit panel grotendeels niet.
- Ik verkoop ook aan Frankrijk of Duitsland. Welke norm geldt daar voor mijn Webflow-site?
- Dezelfde: WCAG 2.1 AA via EN 301 549. Frankrijk toetst met de RGAA (versie 4.1.2, 106 criteria die de A- en AA-criteria van WCAG 2.1 dekken), Duitsland met het BFSG. Beide beoordelen de gepubliceerde pagina, niet de bouwtool. Eén keer goed in Webflow is dus goed voor alle markten.
- Kan Seviranta de fix in Webflow voor mij doorvoeren?
- We leveren per bevinding de exacte plek (selector) en de fix: welk custom attribute, welke alt-tekst, welke focus-stijl. Doorvoeren doe jij of je Webflow-bouwer in de Designer. We hebben geen toegang tot je project nodig en plaatsen geen script op je site.
- Is een Webflow accessibility-widget genoeg voor de EAA?
- Nee. Een widget legt een laagje over je site, maar repareert de onderliggende code niet en geldt niet als structurele compliance.
- Valt mijn Webflow-checkout onder de EAA?
- Ja. De checkout en navigatie zijn expliciet onderdeel van de verplichting onder WCAG 2.1 AA.
- Scant Seviranta ook mijn Webflow-apps?
- Ja. We testen de uiteindelijke gegenereerde HTML, thema plus apps, zoals een toezichthouder dat doet.
- Vertraagt dit mijn Webflow-site?
- Nee. We scannen extern vanaf onze EU-servers; er komt geen script op je site. 0% impact op je laadsnelheid en Core Web Vitals.
Wij doen het zelf ook
Wij houden onszelf aan exact dezelfde lat: onze eigen site scoort 0 fouten in axe-core, dezelfde motor die in Google Lighthouse zit en waarmee we ook jouw Webflow-shop scannen. Wat een machine zeker vaststelt lossen we machinaal op, de rest beoordeelt een mens. Zo scherp krijg je het van ons: bekijk een echt voorbeeldrapport.
Wat de EAA van je Webflow-shop vraagt
Sinds juni 2025 moet je webshop voldoen aan WCAG 2.1 AA, een Webflow-shop is geen uitzondering. De gratis scan laat in 60 seconden zien waar je staat, mét de exacte regel die niet voldoet.
Verkoop je in meerdere landen?
WCAG is de wereldwijde standaard. Vrijwel elke markt haakt erop aan:
Fix je Webflow-shop één keer naar WCAG en je dekt de technische lat in al die markten. Wat per markt verschilt, zijn de handhaver en de boetes.
Bekijk wat per afzetmarkt geldt →Beheer je meerdere Webflow-sites voor klanten?
Voorkom dat de webshops die je oplevert een juridisch risico onder de EAA worden voor je opdrachtgevers. Zet Seviranta in als je geautomatiseerde kwaliteitsstempel bij elke oplevering en deploy, één scan, en elke site is aantoonbaar in orde.
Bekijk ons partnerprogramma →Andere platforms
Scan je Webflow-shop gratis
Plak je Webflow-URL in de gratis scan en zie binnen een minuut welke regels niet voldoen, mét de exacte plek in je componenten.