Weiger jij weleens mensen op je website? Waarschijnlijk niet bewust. Maar toch is de kans groot dat de virtuele deur van jouw website dicht zit voor een hele groep mensen. Namelijk de mensen met een visuele, auditieve, motorische of verstandelijke beperking.
15% van je potentiële klanten kan je website niet bezoeken
In Nederland alleen al zijn er ruim 2,5 miljoen mensen met een beperking. Dat zijn mensen die moeite hebben met zien, horen, bewegen of begrijpen. Het levert ze niet alleen in ‘real life’ uitdagingen op, ook online krijgen ze het nodige voor de kiezen. Het gros van de websites is namelijk helemaal niet goed toegankelijk voor mensen met een beperking. Niet alleen vervelend voor hen, maar ook voor jou: je laat ongeveer 15% aan potentiële klanten voor een dichte deur staan!
Hoe bezoeken mensen met een beperking jouw website?
Waar ‘wij gezonde mensen’ over websites navigeren met een muis, doen mensen met een motorische of zichtbeperking dat vaak met het toetsenbord, eventueel in combinatie met stemcommando’s. Het bekijken van plaatjes doen ze met behulp van vergrotingssoftware of door het voor laten lezen van de alt-teksten. Gewone teksten kunnen gelezen worden met behulp van een screenreader die de teksten voorleest of met een brailleleesregel (zo’n ding met puntjes die gelezen kunnen worden met je vingers).
Wat kun je doen om je website toegankelijker te maken?
In dit artikel geef ik je tips waar je op kunt letten om je website toegankelijker te maken voor mensen met een beperking. Ik verdeel ze grofweg in de categorieën visueel en auditief, maar als je deze tips toepast heb je automatisch ook de categorie motorisch te pakken. De tips om je website toegankelijker te maken voor mensen met een verstandelijke beperking neem ik nu niet mee, die komen in een apart artikel aan bod.
Visuele toegankelijkheid
Vermijd fancy lettertypes
Mensen met een visuele beperking maken vaak gebruik van screenreaders die de tekst voorlezen. Bij gewone standaard lettertypes gaat dit prima. Maar… als je een apart en uniek lettertype gebruikt snapt een screenreader daar de ballen niet van. De kans is groot dat je website oorverdovend stil is voor je slechtziende medemens. Let daar vooral ook op bij sociale media.
Vermijd Captcha’s
Ik snap ze niet eens altijd en een screenreader al helemaal niet.
Gebruik goede alt-teksten
Denk goed na over de alt-teksten van afbeeldingen. Dat zijn alternatieve teksten die worden getoond als een afbeelding niet wil laden. Je kunt die teksten ook gebruiken voor SEO (dan snapt Google ook wat er op het plaatje staat), maar prop niet het maximaal aantal lettertekens vol met zoekwoorden. Daar wordt niemand blij van. Je kunt best wel creatief zijn, maar gebruik relevante informatie en bedenk wat een slechtziende ‘ziet’ als het plaatje wordt voorgelezen. Bij afbeelding puur voor decoratie is géén alt-tekst ook een prima optie.
Kies de juiste kleuren
Zorg voor voldoende contrast tussen de kleuren. Dit geldt niet alleen voor knoppen (of ‘buttons’ zoals ze vaak genoemd worden), maar ook voor het verschil tussen gewone tekst en achtergrond. Het verschilt per lezer welke kleuren hij of zij beter ziet, maar groene letters op een rood vlak is voor het gros van de Nederlanders al een uitdaging😉.
Via een van de links onderaan deze pagina kun je zelf ervaren hoe jouw website eruitziet voor iemand die kleurenblind is, superhandig!
Schrijf taalkeuzes uit
Als een website in meerdere talen beschikbaar is kun je vaak op een vlaggetje klikken om de juiste taal te selecteren. Als je kleurenblind bent draait dat selecteren uit op een regelrechte multiple-gokoefening. Gebruik daarom niet enkel een vlaggetje, maar schrijf de talen gewoon uit.
Gebruik HTML-opmaak
HTML is de code waardoor screenreaders (en ook Google) weten dat een tekst een titel, subtitel of alinea is (H1, H2, H3). Mensen met een visuele beperking scannen (met behulp van de screenreader) vaak eerst de koppen en subkoppen zodat ze snel weten waar ze welke informatie kunnen vinden. Als je dat niet duidelijk aangeeft en lezers moeten eerst door 1000 woorden ploeteren om bij de gewenste informatie te komen… dan zijn ze allang afgehaakt. Echt.
Gebruik beschrijvende links
Zorg dat je links gebruikt die wat te vertellen hebben. Dus niet: ‘Klik hier’, maar: ‘Mail mij op corrie@corriekamminga.nl’ of ‘Download onze catalogus’. Duidelijk voor iedereen, vooral ook voor screenreaders. Je kunt ook een ‘linkt title tag’ toevoegen. Als je dan over de link scrolt krijg je een pop-up met de beschrijving van de link. Het schijnt dat screenreaders daar ook mee overweg kunnen.
Enne, onderstreep links. Ook voor mensen met een goed zicht werkt dit prettiger.
Maak navigatie met het toetsenbord mogelijk
Zorg dat je over de website kunt navigeren met een toetsenbord. Een blinde ziet namelijk niet waar het pijltje van de muis is en vertrouwt helemaal op het toetsenbord in combinatie met de screenreader. Ook mensen met een motorische beperking hebben vaak moeite met de precieze bewegingen van een muis. Als je via knoppen op je toetsenbord de website kunt doorlopen is dat veel praktischer. Probeer het maar eens op je eigen pagina met bijvoorbeeld de Tab-toets en spatiebalk.
Gebruik geen opmaaktools
Als je opmaaktools gebruikt om een tekstje een geinige opmaakt te geven… bedenk dan dat iemand met een visuele beperking daar waarschijnlijk niks van meekrijgt. De tekst wordt namelijk geplakt als een plaatje en daarvan leest de screenreader alleen de alt-tekst. (Die je dan natuurlijk wel ingevoerd moet hebben😉)
Maak formulieren zo kort en bondig mogelijk
Een screenreader heeft vaak nogal moeite met formulieren. En als er iets misgaat met invullen, vertel dan ook wát er misgaat. Dus welk specifiek vak nog ingevuld moet worden. Het zien van het ene rode sterretje tussen alle andere groene sterretjes is voor kleurenblinde mensen (en waarschijnlijk ook voor screenreaders) een onmogelijke opdracht. Als bezoeker zónder beperking vind ik formulieren vaak al een crime😬.
Auditieve toegankelijkheid
Gebruik ondertiteling
Als je filmpjes op je website hebt staan, zorg dan dat ze ondertiteld zijn. Dat is niet alleen fijn voor mensen die het niet kúnnen horen, ook voor mensen die het niet wíllen horen. Bijvoorbeeld als je niet de hele bus met het geluid wilt laten meegenieten.
Schrijf audiobestanden uit in tekst
Zorg voor transcriptie van audiobestanden op je website. Het is zonde als iemand die doof is jouw leuke podcast niet kan volgen en alleen van die bewegende geluidsbalkjes te zien krijgt. Je kunt de tekst eventueel op een andere pagina uitschrijven en daarnaar doorlinken.
Test of je website toegankelijk is
Alles mooi en prachtig natuurlijk, maar als persoon zonder beperking is het vaak lastig of zelfs onmogelijk om in te schatten hoe iemand met een beperking jouw website beleeft of waar hij of zij tegenaan loopt. Gelukkig zijn er manieren waarop je zelf kunt testen hoe toegankelijk je website is. Hieronder vind je een aantal links die je daarbij kunnen helpen.
https://Ismijnsitetoegankelijk.nl
Vul je webadres in en na een paar seconden krijg je scores op gebruiksvriendelijkheid, leesniveau, alt-teksten en codes van je website.
https://validator.w3.org/
Check je website op codetoegankelijkheid (H1, H2, H3, etc.)
https://www.toptal.com/designers/colorfilter
Hoe ziet je website eruit als je kleurenblind bent? Ervaar het zelf via deze link.
https://toegankelijkonline.nl/artikelen/alles-over-screenreaders
Alles over zelf testen met screenreaders.
Zwaai de digitale deuren van je website wijd open door de bovenstaande tips toe te passen, jouw (potentiële) klanten met een beperking zullen je dankbaar zijn.
Die 15%, weet je nog😉?
Heb je naar aanleiding van dit artikel vragen, opmerkingen of aanvullingen? Ik lees ze graag hieronder in het reactiegedeelte.
