Status: This is an in-progress, unapproved draft.
Informative images convey a simple concept or information that can be expressed in a short phrase or sentence. The text alternative should convey the meaning or identification that is displayed visually which typically isn’t a literal description of the image.
In some situations a detailed literal description may be needed, but only when the content of the image is all or part of the conveyed information. Whether to treat an image as informative or decorative is a judgement that authors make, based on the reason for including the image on the page.
Images used to label other information
This example shows two image icons – one of a telephone, one of a fax machine. Each image is followed by a phone number. Consistent with the visual presentation the text alternatives “Telephone:” and “Fax:” are used to identify which number is which.
Images used to supplement other information
The following image shows a dog wearing a bell. It supplements the adjacent text that explains the purpose of this bell. A short text alternative is sufficient to describe the information that displays visually but is not explained in the text; in this case the text alternative is “Dog with a bell attached to its collar.”.
Note: If the text included an explanation of how the dog wears a bell, the image might be considered redundant and therefore decorative. As this isn’t mentioned in the text, the image is deemed to be informative.
Images conveying succinct information
This simple diagram illustrates a counter-clockwise direction for unscrewing a bottle top or cap. The information can be described in a short sentence, so the text alternative “Counter-clockwise diagram: Push the cap down and turn it from right to left” is given in the
Note 1: An alternative technique would be to include all of the information in the visible text, using the image as a redundant (decorative) effect, in which case the visual text could be “Turn counter-clockwise (right to left) to unscrew the cap”. This makes all information available in text, while providing additional visual clues for people who find text more difficult to understand.
Note 2: If the information conveyed by the image is substantial, use one of the approaches described in Complex images.
Images conveying an impression or emotion
This photograph shows a smiling family group. It’s a stock image so the individuals should not be identified. It’s being used to give the impression that the website or the company it represents is family-friendly. The text alternative is “We’re family-friendly” as this best describes the intended impression.
Note: If the purpose of this image were simply to improve the look of a page rather than convey an impression, it could be deemed to be decorative, as shown in “Decorative Images: Image used for ambience”. The author determines the purpose for using the image.
Images conveying file format
In this example, a document is available to download in three different formats identified by format icons within text links. They have the text alternatives “HTML”, “Word document”, and “PDF” to distinguish the file type for each link:
Note 1: If the format identification were written as part of the link text, the image might be considered decorative and have a null (empty)
alt attribute (
alt="") but could be in the same link element (
<a>) as the text to include it into the clickable area that is expected. See “Functional Images: Logo image within link text” for details.
Note 2: This particular example is similar to the icon within linked text in Functional Images in that the image conveys information that isn’t given in the link text.