Hoe maak je illustraties, foto’s en plattegronden toegankelijk? Voor mensen met een visuele beperking is deze visuele informatie niet bruikbaar. Om deze content digitaal toegankelijk aan te bieden moet je enkele aanpassingen doen. In dit blog leggen we uit hoe je dit het beste aanpakt.
Zet belangrijke informatie niet in afbeeldingen
Voordat we ingaan op hoe je afbeeldingen toegankelijk maakt, is het belangrijk om stil te staan bij waarvoor je afbeeldingen gebruikt. Vraag je altijd af of informatie in een plaatje moet staan. Het is namelijk beter als je het in gewone tekst of vormgegeven HTML kunt weergeven. Tekst schaalt beter dan een afbeelding en kan dus makkelijker worden vergroot. Bovendien kan tekst automatisch door voorlees- en vertaalsoftware worden gebruikt. Daarnaast is het vermijden van tekstuele informatie in afbeeldingen beter voor de vindbaarheid in Google. Google kan namelijk niet goed teksten in afbeeldingen begrijpen.
Alternatieve teksten voor afbeeldingen
Als je afbeeldingen online gebruikt is het verstandig om een zogenaamde alt tag of alternatieve tekst in te vullen. Hierin beschrijf je wat er te zien is op de afbeelding. Niet alleen is dit belangrijk voor toegankelijkheid, ook voor SEO is dit verstandig. Google maakt namelijk ook gebruik van alternatieve teksten bij het indexeren.
Alternatieve teksten geven blinde gebruikers informatie over wat er te zien is. Bedenk bij het schrijven van een alternatieve tekst wat de functie van de afbeelding is. Wat is de bedoeling van de afbeelding en wat is de boodschap? Maak daarom ook het onderscheid met decoratieve afbeeldingen. Deze hebben geen functie, dus is een tekstalternatief niet nodig.
Op veel websites zijn plaatjes voorzien van tekstalternatieven. Minder bekend is dat dit ook in documenten kan. In Word kun je bijvoorbeeld ook een alternatieve tekst toevoegen aan een afbeelding. Klik met de rechtermuisknop op een afbeelding en selecteer alternatieve tekst bewerken.
Meer info over hoe je met tekstalternatieven voor niet-tekstuele content om moet gaan, vind je in de WCAG richtlijn.
Afbeeldingen en figuren aanpassen voor slechtzienden
Bruikbaarheid voor blinden is anders dan voor slechtzienden. Waar blinden vertrouwen op voorleessoftware, maken slechtzienden bijvoorbeeld gebruik van het vergroten van tekst. Afbeeldingen schalen echter minder goed dan tekst, doordat ze dan onscherp worden.
Om afbeeldingen bruikbaar te maken voor slechtzienden is het belangrijk dat er voldoende kleurcontrast is. De WCAG richtlijn stelt dat je uit moet gaan van een minimale contrastverhouding. Je kunt de contrastverhouding bepalen met behulp van een gratis tool, zoals die van WebAIM. De DevTools in Google Chrome kun je hier ook voor gebruiken.
Om grafieken bruikbaar te maken voor slechtzienden kun je bijvoorbeeld arcering toepassen. Zo maak je lijnen beter zichtbaar. Uiteraard moet je hier ook rekening houden met het contrast.
Plattegronden en complexe illustraties toegankelijk maken
Soms wordt zoveel informatie visueel gepresenteerd, dat een bondige alternatieve tekst niet volstaat. Denk aan plattegronden en technische tekeningen. Hoe ga je daarmee om?
Ingewikkelde figuren met veel visuele informatie kunnen zelfs voor iemand zonder visuele beperking lastig zijn om te begrijpen. Beschrijf de functie en belangrijkste info uit de illustraties dan zo goed mogelijk in de tekst. Probeer de visuele informatie hierbij zo concreet mogelijk te maken. Door op deze manier naar zulke illustraties te kijken, maak je ze begrijpelijk, zowel voor gebruikers met als zonder visuele beperking.
Een vergelijkbare situatie heb je met routebeschrijvingen. Je kunt ervoor kiezen om de route visueel aan te geven op een wegenkaart, maar dan is het niet toegankelijk. Door de route in de tekst uit te schrijven, bedien je ook diegenen die de kaart niet kunnen gebruiken.
Toegankelijkheid en complexe visuele content
Theoretisch is alles toegankelijk te maken, maar soms zou het in de praktijk buitenproportioneel veel geld kosten. Toch kun je meestal met wat relatief kleine aanpassingen ook puur visuele content toegankelijk maken. Neem bijvoorbeeld een Google-Maps kaart met druppels voor de vestigingen van een bedrijf. De locaties worden dan alleen visueel en zonder beschrijving gepresenteerd. Een goed alternatief is om dan een eenvoudige adreslijst toe te voegen. Door de locaties in tekst te vatten, maak je het gelijk toegankelijk.
Kortom, heb je visuele content die niet toegankelijk is? Bied gebruikers met een functiebeperking dan een zo goed mogelijk alternatief, zoals de adreslijst in het bovenstaande voorbeeld.
Hoe maak jij illustraties en plattegronden toegankelijk? Ik ben benieuwd naar je ervaringen. Laat het mij weten!
