When adding images to your web page, it is essential to ensure that images that convey important information have appropriate text alternatives or descriptions. A description of an image will ensure that it is accessible to everyone. Alternative text and captions are the most commonly used methods to describe images. However, depending on an image's complexity or overall functionality, other image description approaches may be more suitable.

Provide alt text & captions

No matter the subject of an image used in your content, you need to offer descriptive text. A screen reader will look for a contextual description of an image to share with readers, which should live in the text surrounding the image (title or caption) or as alternative (“alt”) text. This is one of the most commonly overlooked aspects of accessibility for instructional content, but most text editors include tools for adding alt text to images.

When adding alt text to an image, be sure to clearly and succinctly describe the most important elements for the student to know. Do not include extraneous detail. In some cases, you do not need to add alt text at all, as in the case of purely decorative images.

Examples

Necessary descriptive alt text:

“Part a of the figure shows a container which has a gas of volume V subscript 1 on the left side and nothing on the right side. Part b shows a container which is completely filled with a gas of volume V subscript 2.”

Too much descriptive alt text:

“There is a figure with a white background and two squares labeled a and b. Part a has a rectangle (representing a container) with a shaded grey section on the left half of the container with dots representing a gas. The gas is labeled V subscript 1. Part b…”

Unnecessary descriptive alt text:

“An icon of a person smiling – I put this here as a cute picture to liven up the page!”

When does an image need a caption?

As with alt text, an image requires a caption if it conveys important information.

Captions work best for:

Images that require a heading to understand the context of the image: For example, portraits of people or pictures of geographic locations may benefit from a caption to ensure everyone is aware of what the image is about.
Images that require supporting or additional information: Some images may present symbols or signs that require additional explanation. A caption will let sighted and non-sighted users know what that additional information is.
Images that are complex: Some complex images may benefit from a caption. However, image captions should be consice. If the caption overwhelms the user and takes up too much space, creating a separate document as a textual alternative may be a better method. Refer to the complex images section for alternatives.

What are decorative images?

Decorative images provide a certain structure or layout to a webpage to make the page more visually appealing. They do not, however, provide significant information to a webpage. Decorative images do not require a text alternative. Make sure to identify when an image you embed is decorative!