Image accessibility principles

Image accessibility is important to people with the following disabilities:

  • Blindness
  • Colour-blindness
  • Low vision
  • Deafness
  • Motor impairments
  • Cognitive impairments.

It is commonly known that alternative text should be provided for images, and the primary group to benefit from this is blind people. The use of images on the internet can also increase the accessibility of a web page for other users.

Images such as graphics, drawings, illustrations, graphs and charts benefit many users by increasing a person’s cognitive ability to understand concepts being presented. When images are incorporated in an accessible manner, they assist users with cognitive and learning disabilities. Images can also greatly enhance the design of a web site, and are certainly not prohibited by accessibility requirements.

There are two types of images commonly used:

  • Content-related images – images containing content-related information that adds value to the page content
  • Presentational images – images that convey no valuable information, are used to layout page content (spacer) or are purely decorative

Accessibility principles specific to the use of images include, but are not limited to:

  • Always use the ALT attribute.
    • Provide an ALT attribute to describe the purpose of an image, or to describe its content.
    • Provide a long description for complex images e.g. graphs, charts, images with lots of detail – refer to this in the ALT attribute.
    • Use an empty or null ALT attribute for decorative or images that convey no content, to ensure a screen reader will ignore it.
  • Do not rely on colour alone.
    • Do not use colour alone to convey meaning, e.g. maps, diagrams, instructions.
  • Ensure there is a high contrast.
    • Ensure there is a high contrast between colours used for foreground and background content within an image.
  • Avoid using images to display text.
    • When an image is required – use large font sizes, block/solid fonts and high colour contrast between the text and background.
  • Don’t use flickering or strobing images.
    • These can cause seizures.