How can I make images more accessible?
Users with some disabilities will be unable to see images and/or comprehend what they are meant to convey.
Alternative Text can help give context and meaning to an image. This article answers the following questions about text alternatives for images:
IMPORTANT: Do not put large blocks of text inside an image! Images of text are NOT accessible.
What kinds of text descriptions should I add for images?
The type of text description needed for an image will depend on the complexity of the image, the meaning you intend for it to convey, and how it is being used. The following are recommended guidelines for describing images:
- Simple image with "simple meaning" and no surrounding text that adequately conveys its meaning - Add descriptive alternative text of 10 to 169 characters as outlined below. The alternative text should describe the educational/informational purpose of the image.
- Simple image that is adequately described in the page content - If a simple image has a title, caption, or description that adequately conveys its meaning and would be the same as what you would put in the alternative text, leave the alternative text description blank so the same information is not repeated more than once for users of assistive technology.
- Complex image with "rich meaning" - Add a paragraph above or below the image that goes into more detail. Some pointers, such as "Next image," or "Previous image," will help tie them together. If the image is referenced from elsewhere in the document, add a paragraph below it that can serve as a caption, and then refer to it. If the longer alternative text is not feasible, create a link to an external Web page that contains an appropriate description.
- Any image that contains textual content - If an image contains any text, include this textual content in either the alternative text or the text surrounding the image.
- Decorative image - If the image is purely decorative or used for visual formatting, the alternative text description should be left blank to hide it from users of assistive technology.
What are some examples of text alternatives for images?
- Alternative Text: “Scientist in a lab filling a vial with fluid”
- Description in the text before or after the image: “Next/Previous image shows a female forensic scientist, Supervisory DNA Analyst, Kerriann Meyers, working in the DoD DNA Registry, Armed Forces DNA Identification Laboratory (AFDIL). The scientist places samples in vials in a cartridge before loading it on the Next Generation DNA Sequencing (NGS) instrument.”
- Reference farther away in the body of the document:
"... Figure 1.3 shows a female forensic scientist...."
[Image] Figure 1.3
Need more examples?
The Diagram Center website (opens new window) includes guidelines for authoring text alternatives for images (opens new window) and an Accessible Image Sample Book (opens new window) with excellent examples of image descriptions.
How do I add alternative text to an image?
Video Guide
Step-by-Step Instructions
How do I add Alternative Text to a new image?
- If you do not already have an image embedded in the text box, select the Image icon in the Rich-Text Editor's toolbar to insert an image. The Image icon displays a picture that looks like a landscape, with mountains and a sun. For complete steps to add an image, see How do I embed an image in the Rich-Text Editor?
- In the Image Properties dialog window, enter short, meaningful descriptive text in the Alternative Text box.
- Select OK to confirm the addition of the image and its alternative text.
How do I add Alternative Text to an existing image?
- Double-click on the image you have embedded in the Rich-Text Editor OR select the image in the editor window,
- Then select the Image icon in the Rich-Text Editor's toolbar. The Image icon displays a picture that looks like a landscape, with mountains and a sun.
- In the Image Properties dialog window, enter short, meaningful descriptive text in the Alternative Text box.
- Select OK to confirm the addition of the alternative text.