Informatieve afbeeldingen

Mist iemand die de afbeelding niet ziet informatie als je de afbeelding weglaat? Dan is het waarschijnlijk een informatieve afbeelding. Informatieve afbeeldingen helpen de content op de pagina duidelijker te maken, of geven aanvullende informatie.

Voorbeelden van informatieve afbeeldingen:

• Grafieken en infographics
• Blauwdrukken en schema's
• Afbeeldingen bij instructies
• Kunst en architectuur
• Productfoto's

Of afbeeldingen informatief zijn, is afhankelijk van de context en het doel van de afbeelding. Een afbeelding van een boom op een pagina over duurzaamheidsinitiatieven kan decoratief zijn, maar in een artikel over schadelijke insecten in specifieke boomsoorten in de gemeente waarschijnlijk niet.

Overwegingen

Vragen die je jezelf kunt stellen als je een informatieve afbeelding plaatst:

• Waarom wil ik deze afbeelding plaatsen?
• Wat is het doel van de afbeelding?
• Gaat er informatie verloren als ik de afbeelding niet kan zien?

Per afbeelding die je plaatst is de beschrijving die je meegeeft anders, omdat het antwoord op deze vragen anders is. Zorg er in ieder geval voor dat de informatie in de afbeelding ook voorkomt in de alternatieve tekst.

Doen

Informatieve afbeeldingen een beschrijvende alternatieve tekst geven

Alternatieve tekst: De fieldset component groepeert gerelateerde invoervelden. De component bevat een optionele rand. De beschrijving van de groep staat boven de invoervelden, binnen de optionele rand.

Gebruik je een grafiek of diagram?

Bekijk dan ook de richtlijnen voor grafieken. Daar lees je hoe je ervoor zorgt dat de informatie ook zonder kleur goed te begrijpen is.

Over deze richtlijnen

Deze richtlijnen worden onderhouden door het NL Design System en zijn op dit moment in beta.

We willen graag van de community horen of ze werkbaar en nuttig zijn. Heb je vragen, aanvullingen of opmerkingen? Open een issue op GitHub en deel je mening.