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).