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.
Cookiebanner die pas na 30 tabs bereikbaar is
Een cookiebanner onderaan het scherm. “Wij gebruiken cookies.” Twee knoppen: Accepteren en Weigeren.
aria-hidden: wat het doet en wanneer je het wel of niet gebruikt
Je controleert een pagina met de WCAG Radar van Proper Access en zet de optie “Verborgen elementen” aan. Er lichten een paar plekken op. Bij elk daarvan staat: aria-hidden.
Single-page app die de titel niet bijwerkt
Je navigeert van de homepage naar de contactpagina. De content verandert. De URL verandert. Het tabblad? Staat nog steeds “Home - Webshop.”
Hover-content zonder focus-equivalent
Hover over het producticoon. Een popup verschijnt met specificaties, prijs en een “Bekijk product”-link.
Grafiekbalken die in elkaar overlopen
Een staafgrafiek. Twee categorien. Lichtblauw (#90CAF9) en lichtgroen (#A5D6A7). Naast elkaar.
Navigatiemenu verdwijnt bij inzoomen
Home. Over ons. Diensten. Projecten. Contact. Vijf links op een rij. Op een breed scherm prima. Bij 400% zoom? Dan past “Contact” niet meer. Die link valt buiten het scherm. Zonder scrollbar. Zonder hamburgermenu.
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.”