Zo controleer je toegankelijke labels in een formulier.
Controleer bij labels zowel de programmatische naam als de zichtbare context. Nabije tekst alleen maakt nog geen toegankelijke koppeling.
Stem de werkwijze af op je taak.
Inspecteer de programmatische naam van elk element en de verbinding met zijn zichtbare label. Controleer expliciete en omhullende labels en relevante ARIA-verwijzingen, en meld ontbrekende of misleidende namen met elementlocaties. Voeg handmatige beoordeling toe waar automatische inspectie geen betekenis kan vaststellen.
- Wat je aanlevert
- Weergegeven formuliervelden en besturingselementen.
- Wat je krijgt
- Ontbrekende toegankelijke labels en onduidelijke namen.
Bekijk de invoer en het resultaat.
Illustratieve invoer en uitvoer · een leervoorbeeld, geen live uitvoering van WebAct
Voorbeeld invoerveld
Supplied markup: <span>Email</span><input id="email" type="email">. No other naming attributes. Correct the label association.
Uitgewerkt voorbeeld
Finding: the visible caption has no programmatic association with the input. Proposed markup: <label for="email">Email</label> <input id="email" type="email"> Verify the id is unique and the control's accessible name is Email in the complete page.
Laad deze invoer in de prompt en kopieer deze naar WebAct om de taak te proberen. Je resultaat kan afwijken van het voorbeeld.
Keuzes en probleemoplossing.
Vervangt placeholdertekst een blijvend formulierlabel?
Die tekst kan tijdens het typen verdwijnen en is geen betrouwbare vervanging voor een helder gekoppeld label. Controleer zowel visuele als programmatische namen.
Waarom wordt een zichtbaar bijschrift niet als invoerlabel uitgesproken?
Er ontbreekt mogelijk een geldige koppeling, zoals een bijpassend for/id-paar. Controleer de relatie en niet alleen de nabijheid.
Probeer het met je eigen bron.
Vervang het voorbeeld door je eigen materiaal in de taakprompt. Behoud de eisen die je nodig hebt en kopieer de taak naar WebAct.
De taak aanpassen en kopiëren ↑