Webtoegankelijkheid: visuele beperkingen
Dit is het eerste artikel in een reeks over web accessibility, oftewel webtoegankelijkheid. In deze reeks artikelen bespreek ik de barrières die internetgebruikers met een beperking kunnen ervaren en wat we kunnen doen om het hun gemakkelijker te maken. Samen kunnen we het internet toegankelijker maken voor iedereen. Vandaag deel 1: visuele beperkingen.
Over visuele beperkingen
Stichting Accessibility, het expertisecentrum voor toegankelijke ICT, definieert de verschillende vormen van visuele beperkingen als volgt:
- Kleurenblind – onder andere problemen met het onderscheiden van verschillen tussen kleuren zoals rood en groen, of tussen geel en blauw, en soms het ontbreken van kleurwaarneming
- Slechtziend – onder andere onscherp zicht, kokervisie, verlies van het centrale zien en troebel zicht
- Blind – substantieel, onherstelbaar verlies van zicht in beide ogen
- Doofblind – substantieel, onherstelbaar visueel en auditief beperkt (iemand is zowel doof als blind)
(Bron: Stichting Accessibility)
In dit artikel zullen wij ons hoofdzakelijk richten op blinden en slechtzienden.
Screenreaders
Voor blinden en slechtzienden kent het internet vele uitdagingen; zij kunnen immers niets of weinig zien van wat er op het computerscherm gebeurt. Daarom is er software om het hun gemakkelijker te maken: de zogenaamde screenreaders. Een screenreader leest de inhoud van de pagina aan de gebruiker voor. Voor internetters met een visuele beperking is het daarom van groot belang dat de screenreader goed kan onderscheiden wat er moet worden opgelezen. Bepaalde aspecten van een pagina kunnen het de screenreader moeilijk maken, onder meer de opbouw van de inhoud, afbeeldingen en koppelingen. Deze belemmeringen zal ik hieronder nader toelichten.
Opbouw van de inhoud
De inhoud van een pagina moet altijd volgens een bepaalde volgorde worden opgebouwd. Hiervoor worden de zogenaamde heading tags of h-tags gebruikt (h1 tot en met h6). De paginatitel wordt in de code aangeduid met h1, een paragraaf met h2 en een subparagraaf met h3 en verder. Deze vaste structuur levert een indeling met kopjes van verschillende groottes op. Deze indeling is voor iedereen logisch, maar voor visueel beperkte gebruikers zelfs cruciaal. Veel hulpsoftware gebruikt de h-tags namelijk voor navigatiedoeleinden. Dankzij de h-tags hoeft de gebruiker niet de hele tekst op de pagina te beluisteren, maar kan bijvoorbeeld met de tab-toets naar de volgende paragraaf springen. Gebruik de h-tags dus altijd netjes waar ze horen.
Afbeeldingen
Afbeeldingen kunnen bezoekers van een pagina extra informatie geven. Blinden en slechtzienden krijgen deze informatie echter niet of nauwelijks mee. Daarom is het slim de afbeeldingen een eenvoudige beschrijving mee te geven. Geef tekst op die nodig is om de pagina te begrijpen. Een voorbeeld: de website van de Nederlandse Spoorwegen bevat niet veel afbeeldingen, maar links bovenin en rechts onderaan staat het NS-logo. Hier volgt een stukje broncode van de website van de NS:
De alt-tekst die de websitebouwer aan het logo heeft meegegeven is “Logo Nederlandse Spoorwegen”. Dit is dus wat de screenreader voorleest aan de gebruiker. Bij puur decoratieve afbeeldingen kan de alt-tekst beter worden weggelaten, zodat de screenreader de afbeelding negeert. Als een afbeelding grotendeels uit tekst bestaat, is het verstandig de transcriptie ervan in de alt-tekst op te nemen.
Koppelingen
Koppelingen of links moeten een duidelijke naam krijgen. Zo weet de hulpsoftware waar de koppeling naar verwijst. “Klik hier” is geen duidelijke verwijzing, maar “Download onze algemene voorwaarden” wel. Hierboven schreef ik al dat afbeeldingen een goede alt-tekst moeten hebben. Het belang daarvan is nog groter bij afbeeldingen die van een koppeling zijn voorzien, zoals menuknoppen. Het moet de hulpsoftware altijd duidelijk zijn waarnaar wordt verwezen.
Afsluitend
De bovenstaande lijst was niet uitputtend. Ook tabellen, video’s, flash/JavaScript en formulieren kunnen een uitdaging zijn voor de blinde en slechtziende bezoekers van je website. Wil je meer weten? Bezoek dan de website van Stichting Accessibility.
Benieuwd hoe je nog meer rekening kunt houden met de bezoekers van je website? Houd deze blog dan in de gaten. Volgende keer schrijf ik over websitehindernissen voor mensen met een verstandelijke beperking.