Niek Derksen naar home van niekderksen.nl
Over digitale toegankelijkheid
Alle succescriteria die relevant zijn voor een ontwikkelaar.
Geef alle niet-tekstuele content een passend tekstalternatief. Denk hierbij aan afbeeldingen (zoals foto’s, illustraties en iconen), voortgangsbalken en andere elementen die niet uit tekst bestaan. Uitzonderingen zijn: Mensen met een visuele beperking kunnen deze niet-tekstuele content niet (of niet goed) zien. Daarom is het belangrijk om bij elke niet-tekstuele content een geschreven alternatief te maken. […]
Als je een website maakt, is het belangrijk dat de indeling en opmaak niet alleen voor bezoekers, maar ook voor computers begrijpelijk zijn. Wat je met vormgeving laat zien, moet ook in de code van je website duidelijk zijn. Denk hierbij bijvoorbeeld aan koppen, lijsten, tabellen en andere elementen die betekenis overbrengen. Schermlezers zijn namelijk […]
Leesvolgorde is volgorde waarin teksten en elementen op een website worden gepresenteerd aan een schermlezer. Als deze volgorde belangrijk is voor het begrijpen van een tekst, zorg dan dat die volgorde ook in de code goed staat. Als de leesvolgorde niet logisch is, dan kan dit verwarrend zijn voor mensen die een schermlezer gebruiken. Zorg […]
Nieuw in WCAG 2.1 Maak je website of app zo dat mensen deze zowel in landschap (liggend) als portret (staand) formaat kunnen bekijken. Niet iedereen kan namelijk hun apparaat draaien. Bijvoorbeeld rolstoelgebruikers met een apparaat in een vaste houder. Zorg daarom dat alle functies beschikbaar blijven, ongeacht de oriëntatie van het apparaat. Er zijn een […]
Nieuw in WCAG 2.1 Leg het doel van invoervelden die persoonlijke informatie van de gebruiker verzamelen vast in de code. Hieronder vallen persoonsgegevens zoals naam, voornaam, achternaam, e-mailadres, telefoonnummer, enz. Voor mensen die gebruik maken van een schermlezer en voor mensen met een fysieke of motorische beperking kan het invullen van een formulier een flinke […]
Als je een website maakt met automatisch afspelend geluid, zorg dan dat bezoekers dit geluid kunnen uitzetten. Geluid dat automatisch en langer dan 3 seconden speelt, moet je kunnen: Waarom is dit belangrijk? Sommige mensen gebruiken een schermlezer die tekst voorlezen. Als een website automatisch muziek of geluid afspeelt, kunnen zij hun schermlezer niet goed […]
Webpagina’s moeten zo worden ontworpen dat gebruikers de tekst tot 200% kunnen vergroten. Belangrijkste eis: alles moet leesbaar en bruikbaar blijven. Dus geen overlappende, afgesneden of verdwenen tekst. Mensen die slechtziend zijn vergroten tekst soms om deze beter te kunnen lezen. Zorg daarom dat je website goed meeschaalt als mensen inzoomen. Uitzonderingen zijn: Hoe pas […]
Nieuw in WCAG 2.1 Webpagina’s moeten zo worden ontworpen dat de content bij een weergavekader van 320px bij 256px weergegeven kan worden zonder dat er iets wegvalt of niet meer werkt en zonder dat scrollen in twee richtingen voorkomt. Mensen die slechtziend zijn vergroten de content soms om deze beter te kunnen lezen. Zorg daarom […]
Nieuw in WCAG 2.1 Mensen die slechtziend zijn en mensen die dyslexie hebben vinden het vaak fijn om zelf de tekstweergave aan te passen. Dit helpt hen om de tekst beter te kunnen lezen. Zorg daarom dat de afstand tussen regels, alinea’s, letters en woorden kan worden aangepast zonder dat er iets wegvalt of niet […]
Nieuw in WCAG 2.1 Als je met je muis over een element beweegt of het de toetsenbordfocus geeft, dan verschijnt er soms wat aanvullende content. Bijvoorbeeld een subnavigatie of een tooltip. Deze tijdelijke content moet makkelijk te sluiten, te bereiken en lang genoeg zichtbaar zijn. Als er aanvullende content verschijnt bij hover of focus, dan moet […]
Niet iedereen kan een muis gebruiken. Mensen met een visuele beperking zien de muisaanwijzer bijvoorbeeld niet (of niet goed). Anderen kunnen door een fysieke of motorische beperking moeite hebben met nauwkeurige bewegingen. Voor hen is het toetsenbord een uitkomst om de computer te gebruiken. Zorg er daarom voor dat alle functionaliteit van de content (ook) […]
Een toetsenbordval ontstaat als iemand met het toetsenbord ergens naartoe navigeert, maar er niet meer van weg kan komen. Dit is soms een probleem bij: Als een onderdeel speciale toetsen nodig heeft om te verlaten, moet je dit duidelijk vermelden. Hoe pas je dit toe? Voor wie is dit belangrijk? Wie is verantwoordelijk? Hoe toets […]
Nieuw in WCAG 2.1 Sneltoetsen die alleen uit letters, cijfers, leestekens of symbolen bestaan kunnen een probleem veroorzaken. Vooral voor mensen die spraakherkenningssoftware gebruiken en mensen die moeite hebben met nauwkeurig typen omdat zij per ongeluk een toets kunnen activeren. Het probleem zit in de ‘karakter-toetsen’. Dit zijn toetsen die meteen een teken typen (zoals […]
Mensen die gebruik maken van een schermlezer of mensen met een fysieke of motorische beperking hebben soms meer tijd nodig voor het uitvoeren van een taak. Als je een tijdslimiet gebruikt, zorg dan dat gebruikers tijd kunnen aanpassen of uitzetten zodat ze in hun eigen tempo kunnen werken. Als je een tijdslimiet gebruikt, zorg dan […]
Bewegende of automatisch bijwerkende content kan afleidend zijn. Gebruikers moeten zelf kunnen bepalen of ze deze content willen zien. Dit is belangrijk voor mensen die moeite hebben met concentratie. Zorg daarom voor een pauze-, stop- of verberg-knop bij alle bewegende content die automatisch start, langer dan 5 seconden duurt en tegelijk met andere content wordt […]
Als je met het toetsenbord door een website navigeert, is het vervelend om steeds door het logo, de hele navigatie en eventueel een zoekveld te moeten gaan. Daarom is het belangrijk dat je deze blokken kunt overslaan. Zorg daarom dat deze herhalende blokken met content kunnen worden overgeslagen. Denk aan een “Ga naar de inhoud”-link […]
Geef webpagina’s een titel hebben die duidelijk maakt waar de pagina over gaat. Dit helpt gebruikers om te begrijpen waar ze zijn zonder de inhoud helemaal te hoeven lezen. Die titel zie je in je browser als de naam van een tabblad. Zo kunnen mensen de pagina terugvinden, ook als er bijvoorbeeld meerdere tabbladen open […]
Focus volgorde is de volgorde waarin elementen op een webpagina actief worden bij toetsenbordnavigatie. Deze volgorde moet kloppen met hoe de content bedoeld is. De volgorde waarin je door elementen tabt moet dus logisch zijn en de betekenis van de content bewaren. Als de focus volgorde niet logisch is, dan kan dit verwarrend zijn voor […]
Gebruikers moeten begrijpen waar een link naartoe gaat voordat ze erop klikken. Dit kan alleen als de linktekst duidelijk is, of als de context rondom de link dit verduidelijkt. Schermlezers kunnen een overzicht van alle links op een webpagina presenteren. In dit overzicht staan alle linkteksten. Als linkteksten zoals ‘klik hier’ of ‘lees meer’ worden […]
Niet iedereen navigeert op dezelfde manier. Sommigen gebruiken liever het menu, anderen vinden zoeken makkelijker. Bied daarom altijd minstens twee routes naar dezelfde informatie op je website. Dit kan bijvoorbeeld via: Dit geldt voor alle pagina’s, behalve voor formulieren of andere processen die je stap voor stap moet doorlopen. Hoe pas je dit toe? Voor […]
Duidelijke koppen en labels zijn essentieel voor een toegankelijke website. Ze helpen gebruikers begrijpen hoe informatie is georganiseerd. Dit succescriterium heeft niks te maken met de technische opmaak van koppen of labels (dat valt onder een ander criterium). Het gaat puur om de inhoud van de koppen en labels. Hoe pas je dit toe? Koppen […]
Alle bedieningselementen moeten een zichtbare indicator van de toetsenbordfocus hebben. Onder bedieningselementen vallen (onder andere) links, knoppen, formulierelementen en andere bedieningselementen. Mensen die gebruik maken van het toetsenbord kunnen zich oriënteren op een webpagina als gemakkelijk te zien is welk element de toetsenbordfocus heeft. Gebruik daarom een duidelijk zichtbare indicator van de toetsenbordfocus. Vaak wordt […]
Nieuw in WCAG 2.2 Als iemand met het toetsenbord door een website navigeert, dan mag het element dat de focus heeft niet worden verborgen achter andere content. Denk hierbij aan zwevende of meebewegende content. Het element moet altijd gedeeltelijk zichtbaar zijn. Onder zwevende of meebewegende content vallen onder andere: Hoe pas je dit toe? Handige […]
Nieuw in WCAG 2.1 Als je een website maakt waar bezoekers speciale bewegingen met de vinger of muis moeten maken om een functie uit te voeren, zorg dan dat ze dezelfde functie ook kunnen gebruiken met een simpele actie zoals een klik, dubbele klik of klik vasthouden. Niet iedereen kan deze complexe gebaren goed uitvoeren. […]
Nieuw in WCAG 2.1 Aanwijzerannulering gaat over het voorkomen van een ongewenste actie. Geef gebruikers de mogelijkheid om een actie te stoppen of ongedaan te maken als ze per ongeluk klikken of tappen. Als gebruikers iets met hun muis of vinger kunnen bedienen, moet er minimaal één van deze opties zijn: Uitzondering: Hoe pas je […]
Nieuw in WCAG 2.1 Als er tekst op een bedieningselement (zoals een link, knop of formulierelement) zichtbaar is op het scherm, dan moet deze tekst ook exact en in zijn geheel voorkomen in de naam die hulptechnologie kan uitlezen. Dit helpt mensen die spraakbediening gebruiken. Zij zeggen letterlijk wat ze op het scherm zien om […]
Nieuw in WCAG 2.1 Zorg dat je website niet alleen werkt als gebruikers hun telefoon of tablet bewegen. Sommige bezoekers kunnen hun apparaat niet goed vasthouden of bewegen. Bijvoorbeeld rolstoelgebruikers met een apparaat in een vaste houder. Zorg daarom altijd een alternatieve manier om dezelfde functies te gebruiken. Ook belangrijk: gebruikers moeten de bewegingsactivering kunnen […]
Nieuw in WCAG 2.2 Als je een website maakt waar mensen een sleepbeweging met de vinger of muis moeten maken, zorg dan dat ze dezelfde functionaliteit ook kunnen gebruiken met een simpele actie zoals een klik, dubbele klik of klik vasthouden. Een sleepbeweging is een beweging die je maakt met een muis. Hierbij doe je […]
Nieuw in WCAG 2.2 Het klikbare gebied van een bedieningselement, zoals knoppen en links, moeten groot genoeg zijn om gemakkelijk aan te klikken. Mensen met een fysieke of motorische beperking kunnen mogelijk niet goed gebruik maken van een muis door bijvoorbeeld onvrijwillige bewegingen of coördinatieproblemen. Hierdoor bestaat de kans dat per ongeluk een verkeerd bedieningselement […]
Je moet aangeven in welke taal je webpagina geschreven is. Als je bijvoorbeeld een Nederlandse website hebt, moet je in de code aangeven dat dit Nederlands is. Dit is handig voor mensen die voorleessoftware gebruiken. Voorleessoftware kan tekst omzetten in spraak. Als je de taal goed vastgelegd in de code, dan kan voorleessoftware de tekst […]
Onverwachte veranderingen zijn verwarrend voor iedereen, maar extra hinderlijk voor mensen met een beperking. Stel je voor: je navigeert met het toetsenbord door een webpagina en opeens opent er een nieuw venster, of je wordt naar een andere pagina gestuurd. Dat is verwarrend! Dit soort onverwachte veranderingen noemen we een contextwijziging. Deze mogen niet voorkomen. […]
Onverwachte veranderingen zijn verwarrend voor iedereen, maar extra hinderlijk voor mensen met een beperking. Bijvoorbeeld: als iemand een optie kiest in een keuzelijst, mag er niet zomaar een nieuw scherm verschijnen zonder waarschuwing. Of als iemand een selectievakje aanvinkt, moet niet plotseling de hele pagina vernieuwen zonder dat je dit hebt aangegeven. Hoe pas je […]
Een consistente indeling maakt websites beter te navigeren en te begrijpen. Dit helpt bezoekers te begrijpen waar ze bepaalde knoppen of menu’s kunnen vinden. Het helpt hen om snel te vinden wat ze zoeken zonder elke keer de hele pagina te moeten scannen. Dit is vooral fijn voor mensen die maar een klein deel van […]
Zorg dat knoppen, links en andere onderdelen die op verschillende webpagina’s voorkomen steeds dezelfde naam hebben. Dus noem een zoekknop altijd “Zoeken” en niet soms “Zoeken” en dan weer “Vind” of “Doorzoek website”. Als functionaliteit steeds anders heet, dan is dat verwarrend. Vooral mensen die een schermlezer gebruiken hebben hier last van. Zij horen wat […]
Nieuw in WCAG 2.2 Consistente hulp betekent dat je hulpfuncties op dezelfde plek zet op alle pagina’s van je website. Als iemand op één pagina ziet dat de telefoonnummer rechtsonder staat, dan verwacht die dat het op andere pagina’s ook daar staat. Onder hulpfuncties vallen: Als je deze opties aanbiedt op meerdere pagina’s, moeten ze […]
Als je een formulier invult en er gaat iets fout, dan moet de gebruiker precies weten wat er mis is gegaan. Je moet daarom fouten duidelijk aanduiden met tekst. Gebruik bijvoorbeeld niet “Dit veld is verplicht” als foutmelding, maar wees zo specifiek mogelijk: Je kunt foutmeldingen op verschillende manieren tonen: Het doel is dat gebruikers weten dat […]
Bij elk invoerveld moet je duidelijk maken wat de gebruiker moet invullen. Dit doe je door een duidelijk en zichtbare label of instructie toe te voegen. Deze moeten zichtbaar zijn voor álle gebruikers. Denk aan een formulier waar je je naam invult: het woord “Naam” boven of naast het veld is het label. Bij complexe […]
Zorg dat je bij foutmeldingen altijd aangeeft hoe de gebruiker het probleem kan oplossen. Geef alleen suggesties als deze bekend zijn. Een paar voorbeelden: Je mag géén suggesties geven als dit de veiligheid in gevaar brengt. Geef bij een verkeerd ingevuld wachtwoord bijvoorbeeld geen hints over wat het juiste wachtwoord dan wel is. Let op: […]
Als je iets belangrijks invult op een website bij bestellingen of financiële transacties, wil je geen fouten maken. Sommige fouten kun je namelijk niet meer terugdraaien. Bij belangrijke acties op je website moet je altijd zorgen dat gebruikers hun invoer kunnen controleren en verbeteren voordat het definitief wordt verzonden. Bied dan minimaal één van deze opties […]
Nieuw in WCAG 2.2 Zorg dat informatie niet meerdere keren moet worden ingevuld in hetzelfde proces. Informatie die een gebruiker al eerder heeft ingevuld tijdens hetzelfde proces moet: Vraag gebruikers dus niet om dezelfde informatie twee keer in te voeren tijdens één sessie. Als iemand bijvoorbeeld al hun naam heeft ingevuld op stap 1, vraag […]
Nieuw in WCAG 2.2 Zorg dat mensen kunnen inloggen zonder dat ze een cognitieve functietest moeten uitvoeren. Dit is vooral belangrijk voor mensen met een cognitieve, taal- of leerbeperking die moeite kunnen hebben met bijvoorbeeld het onthouden van wachtwoorden. Onder een cognitieve functietest vallen taken taak die vereist dat iemand: Een cognitieve functietest mag alleen […]
Let op: Parsen is op 21 september 2023 komen te vervallen in WCAG 2.1 voor alle HTML en XML content en is niet opgenomen in WCAG 2.2. Browsers en hulptechnologieën lezen de code van een website om de content te kunnen presenteren. Code heeft, net als menselijke taal, spelling- en grammaticaregels. Deze regels zijn vastgelegd […]
Bedieningselementen (zoals links, knoppen, formuliervelden) van een website moet de juiste naam, rol, status en waarde hebben zodat hulptechnologie, zoals een schermlezer, ze goed kan begrijpen. Hoe heet het (naam), wat is het (rol), en in welke staat verkeert het (waarde). Voorbeeld: Als je een knop hebt die een menu opent, moet duidelijk zijn dat […]
Nieuw in WCAG 2.2 Een statusbericht is een melding die een verandering in de content aangeeft, zonder dat hiervoor de focus wordt verplaatst of de pagina wordt herladen. Statusberichten geven bijvoorbeeld informatie over het succes of de resultaten van een actie, over fouten of over de voortgang van een proces. Denk aan meldingen zoals “Bezig […]