Plaats de informatie over waar de gebruiker is in de stappen boven het formulier
Plaats tekst en uitleg die hoort bij het formulier buiten het <form> element. Dus zet informatie over de stappen boven en niet binnen het <form> element. Dan is de kans dat screenreadergebruikers deze informatie missen het kleinst. Het waarom staat uitgelegd bij de richtlijn Koppel een description aan het formulierveld.
Het voordeel van een formulier in meer stappen is, dat je makkelijker uitgebreide informatie per stap kunt toevoegen boven het formulier. Dat scheelt de complexiteit van eventueel gebruik van ARIA om tekst te laten voorlezen bij een formulierveld.
Het aangeven van de hoeveelheid stappen boven het formulier is nodig om te voldoen aan het WCAG-succescriterium 1.3.2 Betekenisvolle volgorde (niveau A).
Doen
Info boven het form element.
Uw gegevens
Stap 2 van 3
<h2 class="utrecht-heading-2">Uw gegevens</h2><p>Stap 2 van 3</p><form>[... inhoud formulier …]</form>
Niet doen
Info binnen het formulier.
Uw gegevens
<h2 class="utrecht-heading-2">Uw gegevens</h2><form><h3 class="utrecht-heading-3">Stap 2 van 3</h3>[... inhoud formulier …]</form>
Over deze richtlijnen
Deze richtlijnen worden onderhouden door het NL Design System en zijn op dit moment in beta.
We willen graag van de community horen of ze werkbaar en nuttig zijn. Heb je vragen, aanvullingen of opmerkingen? Open een issue op GitHub en deel je mening.