Decorative images don't add information to the contents of the page. Therefore they:
- Don't need captions
- Don't have to meet color contrast guidelines
- Don't need alt text
- Should have a null (empty) tag (alt="") in the image label so screen readers skip them

University of Illinois at Urbana-Champaign

Different image types will have different accessibility guidelines and different contexts on where it's appropriate to apply these guidelines.
- Decorative images
- Informative images
- Functional images

Types of Imagery

Material Design Documentation

Decorative Images

Informative images convey a concept in a short, digestive manner. Therefore they:
- Relay accurate information that is relevant to the adjacent text
- Need captions
- Need alt text if the caption or adjacent text does not explain the image
- Have to meet color contrast guidelines for essential items
- Contain essential and non-essential elements


Informative Images

Functional images are logos, icons, images within a button, and images that are actionable (ie. a link). The alt text for functional images is different than alt text for other types of imagery. This is because functional imagery depicts the function of the image, not its contents or what it looks like. When an image is within a button, add an alt tag that explains its function with an action verb.

Learn Before

Related