Difference between revisions of "Make images more accessible"

From EdTech Help
(Created page with " {{Template:Accessibility}} {{Template:Sakai Community Documentation}} Category:Accessibility Category:Instructor Category:Sakai 20")
 
Line 1: Line 1:
 +
Some users 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.
 +
 +
== When to Add Alternative Text Descriptions for Images ==
 +
 +
* '''Simple image with "simple 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.
 +
* '''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.
 +
* '''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.
 +
 +
== 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:''' “The next/previous image shows a female forensic scientist who is filling a vial containing a small amount of blood with fluid to denature the sample as part of the process of the PCR analysis method of DNA profiling. In the background is a centrifuge, which will aid in the process of extracting the DNA from the sample of blood.”
 +
* '''Reference farther away in the body of the document:''' "... Figure 1.3 shows the correlation between the...." [Image] Figure 1.3
  
 
{{Template:Accessibility}}
 
{{Template:Accessibility}}

Revision as of 15:21, 27 July 2021

Some users 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.

When to Add Alternative Text Descriptions for Images

  • Simple image with "simple 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.
  • 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.
  • 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.

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: “The next/previous image shows a female forensic scientist who is filling a vial containing a small amount of blood with fluid to denature the sample as part of the process of the PCR analysis method of DNA profiling. In the background is a centrifuge, which will aid in the process of extracting the DNA from the sample of blood.”
  • Reference farther away in the body of the document: "... Figure 1.3 shows the correlation between the...." [Image] Figure 1.3

More questions about Accessibility?


SAKAI logo2021.png

This page is adapted from an equivalent Sakai Community help article.

The original Sakai Community help article, unedited, is available at https://sakai.screenstepslive.com/s/sakai_help