Provide Long Descriptions for Complex Images

Generally for images on a web page, a text alternative is provided using the alt attribute. It is considered best practice to keep alt text brief and concise (think no more than 140 characters). But what about images that are complex? It is sometimes impossible to describe detailed images in the recommended length for alt text. In a case where a web page contains complex images like charts and graphs, a longer description in addition to alt text may be necessary to fully communicate the information in the images. Here are some ways to add long descriptions to complex images:

  • Provide the long description itself in the HTML document right below the image.
  • Provide a link to the long description below the image. Be sure the link describes the destination (e.g., "Detailed description of image").

    Bar chart with percentages

    Detailed description of the chart

  • Provide a button below the image that opens the description, like a popup or dialog.

One other way to provide a long description is to use the longdesc attribute, but this method is usually not recommended because screen readers make it difficult to determine if an image has a longdesc link or not.