Deze vertaling is nog niet redactioneel gecontroleerd. De Duitse versie is leidend. Deutsche Fassung →
Barrierefreiheit
Wat betekenen naam, rol en waarde op een website?
Naam, rol en waarde zijn de drie gegevens die elk bedienelement van een website aan hulpprogramma's moet melden. De naam zegt waarvoor het element dient ('Zoeken'), de rol zegt wat het is (knop, koppeling, aanvinkvak), de waarde zegt in welke toestand het zich bevindt (aangevinkt of leeg). Ontbreekt één van de gegevens, hoort een blinde bezoeker alleen 'element' — en kan daar niets mee beginnen. Dit regelt het WCAG-criterium 4.1.2.
Drie gegevens maken een element bedienbaar
Een voorzegprogramma ziet geen pixels — het leest uit wat de broncode over elk element zegt. Bij een netjes gebouwde knop zegt het: 'Zoeken, knop'. De bezoeker weet meteen wat er gebeurt als hij op Enter drukt. Bij een aanvinkvak komt de waarde erbij: 'Nieuwsbrief inschrijven, aanvinkvak, niet aangevinkt'. Problemen ontstaan met zelfgebouwde bedieningselementen: Een klikbaar symbool zonder naam wordt als 'afbeelding' aangezegd, een met script samengevoegd opklapmenu zonder rol als betekenisloze tekst. De ziendebezoeker merkt daar niets van — het element ziet eruit zoals altijd. Voor gebruikers van voorzegprogramma's, spraakbesturing en speciale toetsenborden is het onzichtbaar of onbruikbaar. Robuustheid betekent: de techniek eronder draagt alle hulpprogramma's, niet alleen het scherm.
Zo test de controledienst naam, rol en waarde
Dit criterium test onze meethartje grotendeels automatisch met axe-core in een echte browser. Getest wordt onder meer: draagt elke knop en elke koppeling een toegankelijke naam, zijn de gebruikte aanvullende gegevens voor hulpprogramma's geldig en juist gecombineerd, stemmen zelfverzorgde rollen met de regels overeen. Om toevalskarakteristieken uit te sluiten, loopt de test twee keer met 800 milliseconden tussenpozen — alleen bevindingen die beide runs laten zien, tellen. Daarnaast vloeit de beschriftingstelling uit criterium 3.3.2 in: een invoerveld zonder gekoppelde beschrijving heeft ook geen toegankelijke naam en telt daarom ook als schending van 4.1.2. Het rapport noemt elke bevinding met element en bewijs.
Beispiele
Schalter ohne Name, Rolle und Zustand
<div class="toggle on" onclick="umschalten()"></div><button type="button" role="switch" aria-checked="true" onclick="umschalten()">
Benachrichtigungen
</button>Das Vorleseprogramm sagt „Benachrichtigungen, Schalter, eingeschaltet“. Beim Umschalten muss aria-checked mitgeführt werden.
Symbol-Knopf ohne Namen
<button><svg>…</svg></button><button aria-label="Suche öffnen"><svg aria-hidden="true">…</svg></button>- Vraag uw bureau bedieningselementen met de ingebouwde onderdelen te gebruiken — echte knoppen en koppelingen brengen naam, rol en waarde vanzelf mee.
- Geef elke reine symboolknop — loep, menu, winkelwagentje — een onzichtbare, maar technisch ingestelde naam.
- Controleer zelfgebouwde elementen zoals opklapmenu's en schakelaars extra kritisch — rol en status ontbreken daar het vaakst.
- naam-rol-waarde-voor-bedieningselementen