WCAG-succescriterium 3.3.1 Foutidentificatie
Niveau A
Uitleg
Laat een gebruiker weten als er fouten zijn bij het invullen van een formulier. Vertel duidelijk en toegankelijk wanneer een formulierveld niet, of niet goed is ingevuld.
Gerelateerde NL Design System-richtlijnen
- Formulieren: Foutmeldingen.
- Formulieren: Descriptions.
Bronnen
Op GOV.UK:
Overige bronnen:
- Toegankelijke foutmeldingen in formulieren, op het blog van het NL Design System.
- The problem with live validation and what to do instead van Adam Silver van Adam Silver.
- Avoid Default Field Validation van Adrian Roselli.
Gebruikersonderzoek
Heb je gebruikersonderzoek gedaan dat betrekking heeft op dit succescriterium en wil je dit delen? Kijk eens bij Gebruikersonderzoeken delen op gebruikersonderzoeken.nl.
Hoe te testen
Dit is een samenvatting van de richtlijnen in Foutmeldingen in een formulier.
Controleer het formulier op foutmeldingen:
- De foutmelding mag niet al zichtbaar als de gebruiker nog aan het typen is.
- De foutmelding wordt niet automatisch door de browser gegenereerd.
- De foutmelding staat zichtbaar, in tekst, boven het formulierveld.
- De foutmelding staat niet over andere informatie heen.
- De tekst van foutmelding heeft dezelfde vergroting en tekstafstand als de rest van de pagina
- De tekst van de foutmelding is duidelijk en niet algemeen. Dus niet "Dit veld is verplicht", maar bijvoorbeeld "Vul uw achternaam in".
- Het is duidelijk voor screenreadergebruikers wanneer een veld niet goed is ingevuld, bijvoorbeeld met
aria-invalid. - De tekst van de foutmelding wordt goed voorgelezen door een screenreader.
- Wanneer de gebruiker een formulier verzend en er dan nog foutmeldingen zijn, staat er boven het formulier een samenvatting van alle foutmeldingen.
- Is er een page-reload na submit van het formulier, dan staat er in het
<title>-element in de<head>dat het formulier fouten bevat.
W3C referenties
- Engelse tekst van het WCAG-succescriterium: 3.3.1 Error Identification.
- Nederlandse vertaling van het WCAG-succescriterium: 3.3.1 Foutidentificatie.
- Engelstalige informatie op How to Meet WCAG: Quick Reference 3.3.1 Error Identification.
- Engelstalige toelichting: Understanding SC 3.3.1 Error Identification.
Belangrijk: De richtlijnen van NL Design System zijn niet verplicht en zijn geen vervanging voor de wettelijk geldende WCAG 2.1 specificatie.
Ons doel is om praktische uitleg en voorbeelden te geven die helpen bij het toegankelijk inzetten van de NL Design System componenten, patronen en richtlijnen. We doen dat op basis van een interpretatie van de nieuwe WCAG 2.2 specificatie.
Weten waar je volgens de wet aan moet voldoen? Ga dan naar wat is verplicht van DigiToegankelijk.
Help richtlijn verbeteren
Deze pagina's over WCAG worden onderhouden door het NL Design System. Heb je aanvullingen of opmerkingen? Deel je mening op GitHub.