Alternative Text

• Alt text provides descriptions of images for individuals who use screen readers, enabling them to understand the content and context of visuals that they cannot see.
• Alt text conveys essential information that may not be available in the surrounding text, helping users grasp the full meaning of the content, especially in educational or informative settings.
• Alt text enhances the overall user experience by ensuring that all users, regardless of their abilities, can navigate and understand content effectively.

Alt text should be concise and meaningful, and ideally no more than 150 characters. Be sure to put a period at the end of the alt text.

Images that convey no meaning and are purely decorative do not need descriptive alt text, but they do require null alt text. In the UBCMS, check the box that says "This image does not require alt text." In HTML, use the null alt attribute (alt="") with the image element.

• Describe the image within the context of the page.
• Avoid using the words like "image of" or "photo of".

For images that are used to initiate an action or link to another page, the alt text should describe the function of the image. Avoid including the words "link to".

Alt text should communicate the same information a sighted student would get just from seeing the image — not what they could infer or conclude.

• Good: “A line graph with two intersecting lines.”
• Avoid: “A graph showing supply and demand curves.” (This names concepts the student is supposed to identify.)

If identifying an object, trend, emotion, or relationship is part of the question, don't name it in the alt text.

• Good: “A person standing with arms crossed, facing another person.”
• Avoid: “A person who looks upset confronting someone.” (“Upset” is an interpretation.)

If the question requires reading data, include the data. If the question only requires noticing structure or layout, describe just that.

• Example 1: Math chart used only to test graph reading: Provide axis labels, data points, etc.
• Example 2: Graph used to test recognition of a graph type: Don’t add unnecessary detail that reveals the answer.

If recognizing something in the image is part of the exam, keep the description neutral.

• Bad alt text (gives answer): "A right triangle.”
• Better: "A three‑sided shape.”
• Even better if the exam question is: “Identify the type of triangle shown”: "A triangle.”

Students reading alt text should not get extra hints or shortcuts compared to sighted students.

Avoid alt text that makes the question easier by:

• summarizing patterns
• highlighting key objects
• naming concepts

If a sighted student must work to derive meaning, the screen reader user should too.

• If the image contains text relevant to the question, include it verbatim.
• If the text would reveal the answer, describe its presence without revealing content.
  • Example – Label on a map used to identify the location: “A map with several labeled regions.” (Not: “A map with the Amazon River labeled.”)

Complex diagrams, charts, or data-heavy visuals may require more than short alt text. First, use short alt text like: “Bar chart showing monthly sales. Long description follows.”

Then provide a neutral, non‑interpretive long description.

It is possible to use generative artificial intelligence (GAI) to help you write alt text. Please remember that the text generated may not correctly or appropriately describe your image, especially in the context of your webpage or document. Any alt text you generate with AI must be reviewed for accuracy and edited prior to publishing.

Here are two sample prompts you can try:

1. Create a textual description of this image with all of the information in it for a screen reader. Include word for word any words or sentences in the image.
2. Write alt text for this image. Include word for word any words or sentences in the image.