Text Presented as Image

Short Description

Screen reader cannot read image

Long Description

  • A screen reader accesses text, it cannot access an image of words.
  • If the image has alt text of the text in the image, it gives a screen reader user partial access to the text, but they cannot interact with the content without going into the html of the page.
  • An image of text can provide problems for someone using a screen magnifier, because it is more likely that there will be problems with it resizing.

Example of Issue

The following YouTube video demonstrates a screen reader user trying to interact with a site where the text is an image.

Screen reader deals with a form where text is an image.

Recommendations

  • Do not use images of text, but instead use real text and format it with CSS.
  • If it is necessary to use an image of text, give the image a null alt text and then provide the text in a hidden format so the screen reader will read it in the appropriate location.
  • If the text in the image is not important information, such as a stop sign or license plates in a picture of a street intended to show a person walking a dog, do not include it.
  • More information is available in the article Making Sure More than Eyes Can Detect an Element on the AUL site.

Accessibility/Usability

Accessibility
Usability

Impacted Assistive Technology

Screen Reader
Screen Magnifier

Impacted Type of Device

Computer
Mobile

Issue Keywords