An alt Decision Tree • Images • WAI Web Accessibility Tutorials

Tutorials home »

Images »
Current: An alt Decision Tree

An alt Decision Tree

This decision tree describes how to use the alt attribute of the <img> element in various situations. For some types of images, there are alternative approaches, such as using CSS background images for decorative images or web fonts instead of images of text.

• Does the image contain text?
  • Yes:
    • … and the text is also present as real text nearby.
      Use an empty alt attribute. See Decorative Images.
    • … and the text is only shown for visual effects.
      Use an empty alt attribute. See Decorative Images.
    • … and the text has a specific function, for example is an icon.
      Use the alt attribute to communicate the function of the image. See Functional Images.
    • … and the text in the image is not present otherwise. Use the alt attribute to include the text of the image. See Images of Text.
  • No:
    • Continue.
• Is the image used in a link or a button, and would it be hard or impossible to understand [...]