WCAG uitgelegd
Heldere uitleg van WCAG 2.2 succescriteria. Per criterium lees je wat het betekent, waarom het belangrijk is en hoe je eraan voldoet.
Links die alleen door kleur te herkennen zijn
Een alinea tekst. Ergens in die tekst staat een link. Geen onderstreping. Alleen een andere kleur.
Carrousel-bolletjes: actief = blauw, inactief = grijs
Vijf bolletjes onder een carrousel. Het derde is blauw. De rest grijs.
Carrousel-knoppen voor de content
“Vorige. Volgende.” Dat is het eerste wat een schermlezergebruiker hoort bij je carrousel. Vorige en volgende. Maar vorige en volgende van wat?
Foutmeldingen
Je vult een formulier in, klikt op verzenden, en ergens bovenaan verschijnt een rode tekst.
aria-expandd (met twee d's)
Een menuknop. aria-expanded om aan te geven of het menu open is. Maar de developer typte aria-expandd. Met twee d’s.
Afbeeldingsknop met afwijkende alt-tekst
Een knop die een afbeelding is. Op de afbeelding staat “Inschrijven.” De alt-tekst zegt: “Registreer voor de nieuwsbrief.”
overflow: hidden knipt de focusindicator af
Een mooie kaartcomponent. Afgeronde hoeken. overflow: hidden om te voorkomen dat content buiten de hoeken valt.
Link opent in een nieuw venster zonder waarschuwing
Je klikt op een link. Een nieuw tabblad opent. Je drukt op de terugknop. Niets. Want je zit in een nieuw tabblad. Er is geen geschiedenis.
Focus verdwijnt na het sluiten van een dialoogvenster
Je klikt op “Verwijderen.” Een bevestigingspopup verschijnt. “Weet je het zeker?” Je drukt op “Annuleren.”
Sitenaam vóór de paginanaam
Drie tabbladen open: “Gemeente Utrecht - Paspoort aa…” “Gemeente Utrecht - Rijbewijs ve…” “Gemeente Utrecht - Verhuizing d…”
SC 2.5.8 - Wat betekent "Doelgrootte (minimum)"?
Een kruisje van 16 pixels om een melding te sluiten. Pagineringsnummers die tegen elkaar aan staan. Een rijtje piepkleine iconen in de footer. Voor wie een trillende hand heeft, grote vingers, of gewoon in een hobbelende trein zit, zijn zulke doelen bijna niet te raken. Mis je net, dan klik je vaak op het verkeerde doel ernaast. Daarom zegt WCAG: een klikbaar doel is minstens 24 bij 24 pixels, of heeft genoeg lege ruimte om zich heen.