Photos and images in webpages are simply decorative, informative, functional, or complex. Knowing the differences leads to better alt-text.

Informative and Decorative Images

Informative Images and Alt-Text

If the image is intended to supplement the main content, take a direct approach to writing accessible alternative text:

In a basic page or article, for example, that advertises a course offered the following semester the text surrounding the image says, "Fall 2021 Research Methods in English," and the course description says in part, "Includes emphasis on annotated bibliographies, milieu studies, dictionaries, and bibliographies of bibliographies."

Alt-text for a selected image related to research could be, "Student examining a bibliography while consulting the Oxford English Dictionary."   

Sometimes images aren’t necessarily meant to supplement text, but rather to convey an impression or emotion related to it. For these types of images, capture the meaning that is being shown rather than specifically what is in the photo. Alt-text doesn't have to be a literal description of the image, which helps in locating broader selections of photos that can be used in webpages. As long as there's an impression or emotion that can be connected to the surrounding content, about any photo is fair game.

In the same page advertising the Research Methods in English course, using the same or a different image, another correct approach would be to use alt-text to capture the meaning of research and the course. The alt-text could also be something along the lines of, "Students study the research paths and documents of others so they can become proficient at creating their own." Well stated in 112 characters.

Decorative Images and Alt-Text

When users decide to include an image for decorative purposes, e.g., background photos in blocks for layout, Drupal Web Express automatically sets the alt-text on these images to be blank so that they're not necessary for auditory screen readers to read. Choose decorative images that pertain to the overall aesthetic or message of the webpage in which they'll be placed.