Aller au contenu

Add alt text to an image

Images play a central role in the interface of an application. To make them accessible to visually impaired users, it is essential to associate them with alternative text (or alt text).

Adding alt text to an image

What is an alt attribute?

It is a descriptive text that is read by a screen reader when an image is displayed. It conveys visual information to users who cannot see it.

Alt=“Map of the city with points of interest”

Why add alternative text?

  • For users who cannot see the image
  • For cases where the image cannot be loaded
  • To meet accessibility standards (WCAG)
  • To improve your application’s SEO

When should you use an alt?

  • If the image conveys information: YES, a descriptive text is required
  • If the image is purely decorative: NO, use the attribute Aria Hidden = “true”

Writing good alt text

  • Be descriptive and concise
  • Do not start with “Image of…”
  • Focus on the essential meaning of the image in its context
    It should be clear, precise, and useful—beyond just a visual description.

Example:

  • ❌ “Image of the storefront”
  • ✅ “Light wood storefront of the PandaStore with a blue sign”

Add an alt attribute in PandaSuite

  • Select the image in question
  • In the right-hand panel, open the Custom Attributes section
  • Click on Add an attribute
  • Fill in:
    • Name: Alt
    • Value: a relevant textual description