Skip to Main Content
It looks like you're using Internet Explorer 11 or older. This website works best with modern browsers such as the latest versions of Chrome, Firefox, Safari, and Edge. If you continue with this browser, you may see unexpected results.

D4D Accessibility Guide

Milestone Overview: Alt-Text for Images

Images have alternative text (alt-text)

Alt text is a concise description of the image. Screen reader users won’t be able to engage with an image you put into your guide unless it has alt-text.

Accessibility Best Practices

Check each page for your guide to make sure all images have alternative text. 

  • You can do that in the author edit mode of each page by clicking on each image (probably the most practical).
  • Do an automated scan with an accessibility checker.
    • Check each page of the guide. Note down which images don’t have alt-text
    • Use the editor in LibGuides to add alt-text. 

Tip:

You can also do a scan of a page after you’ve done the work just to confirm you haven’t missed anything

  • Use the Rich Text Editor > Image tool or use the Image Manager found via Main Menu > Content > Image Manager
    • Image Manager Note: There’s currently a vendor bug that limits the character count to 50, so be aware of that if you’re describing complex images. Use the rich text editor for longer descriptions.

Writing Alt-Text:

  • Describe what's in the image as best you can. Think about what information does that image convey to the viewer/
  • Try to keep it short (~140 characters) because a user has to listen to it. Too wordy and it can be overwhelming. 
  • Use punctuation in your alt-text. Make sure to put a period at the end of your sentences. Punctuation helps screen readers pace.
  • Remove images that are purely decorative, serve no educational, or communications purpose. Or add “” into the Alt-Text field (no spaces between the quotation marks). 

Screenshots 

  • If you have marked-up screenshots in your guides to explain how to use an online service or system be aware that the text or arrows you add to that image won’t be available to a screen reader.
  • The best practice is to write out the information or directions in the body text of your guide, not just on an image, that way it's accessible to everyone. 
  • Having directions in your body text makes writing the alt-text for that image and keeping to the 140 characters much easier. 

LibGuide Help Center Resources:

Additional Resources

Project Management Suggestions

  • Run specific workshops for creating alt-text. We got a lot of questions about it and because it's more of an art than a science giving people the opportunity to practice and learn as a group proved helpful.
  • Reach out to authors of guides related to the visual arts early about alt-text. They may be a great asset for helping your organization think about describing images and developing resources and best practices.