Terug naar Artikelen

Eenvoudige beschrijving toegankelijkheidsrichtlijnen

De internatioale toegankelijkheidsrichtlijnen, de Web Content Accessibility Guidelines (WCAG) bestaan uit 4 principes: waarneembaar, bedienbaar, begrijpelijk en robuust. Deze principes bevatten een set van criteria waar een website aan moet voldoen. Hieronder zijn deze criteria kort weergegeven.

Voor meer informatie en een exacte beschrijving van de criteria kun je kijken naar de WCAG 2.0 documentatie. De codering achter de beschrijving verwijst naar het betreffende succescriterium in de standaard. Per 5 juni 2018 is overigens een update van deze standaard in werking getreden: WCAG 2.1. In deze nieuwe versie is onder andere meer rekening gehouden met mobiele weergaves van websites.

Principe 1: Waarneembaar

Alternatieve tekst 1.1.1

Blinde en slechtziende bezoekers laten de informatie op een website door hun computer via de screenreader voorlezen. Informatie zoals afbeeldingen, knoppen en invoervelden in formulieren, moeten daarom een goed tekstueel alternatief of naam hebben.

Ondertiteling voor doven en slechthorenden bij video 1.2.1

Als op een site een geluidsfragment of een video zonder geluid staat, moet deze van een alternatief worden voorzien zoals een beschrijvende tekst zodat de informatie voor iemand die doof of blind is begrepen kan worden.

Ondertiteling bij opgenomen video 1.2.2 en live video 1.2.4

Bij een video is ondertiteling (leesbare tekst onderin het beeld) erg belangrijk als je niet kunt horen. Bij video zit vaak de belangrijkste informatie in het geluid en niet in het beeld. Doorgaans is toevoegen van ondertiteling voldoende.

Audiodescriptie bij opgenomen video 1.2.3 & 1.2.5

Bij een video is soms audiodescriptie (beschrijvende extra hoorbare informatie) nodig voor mensen met een visuele beperking In video’s wordt dan bijvoorbeeld iets in beeld gebracht dat belangrijke informatie overbrengt maar niet te horen is: denk aan bijvoorbeeld een tekstbalkje met de naam of functie van een geïnterviewde.

Info en relaties 1.3.1

Het is belangrijk dat informatie, structuur, en relaties die worden overgebracht door presentatie ook op een andere manier beschikbaar zijn. Denk aan het goed aangeven van een koppenstructuur of een sterretje bij een verplicht veld in een formulier.

Betekenisvolle volgorde 1.3.2

Als de volgorde waarin content wordt getoond belangrijk is voor de betekenis (denk aan een lijst van items), dan is het belangrijk dat dit ook wordt aangegeven in de code zodat dit door hulpapparatuur aan de gebruiker kan worden doorgegeven.

Zintuiglijke eigenschappen 1.3.3

Als zintuiglijke informatie wordt gebruikt (denk bijvoorbeeld aan knoppen met een blauwe pijl om naar de vorige of volgende pagina te gaan), let op dat gebruikers die dit niet kunnen zien begrijpen wat de bedoeling is. In dit geval: voeg de tekst “volgende pagina” en “vorige pagina” toe.

Kleurgebruik 1.4.1

Informatie die alleen wordt overgebracht door kleur, kan door mensen die geen kleuren kunnen zien niet worden begrepen. Zorg dus dat je naast kleur ook vorm gebruikt. Voorbeeld: een rood kruisje en groen vinkje.

Automatische spelende video en geluid 1.4.2

Omdat blinde bezoekers met voorleessoftware de website laten voorlezen, kan geluid dat automatisch afspeelt zeer storend zijn. Het geluid zit dan de spraakcomputer in de weg. Dit geldt vooral bij geluid dat langer dan 3 seconden duurt.

Kleurcontrast 1.4.3

Het is met name voor slechtziende en kleurenblinde gebruikers belangrijk om voldoende contrast te bieden tussen de tekstkleur en de achtergrondkleur, zodat de tekst goed kan worden gelezen.

Schaalbare tekst 1.4.4

Voor slechtziende gebruikers is het belangrijk dat tekst op een internetpagina vergroot kan worden (vaak via control-muiswiel) voor een betere leesbaarheid.

Afbeeldingen van tekst 1.4.5

Voor bezoekers met een visuele beperking is het belangrijk dat tekst als echte tekst op een internet pagina wordt geplaatst en niet als een afbeelding. Deze tekst kan eenvoudig worden voorgelezen door hulpsoftware en schaalt automatisch mee met vergroten.

Principe 2: Bedienbaar

Toetsenbordtoegankelijkheid en toetsenbordval 2.1.1 & 2.1.2

Mensen die blind of zeer slechtziend zijn, maar ook mensen met een beperkte handfunctie kunnen (vaak) geen muis gebruiken. Het is dus belangrijk dat een internetpagina ook met het toetsenbord te bedienen is. Een veel voorkomend problemen zijn bijvoorbeeld formulieren waar de verzendknop niet te bedienen is zonder muis.

Het is daarnaast belangrijk dat met het toetsenbord vrij door een pagina kan worden genavigeerd. Een typisch probleem is dat bij (complexe) interfaces de cursor/focus wordt ‘gegijzeld’ en men vast komt te zitten binnen een element op een pagina (denk aan bijvoorbeeld een kaartapplicatie).

Timing aanpasbaar 2.2.1

Mensen met een beperking hebben soms meer tijd nodig om door een pagina te navigeren. Op sommige websites en/of pagina’s (zoals formulieren) zit vanwege de veiligheid een tijdsbegrenzing om deze in te vullen of om ingelogd te blijven. Het is belangrijk dat deze tijd verlengd kan worden.

Pauzeren van automatische beweging 2.2.2

Bewegende, knipperende, scrollende of automatisch actualiserende content zoals sliders kunnen bezoekers afleiden bij het gebruik van de rest van de pagina. Het is belangrijk dat men deze beweging kan stoppen of pauzeren.

Flitsende content 2.3.1

Mensen kunnen een epileptische aanval krijgen van lichtflitsen. Zorg dat webpagina's niets bevatten wat meer dan drie keer flitst in een seconde flitst.

Skiplinks 2.4.1

Gebruikers met screenreaders weten vaak niet wat er verder allemaal op de pagina staat. Ze beginnen elke keer bovenaan de pagina en moeten elke keer het hele menu door. Het is daarom belangrijk om een manier te geven (skiplinks) om dit over te kunnen slaan.

Paginatitels 2.4.2

De paginatitel staat vaak bovenaan in het tabblad van je browser. Het is belangrijk om te zorgen dat de paginatitel uniek is op een pagina én beschrijvend is voor de pagina zelf. Bij spraaksoftware is het doorgaans het eerste wat wordt voorgelezen. Men kan zo bij het lezen van de titel al begrijpen wat ze kunnen verwachten op de pagina eronder.

Focus volgorde 2.4.3

Iemand die via het toetsenbord over een pagina navigeert, springt van element naar element. Het is belangrijk dat dit in een logische volgorde gebeurt.

Tekst van een link (linkdoel) 2.4.4

Met hulpapparatuur kunnen gebruikers een overzicht van links op een pagina opvragen. Het is belangrijk dat elke link ‘zelfverklarend’ en uniek is zodat duidelijk is wat het doel van de link is. Een veelgemaakte fout zijn de diverse ‘lees meer’ links op een pagina.

Meerdere manieren 2.4.5

Het is belangrijk om ervoor te zorgen dat iedere pagina op de website op minstens 2 verschillende manieren te bereiken is. Dit helpt bezoekers met verschillende type beperkingen om content op de website te vinden op een andere manier dan de standaard navigatie.

Koppen en Labels 2.4.6

Goede koppen zijn essentieel om de structuur van een pagina te begrijpen en de inhoud te kunnen doorgronden. Blinde bezoekers kunnen met hun hulpapparatuur bijvoorbeeld een overzicht opvragen van alle koppen op de pagina en op die manier snel een beeld krijgen van de inhoud. Het is dus belangrijk dat kopteksten een goede beschrijving geven van het onderwerp.

Hetzelfde geldt voor labels in formulieren. Duidelijke beschrijvingen in labels zorgen ervoor dat het helder is wat er in het formulier ingevuld moet worden.

Zichtbaarheid van de focus 2.4.7

Als men met het toetsenbord navigeert is het belangrijk dat wordt aangegeven waar men is op de pagina: de focus van de pagina. Vaak wordt deze indicator weergegeven met een kader om het element waar op dat moment de focus op staat.

Principe 3: Begrijpelijk

Taal 3.1.1

Taal is erg belangrijk voor mensen die een screenreader gebruiken. Dit komt omdat bij verschillende talen bepaalde klanken letters of woorden anders door de computer worden uitgesproken. Zo geeft het uitspreken van Nederlandse tekst door een screenreader die op Engels staat veel problemen met de uitspraak.

Taalwisselingen 3.1.2

Het kan natuurlijk voorkomen dat er op een website ook andere talen gebruikt worden. Dit hoeft geen probleem te zijn zolang de verandering van taal in de code is aangegeven.

Gedrag bij verandering van focus 3.2.1

Het is belangrijk dat een gebruiker niet zonder waarschuwing de focus verandert zonder dat de gebruiker iets doet. Denk aan het zonder waarschuwing verplaatsen naar een andere pagina of deel op de pagina.

Bij input 3.2.2

Het is belangrijk dat een gebruiker niet zonder waarschuwing in een andere context terecht komt. Denk aan het zonder waarschuwing naar een ander soort pagina springen na het invullen van bijvoorbeeld een invulformulier.

Consistente navigatie en identificatie 3.2.3 & 3.2.4

De consistentie van de navigatie en de naamgeving zijn belangrijk om gebruikers een beeld te geven van de website en waar ze naartoe gaan binnen de website. Het is erg verwarrend als een pagina meerdere verschillende namen heeft.

Foutmeldingen 3.3.1

Wanneer een gebruiker iets fout invult in een formulier is het belangrijk om goede aanwijzingen te krijgen om je fout te verbeteren.

Labels of instructies 3.3.2

Het is voor de gebruiker belangrijk om instructie te krijgen als men iets moet uitvoeren en invoervelden duidelijk benoemd zijn. Denk aan “vul hier uw achternaam in” of “klik op de verstuur button als u het formulier heeft ingevuld”.

Fout suggestie 3.3.3

Als een gebruiker een fout maakt bij het invullen van een formulier en deze wordt automatisch herkend, zorg dan dat er direct een suggestie verschijnt.

Foutpreventie 3.3.4

Als een gebruiker data invoert met bijvoorbeeld juridische of financiele gevolgen is het belangrijk deze ter controle kunnen worden bekeken voor deze definitief wordt ingestuurd. Dit is met name belangrijk voor mensen met een visuele beperking.

Principe 4: Robuust

Parsen 4.1.1

Webpagina’s worden geprogrammeerd in zogenaamde HTML code. Browsers zijn in het algemeen redelijk vergevingsgezind bij fouten in deze code, maar hulpapparatuur is vaak meer kritisch en kan ‘struikelen’ over pagina’s met fouten in de grammatica. Er zijn gratis online tools waarmee eenvoudig tests kunnen worden uitgevoerd. Ook zoekmachines kunnen eenvoudiger webpagina’s bekijken als deze correct zijn opgemaakt.

Naam, rol, waarde 4.1.2

Op internetpagina’s worden vaak zelf geprogrammeerde elementen gebruikt. Het is dan belangrijk dat deze zich hetzelfde ‘gedragen’ als het origineel: de naam, rol en waarde moet hetzelfde gedrag vertonen. Ze worden als ze goed zijn geprogrammeerd door hulpapparatuur zoals schermlezers als zodanig gezien en behandeld. Denk hierbij aan bijvoorbeeld een uitklapmenu of het gebruik van speciaal vormgegeven selectieboxen.

 

Gerelateerd

Tags:
Categorie:
Kennisbank
  • Delen op Facebook
  • Delen op Twitter
  • Delen op LinkedIn