eLearning Alt Text Help

So the phrase "alt=" is HTML code. This is where the webinars you watched are correct: the alt text for an image should not be left blank and the "alt=" tag should either be alt="" or alt="[phrase]"

• alt="" <-- this means the image is purely decorative and the screen reader will not read the alt text back.

Example:

<img src="images/divider-line.png" alt="">

• alt="phrase" <-- the phrase here is what you want the screen reader to read back to the learner. Generally, it should be 150 characters or fewer, including spaces

Example:

<img src="images/training-dashboard.png" alt="Training dashboard showing course progress and completion status">

In this case, the screen reader will announce "Image: training dashboard showing course progress and completion status."

• No alt text? Your webinar advised against not having alt text in your HTML due to the behavior of the screen reader. Here is what would happen if you had an image without alt text.

Example:

<img src="images/training-dashboard.png">

The screen reader would then announce "Image..." And your learner would be confused because it would just end there!

For Rise and Storyline, it's different. You do not include the "alt=" phrase. Here is how you handle alt text for each:

Rise

• Decorative: leave alt text field blank
• Alt text: Add phrase in alt text field, no quotes

Storyline

• Decorative: uncheck "Object is visible to accessibility tools"
• Alt text: Check "Object is visible to accessibility tools", and add phrase in Alternative Text field

Let me know if you'd like me to review anything (make sure to tag me so I get notified), happy to help!