2.4.6 – Koppen en labels (WCAG) | Niveau AA

Gebruik duidelijke koppen en labels

Een goed geschreven pagina is altijd onderverdeeld met duidelijke en beschrijvende koppen. Ze maken het gemakkelijker voor jouw gebruikers om te scannen en het gedeelte te vinden waarin ze geïnteresseerd zijn. Koppen verdelen ook grote delen van tekst zodat de inhoud niet overweldigend is om te lezen

Sommige van jouw gebruikers profiteren verder van pagina’s met semantische koppen en labels. Koppen helpen vooral mensen met visuele beperkingen, die vaak tussen koppen overslaan wanneer ze een schermlezer gebruiken.

Door elementen op een pagina te labelen, kunnen deze gebruikers ook beter begrijpen waar ze zijn. Elementen die met HTML5 zijn geïntroduceerd , zoals ‘kop’, ‘voettekst’ en ‘opzij’, maken dat nog eenvoudiger.

Wat te doen

• Gebruik waar nodig informatieve koppen en subkoppen (een wijziging van onderwerp of doel) om de navigatie door jouw inhoud te vergemakkelijken.
• Label alle elementen (bijvoorbeeld zijbalk widgets, formulieren, zoekvakken, tabellen).

Tips

• Een enkele letter van het alfabet kan een goede kop zijn (bijvoorbeeld in een alfabetische index).
• Als je regelmatig vergelijkbare inhoud produceert, moet je de koppen consistent houden (een website over filmrecensies kan bijvoorbeeld ‘Plot’, ‘Characters’ en ‘Verdict’ op elke afzonderlijke pagina hebben).
• Koppen in HTML variëren van H1 (het belangrijkste) tot H6 (het minst belangrijke). Je kan het beste rubriek 1 (H1) op een webpagina reserveren voor de titel van die pagina.
• Koppen hoeven niet te worden verlaagd van 1 naar 6 op elke pagina. Hoewel je niet alle koppen hoeft te gebruiken, moeten ze toch sequentieel zijn. Vermijd bijvoorbeeld overslaan van H2 naar H4.