Images

Images must have some sort of description through the alt text or long description. Images with lots of text should be avoided.

1. Include alt text for images with contextual meaning

That way screen reader users will be able to benefit from the images included.

To add alt text:

  1. Click on the image in the CMS editor
  2. Under ToolTip, enter your alt text
  3. Press Enter to apply the change

images_example1

2. Include empty alt tag for images without contextual meaning

That way screen reader users will know to skip the image since it’s not relevant to the content.

To add empty alt tag:

  1. Go to HTML view in the CMS editor
  2. Find the image code by pressing Control + F, and searching for the “?idXXXX” number
  3. Within the image code, insert alt="" and then Save.

images_example2

3. Avoid images with text

Using images to convey information is against best practices, because screen readers cannot analyze images. There are a few options to make content in an image accessible:

  1. Create a new page/page section and transcribe the content in the image
  2. Create an accessible PDF for users to download

See below for resources on how to create accessible PDFs: