Korte samenvatting
- De meeste formulieren mislukken wanneer velden geen duidelijke labels hebben.
- Zorg ervoor dat elk veld bruikbaar is met het toetsenbord en schermlezers.
- Geef duidelijke foutmeldingen weer en leg uit hoe deze kunnen worden verholpen.
- Toegankelijke formulieren verminderen het aantal afhakers en juridische risico's in de EU.
Formulieren kunnen de ervaring van iemand met uw website maken of breken. Formulieren stellen uw bezoekers of klanten in staat om contact met u te leggen door informatie of feedback te verstrekken, of door een dienst of product aan te schaffen.
Het probleem? Volgens het 2024 Million Report van WebAIM voldoet 48% van de homepages niet aan de Web Content Accessibility Guidelines (WCAG) vanwege ontbrekende labels bij formuliervelden. Dit ene probleem treft bijna de helft van alle websites en is een van de belangrijkste oorzaken van klachten over toegankelijkheid in het kader van de Europese Toegankelijkheidswet (EAA).
Er ontstaan problemen wanneer websiteontwerpers en -ontwikkelaars geen formulieren maken die voor iedereen te gebruiken zijn, ongeacht wie ze zijn. Er doen zich problemen voor wanneer iemand niet weet hoe een veld moet worden ingevuld, een vage foutmelding krijgt of niet met een toetsenbord door het formulier kan navigeren. Belemmeringen bij het gebruik van het toetsenbord komen nog steeds veel voor en kunnen het voor veel gebruikers onmogelijk maken om formulieren in te vullen.
Waarom formulieren aanleiding geven tot EAA-klachten
De handhaving van de EAA is klachtgedreven en taakgericht. Regelgevende instanties controleren niet elk WCAG-criterium, maar reageren wanneer gebruikers essentiële taken niet kunnen uitvoeren, zoals:
- Een aankoop doen
- Een afspraak maken
- Een contactformulier indienen
- Toegang krijgen tot accountgegevens
Er vindt al daadwerkelijke handhaving plaats: in november 2025 werd gemeld dat de Franse belangenorganisaties voor mensen met een beperking, ApiDV en Droit Pluriel, de eerste EAA-rechtszaken hebben aangespannen tegen vier grote retailers (Auchan, Carrefour, E.Leclerc en Picard), waarbij specifiek werd verwezen naar ontoegankelijke afrekenformulieren en -processen. In Nederland kan de ACM (Autoriteit Consumenten & Markten) boetes opleggen voor schendingen van de toegankelijkheidsvoorschriften.
Het is onze taak om mensen door de formulieren op onze website te begeleiden, zodat deze correct worden ingevuld en men zijn einddoel kan bereiken. Hoe directer en doelgerichter we te werk gaan bij het opstellen van formulieren, hoe kleiner de kans dat iemand het formulier afbreekt of zijn doel niet kan bereiken.
Controleer de lengte en complexiteit van uw formulier
Voordat u iets anders doet, moet u bepalen wat het doel is van dit formulier op uw website. Schrijf het einddoel op en bekijk vervolgens kritisch het formulier, de lengte ervan en of het zijn werk doet om dat doel te bereiken.
Onderzoek toont aan dat het aantal afgebroken formulieren aanzienlijk toeneemt naarmate het formulier langer is. Volgens meerdere UX-onderzoeken kan het percentage afgebroken formulieren bij langere formulieren oplopen tot meer dan 70%. Deze stap wordt vaak over het hoofd gezien omdat we vaak denken dat alles belangrijk is. Velen van ons willen alles over de persoon weten om er zeker van te zijn dat we niets missen. Deze aanpak werkt vaak averechts en leidt tot het afbreken van het formulier, omdat het te veel werk wordt.
Concentreer u op informatie die u niet kunt verkrijgen zonder deze via dit formulier te vragen. Overweeg of deze informatie noodzakelijk is voor het einddoel. (wcag: 3.3.7 label: Redundant Entry) pakt dit specifiek aan door te vereisen dat eerder ingevoerde informatie niet opnieuw hoeft te worden ingevoerd in hetzelfde proces.
Ik raad u aan uw formuliervelden tot het strikt noodzakelijke te beperken. Begin met uw belangrijkste vraag. Het aantal afgebroken formulieren neemt doorgaans toe na de eerste paar vragen, vooral als deze complex zijn. Als u bijvoorbeeld echt wilt weten wat iemand van uw website of dienst vindt, plaats die vraag dan als eerste. Als de naam als eerste staat en dat het enige veld is dat iemand invult, helpt u dat niet verder, aangezien u op zoek bent naar feedback over de website of dienst.
Maak een overzicht van het formulier door het doel of eindresultaat bovenaan te plaatsen. Voeg daaronder de velden toe die u helpen dat doel of eindresultaat te bereiken. Bij complexere of dynamische formulieren kunt u vertakkingen aanbrengen, zodat vragen alleen worden toegevoegd voor specifieke antwoorden en niet voor alle gebruikers.
Natuurlijk is het aantal vragen afhankelijk van de situatie, maar over het algemeen moet het uw doel zijn om de cognitieve belasting voor de persoon die het formulier invult te verminderen. Dit is met name belangrijk voor gebruikers met cognitieve beperkingen, ADHD of dyslexie. Volgens onderzoek naar toegankelijkheid heeft ongeveer 15-20% van de bevolking hiermee te maken.
Bouw toegankelijkheid vanaf het begin in
Onze formulieren moeten voor iedereen werken, niet alleen voor iemand die een muis kan gebruiken. Voordat een ontwikkelaar begint met het maken van het formulier, moet er rekening worden gehouden met toegankelijkheid en bruikbaarheid. Dit betekent dat formulieren de juiste labels, helptekst en duidelijke aanwijzingen moeten bevatten.
Dit sluit aan bij meerdere WCAG 2.1 Level AA-succescriteria die door de EAA worden vereist:
- (wcag: 1.3.1 label: Info en relaties): Formulierlabels moeten programmatisch worden gekoppeld aan hun invoervelden
- (wcag: 3.3.2 label: Labels of instructies): Er moeten labels of instructies worden verstrekt wanneer de inhoud gebruikersinvoer vereist
- (wcag: 4.1.2 label: Naam, rol, waarde): Formulierbesturingselementen moeten toegankelijke namen hebben die ondersteunende technologieën kunnen begrijpen
Een correcte implementatie ziet er als volgt uit:
<!-- CORRECT -->
<label for="email">Email address (required)</label>
<input type="email" id="email" required aria-required="true">
<!-- INCORRECT - Placeholder is not a label -->
<input type="email" placeholder="Email address">
Maak het voor iedereen gemakkelijker om te begrijpen wat u zoekt en zorg ervoor dat het op dezelfde manier werkt, of iemand nu een schermlezer, toetsenbordnavigatie of muis gebruikt.
Volgens de richtlijnen van het W3C moeten labels:
- Zichtbaar zijn voor alle gebruikers (niet verborgen)
- Dicht bij de bijbehorende invoervelden geplaatst (meestal erboven of ernaast)
- Permanent (in tegenstelling tot plaatshouders die verdwijnen tijdens het typen)
Vertrouw niet alleen op kleur
Labels en foutmeldingen mogen niet alleen op kleur vertrouwen om betekenis over te brengen. Dit heeft betrekking op (wcag: 1.4.1 label: Gebruik van kleur). Kleur mag worden gebruikt zolang er andere manieren zijn waarop iemand dezelfde boodschap kan ontvangen.
Een foutmelding moet bijvoorbeeld het volgende bevatten:
- Tekst die de fout beschrijft
- Een pictogram (⚠)
- Kleur (rood)
- ARIA-attributen (
aria-invalid="true")
Gebruik nooit alleen een rode rand zonder begeleidende tekst – gebruikers die kleurenblind zijn of een schermlezer gebruiken, zullen niet weten dat er een fout is opgetreden.
Gebruik foutmeldingen om te helpen
Niets is zo frustrerend als het invullen van een formulier dat vervolgens wordt afgewezen omdat een veld niet correct is ingevuld. (wcag: 3.3.1 label: Foutidentificatie) vereist dat wanneer een invoerfout automatisch wordt gedetecteerd, het foutieve item moet worden geïdentificeerd en de fout in tekst aan de gebruiker moet worden beschreven.
Bovendien stelt (wcag: 3.3.3 label: Suggestie voor correctie) dat als er een fout wordt gedetecteerd, er suggesties voor correctie moeten worden gegeven, tenzij dit de veiligheid of het doel van de inhoud in gevaar zou brengen.
Foutmeldingen moeten:
- Duidelijk en specifiek, bovenaan het formulier
- Geplaatst in de buurt van het veld met de fout
- Programmatisch gekoppeld met behulp van
aria-describedby
In plaats van te schrijven: "Dit veld is niet correct ingevuld", gebruikt u iets als:
Fout bij volledige naam: Voer uw volledige naam in met minimaal 2 tekens. Als uw naam korter is dan 2 tekens of als u problemen ondervindt, neem dan contact op met de ondersteuning via support@yourwebsite.com.
Waarom de herschrijving werkt:
- Geeft aan welk veld de fout bevat (Volledige naam)
- Leg de vereiste uit (minimaal 2 tekens)
- Biedt context en een alternatieve oplossing
- Geeft de persoon de mogelijkheid om het zelf op te lossen of hulp te zoeken
Voor financiële of juridische transacties moet u een stap verder gaan. (WCAG: 3.3.4 label: Foutpreventie) vereist dat inzendingen ongedaan kunnen worden gemaakt, vóór verzending worden gecontroleerd of vóór de definitieve afronding worden bevestigd.
Leg uit waarom u informatie verzamelt
Het opbouwen van vertrouwen begint met transparantie over wat u van plan bent te doen met de gegevens zodra u deze hebt verkregen. Dit geeft de persoon de keuze of hij of zij het formulier wil blijven invullen of bezwaar wil maken tegen het invullen van bepaalde velden.
Dit raakt zowel aan toegankelijkheid als aan naleving van privacywetgeving. De Algemene Verordening Gegevensbescherming (AVG) van de EU vereist transparantie over gegevensverzameling, en de EAA vereist dat privacycontroles en toestemmingsformulieren zelf toegankelijk zijn. Een ontoegankelijke cookiebanner of een ontoegankelijk toestemmingsformulier kan in strijd zijn met beide regelgevingen.
Veel landen hebben ook wetten en wettelijke vereisten die individuen het recht geven om te zien welke gegevens worden verzameld en deze tijdig te laten verwijderen. Raadpleeg een juridisch adviseur in uw regio om na te gaan of er vereisten zijn die op uw organisatie van toepassing zijn.
Voer gebruikerstests uit binnen uw organisatie
Het uitvoeren van gebruikerstests voordat u het formulier aan een breder publiek presenteert, is zelfs voor een klein team nuttig. Door te testen met mensen binnen uw organisatie kunt u uitstekend peilen hoe goed uw formulier is gestructureerd.
Deze test is zeer informatief, want als mensen die het meest bekend zijn met uw werkgebied moeite hebben om het formulier in te vullen, is het tijd om terug te gaan naar de tekentafel. Zodra u vaststelt dat het formulier bruikbaar is en de verwachte resultaten oplevert, kunt u doorgaan met testen buiten de organisatie.
Het testen van formulieren moet worden uitgevoerd met een diverse groep mensen, waaronder gebruikers met een beperking. Volgens de Forms Tutorial van het W3C moet het testen het volgende omvatten:
- Navigatie met alleen het toetsenbord
- Testen met schermlezers (NVDA, JAWS, VoiceOver)
- Gebruikers met cognitieve beperkingen
- Testen op mobiele apparaten
- Verschillende browsercombinaties
Dit is van cruciaal belang om knelpunten in uw formulier te identificeren en te bepalen wat u moet doen om deze op te lossen. De EU telt ongeveer 87 miljoen mensen met een beperking; dat is een aanzienlijke markt die u mogelijk uitsluit met ontoegankelijke formulieren.
Maak het ontwerp of de lay-out niet te ingewikkeld
Eenvoudig is beter. U hoeft niet per se te willen dat iemand veel tijd besteedt aan het invullen van het formulier, tenzij dat het doel is.
Lay-outs moeten worden geoptimaliseerd voor:
- Meerdere apparaten en schermformaten
- Voldoende kleurcontrast (4,5:1 voor normale tekst, 3:1 voor grote tekst volgens WCAG 1.4.3)
- Een lay-out met één kolom voor eenvoudigere navigatie
- Duidelijke visuele hiërarchie
Gebruik een lay-out met één kolom voor uw formulier, omdat de velden dan beter zichtbaar zijn en er gemakkelijker met schermlezers kan worden genavigeerd.
Voor verplichte velden: U kunt deze aangeven met de tekst "(verplicht)" of met een asterisk, maar niet alleen met kleur. Als u een asterisk gebruikt, moet u:
- Bovenaan het formulier uitleggen wat het sterretje betekent
- Gebruik
aria-required="true"op het invoerelement - Tekst zoals "(verplicht)" opnemen voor gebruikers van schermlezers
Bij het ontwerpen van formulieren moeten deze snel laden en moet de informatie op alle platforms duidelijk zichtbaar zijn. Hoewel leuke ontwerpen uw formulier misschien laten opvallen, is dat niet altijd op een positieve manier. Mensen verwachten dat formulieren en websites in het algemeen zich op een bepaalde manier gedragen. Offer bruikbaarheid en toegankelijkheid niet op voor visueel ontwerp.
Zorg voor toetsenbordtoegankelijkheid
Dit heeft betrekking op (wcag: 2.1.1 label: Toetsenbord) en (wcag: 2.4.7 label: Focus zichtbaar). Alle functionaliteit van het formulier moet via een toetsenbordinterface bedienbaar zijn en er moet een zichtbare focusindicator aanwezig zijn.
Test dit door uw muis los te koppelen en alleen de Tab-, Shift+Tab-, Enter- en pijltjestoetsen te gebruiken:
- Kunt u elk formulierveld bereiken?
- Is er een zichtbare omtrek die aangeeft welk veld de focus heeft?
- Kunt u opties selecteren in keuzelijsten?
- Kunt u het formulier verzenden?
- Komt u wel eens vast te zitten in een element?
Veelvoorkomende toetsenbordproblemen:
- Aangepaste keuzelijsten die zijn gebouwd met
<div>in plaats van<select> - CSS die focusomlijningen verwijdert (
outline: none;) - Modale dialoogvensters die de toetsenbordfocus blokkeren
- Verzendknoppen die niet via het toetsenbord toegankelijk zijn
Controleer uw formulier regelmatig
Formulieren kunnen na verloop van tijd defect raken, vooral wanneer er nieuwe updates worden geïmplementeerd of andere wijzigingen aan de website worden aangebracht. Regelmatige controles van webformulieren zijn essentieel om ervoor te zorgen dat uw formulier altijd kan worden ingevuld.
Formulieren moeten ook het hele jaar door worden gecontroleerd op naleving van regelgeving en wetgeving. Nu de EAA sinds 28 juni 2025 van kracht is, is voortdurende monitoring wettelijk verplicht. Elke EU-lidstaat heeft handhavingsinstanties ingesteld die:
- Klachten onderzoeken
- Audits uitvoeren
- Correctieve maatregelen opleggen
- Financiële sancties opleggen
Zoek juridisch advies in uw regio om naleving van de toepasselijke vereisten te waarborgen. Wetgeving kan veranderen, en door uw formulier regelmatig te controleren blijft u een stap voor.
Verwijder belemmeringen met beveiliging
Ik ben een groot voorstander van websitebeveiliging, vooral als het om formulieren gaat. Dat gezegd hebbende, zijn er enkele barrières op het gebied van formulierbeveiliging die niet iedereen kan overwinnen. Hieronder vallen CAPTCHA-velden die u overal op het internet tegenkomt wanneer u een formulier probeert in te vullen.
Traditionele CAPTCHA's vormen aanzienlijke toegankelijkheidsbarrières:
- Op afbeeldingen gebaseerde CAPTCHA's sluiten blinde gebruikers uit
- Audio-alternatieven zijn vaak vervormd en moeilijk te verstaan
- Ze zijn tijdrovend en foutgevoelig voor iedereen
(WCAG: 3.3.8 label: Toegankelijke authenticatie) pakt dit aan door te eisen dat cognitieve functietests (zoals het onthouden van wachtwoorden of het oplossen van puzzels) niet vereist zijn voor authenticatie, tenzij er alternatieven beschikbaar zijn.
Betere alternatieven zijn onder meer:
- Honeypot-velden (onzichtbare velden die door bots worden ingevuld)
- Op tijd gebaseerde validatie
- reCAPTCHA v3 (onzichtbaar, op scores gebaseerd)
- Tweefactorauthenticatie via sms of e-mail
- Biometrische authenticatie waar van toepassing
Zorg ervoor dat uw formulier en de gegevens die u verzamelt veilig zijn. Onderzoek methoden die voor uw team en organisatie werken en tegelijkertijd zowel de veiligheid als de toegankelijkheid waarborgen. Afhankelijk van de gegevens die worden verzameld, hebt u mogelijk meerdere veilige authenticatie- en validatiemethoden nodig voor gegevensbeveiliging en -bescherming.
Conclusie
Formulieren hebben vaak problemen op het gebied van toegankelijkheid en bruikbaarheid. Dit leidt er vaak toe dat mensen het formulier niet kunnen invullen, gefrustreerd raken bij het invullen van het formulier, of beide. Aangezien 48% van de websites alleen al op het gebied van formulierlabels tekortschiet en de EAA nu actief wordt gehandhaafd via rechtszaken en klachten bij toezichthouders, zijn toegankelijke formulieren niet langer optioneel – ze zijn wettelijk verplicht voor bedrijven die actief zijn op de EU-markten.
Voor een inclusiever internet moeten we er allemaal naar streven dat onze formulieren door zoveel mogelijk mensen kunnen worden ingevuld. Dit gaat niet alleen om naleving, maar ook om het niet uitsluiten van 87 miljoen potentiële klanten in de EU die zaken met u zouden kunnen doen.