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.
SC 2.4.3 - Wat betekent “Focusvolgorde”
Mensen die met het toetsenbord of andere invoerapparaten navigeren, vertrouwen op een logische focusvolgorde om door een website te bewegen. De focusvolgorde bepaalt in welke volgorde interactieve elementen (zoals knoppen, links en formuliervelden) geselecteerd worden wanneer je de Tab-toets gebruikt. Als de volgorde niet logisch is, kunnen gebruikers verdwalen of belangrijke onderdelen missen.
SC 2.4.4 - Wat betekent “Doel van links (in context)”
Links zijn de manier waarop bezoekers zich door je website bewegen. Daarom zegt WCAG: het doel van elke link moet duidelijk zijn uit de linktekst zelf of uit de directe context eromheen.
SC 2.4.5 - Wat betekent "Meerdere manieren"
Het doel van succescriterium 2.4.5 - Meerdere manieren van WCAG is om bezoekers minimaal twee mogelijkheden te bieden om elke pagina van de website te vinden. Waarom twee? Omdat we allemaal verschillend zijn en onze voorkeuren voor het zoeken kunnen variëren. De één gebruikt liever een zoekbalk, terwijl een ander de voorkeur geeft aan het doornemen van de volledige sitemap.
SC 2.4.6 - Wat betekent "Koppen en labels"
Je opent een pagina en de eerste kop is “Overzicht”. Overzicht van wat? Je scrollt naar beneden en ziet koppen als “Details”, “Meer informatie” en “Overig”. Geen enkele kop vertelt je wat er in die sectie staat. Je moet alles lezen om te begrijpen waar de pagina over gaat.
SC 2.4.7 - Wat betekent "Focus zichtbaar"
Stel je voor dat je een formulier invult met je muis, maar de cursor is onzichtbaar. Je klikt ergens en hoopt dat je het juiste veld raakt. Dat klinkt absurd, maar precies dat is wat er gebeurt als een website geen zichtbare focus-indicator heeft voor toetsenbordgebruikers.
SC 2.5.3 - Wat betekent “Label in naam”
Mensen die spraakherkenningssoftware gebruiken om te navigeren, moeten vaak de exacte naam of het label van een knop, link of ander interactief element uitspreken om die te activeren. Als de zichtbare tekst niet overeenkomt met de technische naam van het element, kan dit verwarrend zijn of zelfs onbruikbaar worden.
SC 2.5.7 - Wat betekent "Sleepbewegingen"
Je hebt een mooie interface gebouwd waar gebruikers items kunnen slepen om ze te sorteren. Of een kaart waar je kunt slepen om te navigeren. Of een kanban-bord waar je taken van de ene kolom naar de andere sleept. Intuïtief, toch?
SC 3.1.1 - Wat betekent “Taal van de pagina”
Voorleessoftware spreekt je tekst uit in de taal die de pagina opgeeft. Staat daar de verkeerde taal, dan leest een Engelse stem jouw Nederlandse tekst voor. Daarom zegt WCAG: de hoofdtaal van elke pagina moet in de code zijn vastgelegd.
SC 3.1.2 - Wat betekent "Taal van onderdelen"
Websites zijn vaak in één hoofdtalen geschreven, zoals Nederlands of Engels. Maar soms gebruik je korte stukjes tekst in een andere taal, bijvoorbeeld een Engelse uitspraak in een Nederlandse tekst. Als je niet aangeeft dat de taal verandert, snappen schermlezers het niet goed en lezen ze de tekst verkeerd voor.
SC 3.2.2 - Wat betekent “Bij invoer”
Soms verandert er iets op een website zodra je ergens iets invult of selecteert. Bijvoorbeeld een formulier dat meteen verzendt als je een optie aanklikt, of een pagina die direct verspringt naar een andere stap. Voor veel bezoekers – vooral mensen die langzaam navigeren of een schermlezer gebruiken – kan dat verwarrend of zelfs frustrerend zijn.
SC 3.2.4 - Wat betekent "Consistente identificatie"
Op de homepage staat een knop “Zoeken”. Op de productpagina heet dezelfde functie “Vind”. In de footer staat “Search”. Het zijn allemaal dezelfde actie, maar ze heten steeds anders. Voor de meeste bezoekers is dat licht verwarrend. Voor iemand met een cognitieve beperking kan het het verschil zijn tussen een website die werkt en een die niet te gebruiken is.
SC 3.2.6 - Wat betekent "Consistente hulp"
Je zit vast op een website. Je hebt een vraag over je bestelling, of je snapt een formulier niet. Je zoekt naar de helpknop. Op de vorige pagina stond die rechtsonder. Maar op deze pagina is die nergens te vinden. Of hij staat ineens linksboven. Of hij heet nu “Support” in plaats van “Hulp”.