Toegankelijke afbeeldingen op jouw website

Voor bezoekers die de afbeeldingen op je website om welke reden dan ook niet kunnen zien, is het belangrijk dat elke afbeelding op je website een alt-tag heeft, met daarin een duidelijke omschrijving van hetgeen op de afbeelding te zien is. Wanneer je er voor zorgt dat je iedere afbeelding die je upload direct voorziet van een heldere omschrijving, voorkom je dat je dit later voor alle afbeeldingen op je website moet doen.

Wil je deze informatie uitprinten en naast je beeldscherm hangen?
Download dan de instructiekaart als PDF.

Instructiekaart toegankelijke afbeeldingen (PDF, 426,574 KB)

Zorg ervoor dat iedere afbeelding een alt-tag heeft

De inhoud van de alt-tag bestaat uit een duidelijke, beknopte omschrijving van wat je in die afbeelding ziet. Zorg ervoor dat een bezoeker weet welke visuele informatie de afbeelding bevat, zonder de afbeelding te (kunnen) zien.

Een deel van het scherm in Craft CMS waarin bestandseigenschappen worden bewerkt, met duidelijk in beeld het veld waarmee de alt-text van de afbeelding wordt aangepast
Een screenshot van een stuk HTML-code waarin de alt-tag getoond wordt

Logo's

Ook voor bijvoorbeeld je eigen logo, of andere logo’s op je website, is een alt-tag nodig. Je volstaat simpelweg met “Logo van [bedrijfsnaam]”.

Belangrijke tekstuele informatie in afbeeldingen

Wanneer een afbeelding belangrijke tekstuele informatie bevat, kun je je afvragen of die informatie in een afbeelding ‘hoort’. Denk bijvoorbeeld aan de inhoud van een menukaart, of een lijst met belangrijke telefoonnummers. Als alternatief voor deze afbeelding kun je de informatie in zo’n geval beter als tekst op een pagina toevoegen.

Hoofdlettergebruik

Wanneer je een heel woord in HOOFDLETTERS typt, zal een screen reader dat woord letter voor letter uitspreken. Zorg er dus voor dat je dat niet doet. Wanneer je wilt dat bijvoorbeeld kopjes altijd in hoofdletters worden weergegeven, kun je ons vragen de stijl van de pagina aan te passen, zodat kopjes altijd in hoofdletters worden weergegeven.

Wil je nog meer weten over het toegankelijk(er) maken van je website? Lees dan verder!

Advies nodig om jouw project toegankelijker te maken?

Opslag van gegevens *