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.
Tekst in afbeeldingen: waarom het niet mag (WCAG 1.4.5)”
WCAG 1.4.5 Afbeeldingen van tekst: waarom je tekst nooit als plaatje mag gebruiken Je designer heeft een prachtige header gemaakt. Goed verkopende tekst, perfecte kleurverloop, precies het juiste effect. Hij levert een JPG aan. Klaar, toch?
SC 1.1.1 - Wat betekent “Niet-tekstuele content”
Afbeeldingen, iconen en video’s vertellen vaak een groot deel van het verhaal op een pagina. Mensen die blind of slechtziend zijn, gebruiken een schermlezer die alleen tekst kan voorlezen. Daarom zegt WCAG: elke niet-tekstuele content heeft een tekstalternatief dat hetzelfde doel dient.
1.2.3 - Wat betekent “Audiodescriptie of media-alternatief (vooraf opgenomen)”?
Waar gaat het over? Video’s die vooraf zijn opgenomen (dus niet live), moeten een audiobeschrijving of een tekstalternatief hebben voor visuele informatie die niet duidelijk wordt door de audio.
1.2.5 - Wat betekent "Audiodescriptie"?
Waar gaat het over? Video’s die vooraf zijn opgenomen moeten een audiobeschrijving hebben voor de visuele informatie die niet duidelijk wordt door de audio.
1.3.3 - Wat betekent "Zintuiglijke kenmerken"?
Waar gaat het over? Gebruik niet alleen zintuiglijke kenmerken zoals kleur, vorm of locatie om iets uit te leggen, maar vul het aan met andere informatie.
SC 1.2.1 - Wat betekent "Alleen audio of alleen video"
Een podcast op je website. Een instructievideo zonder gesproken tekst. Een audiofragment van een interview. Voor jou is de inhoud duidelijk, maar voor iemand die doof is, bestaat die podcast niet. En voor iemand die blind is, is die stille instructievideo een zwart gat.
SC 1.2.2 - Wat betekent "Ondertiteling (vooraf opgenomen)"
Een productvideo op je webshop. Een uitlegvideo op je helppagina. Een opgenomen webinar in je academy. Als er gesproken tekst in zit, moeten er ondertitels bij. Niet als leuke extra, maar als vereiste – want zonder ondertiteling is die video ontoegankelijk voor iedereen die het geluid niet kan horen.
SC 1.2.4 - Wat betekent "Ondertiteling (live)"
Je organiseert een webinar over je nieuwe product. Honderden mensen kijken mee. Maar voor de dove deelnemers is het alsof je een stomme film vertoont zonder tussenteksten. En voor de deelnemer die in een lawaaierig kantoor zit, is het onmogelijk om te volgen wat er gezegd wordt.
SC 1.3.1 - Wat betekent “Informatie en relaties”
Een webpagina is meer dan losse tekst. Koppen, opsommingen en tabellen geven je verhaal structuur. Ziende bezoekers zien die structuur meteen: een kop is groot en vet, een opsomming heeft bolletjes. Mensen die een schermlezer gebruiken, zien dat niet. Hun software leest de structuur uit de code. Daarom zegt WCAG: de structuur die je visueel toont, moet ook in de code staan.
SC 1.3.4 - Wat betekent "Oriëntatie"
Je opent een website op je telefoon. Je draait je scherm op z’n kant om een tabel beter te bekijken, en ineens springt alles terug naar staand. Of je ligt in bed met je telefoon op z’n kant, en de hele website is onbruikbaar omdat die alleen in portretmodus werkt.
SC 1.3.5 - Wat betekent "Invoerdoel identificeren"
Stel je voor: je vult voor de zoveelste keer een contactformulier in. Naam, e-mail, telefoonnummer, adres. Je browser kent die gegevens allang, maar het formulier werkt niet mee. Je moet alles handmatig typen. Irritant als je haast hebt, maar een echt probleem als je een motorische beperking hebt en elke toetsaanslag moeite kost.
SC 1.4.1 - Wat betekent "Gebruik van kleur"?
Een invoerveld dat rood kleurt bij een fout. Een groene stip voor beschikbaar en een rode voor bezet. Links die alleen een ander kleurtje hebben dan de tekst eromheen. Voor wie kleuren niet of anders ziet, verdwijnt die informatie volledig. Daarom zegt WCAG: kleur mag nooit de enige visuele manier zijn om informatie over te brengen.