• gepubliceerd
  • leestijd
    ± 3 minuten

Toeganke­lijkheid bij illustraties en plattegronden

Wij laten je zien hoe je in drie stappen toeganke­lijkheid binnen je organisatie verankerd. Zo bespaar je tijd en geld en creëer je intern bewustzijn.

Hoe maak je illustraties, foto’s en plattegronden toeganke­lijk? Voor mensen met een visuele beperking is deze visuele informatie niet bruikbaar. Om deze content digitaal toeganke­lijk aan te bieden moet je enkele aanpassingen doen. In dit blog leggen we uit hoe je dit het beste aanpakt.

De locatie van Swink op een plattegrond.

Zet belangrijke informatie niet in afbeeldingen

Voordat we ingaan op hoe je afbeeldingen toeganke­lijk 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 name­lijk beter als je het in gewone tekst of vormgegeven HTML kunt weergeven. Tekst schaalt beter dan een afbeelding en kan dus makke­lijker 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 name­lijk 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 toeganke­lijkheid, ook voor SEO is dit verstandig. Google maakt name­lijk 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 toeganke­lijk 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 moge­lijk in de tekst. Probeer de visuele informatie hierbij zo concreet moge­lijk te maken. Door op deze manier naar zulke illustraties te kijken, maak je ze begrijpe­lijk, zowel voor gebruikers met als zonder visuele beperking.

Een verge­lijkbare situatie heb je met routebeschrijvingen. Je kunt ervoor kiezen om de route visueel aan te geven op een wegenkaart, maar dan is het niet toeganke­lijk. Door de route in de tekst uit te schrijven, bedien je ook diegenen die de kaart niet kunnen gebruiken.

Toeganke­lijkheid en complexe visuele content

Theoretisch is alles toeganke­lijk 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 toeganke­lijk 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 ge­lijk toeganke­lijk.

Kortom, heb je visuele content die niet toeganke­lijk is? Bied gebruikers met een functiebeperking dan een zo goed moge­lijk alternatief, zoals de adreslijst in het bovenstaande voorbeeld.

Hoe maak jij illustraties en plattegronden toeganke­lijk? Ik ben benieuwd naar je ervaringen. Laat het mij weten!