We use the alt (alternative) text to convey any image’s content (photograph) and meaning (UI image).

  • The alt text must be informative. It has to describe the content or the function of the image.
  • The alternative text always depends on the goal of the image. You have to describe it as the context suggests it.
  • Keep it short, a maximum of 150 characters. The screen readers can’t pause (or resume) when reading an alt text (just starting over).
  • Leave it empty if it is a decorative image.
  • You don’t have to add that it is a “photo of” or “image of” as a prefix. The screen reader will identify this as an image, so it is redundant.
  • For icons, use the name of the action (play, pause, next, download).
  • Use separate, text-based alternatives for complex and more extended information (like charts and diagrams).