Overview
All content on School websites needs to be ADA and Section 508 compliant. To make images posted on your site compliant, you need to add an alternative text describing the content of the image. The alternative text then can be consumed by screen reader programs.
Prerequisites
You have webmaster rights and there is an image module added to your school site.
Solution
- Open the page where the image is located by following the Editing Pages article.
- Right-click on the required image module.
- Enter a description in the Alt Text field.
To ensure the alternative text meets the accessibility standard, follow these guidelines:- Keep it short - under 50 characters.
- Describe the content and function of the image. For pictures or photographs, the alternate text should describe the scene, name the location or person in it.
- For images with text, use the text in the image as the alternative text.
- If the nearby text on the page describes the content and function of the image, leave the Alt Text field blank.
- If the image is purely decorative, leave the Alt Text field blank.
- Do not use phrases like the image of or the picture of in the alternative text.
- Once done, click Publish Changes at the top of the page.
Confirmation
- Open the page where the image is located. You can do it by hovering over your school name and selecting the corresponding page.
- Right-click on the image and select Inspect (Google Chrome) or Inspect Element (Firefox).
If you are using another browser, you can open Developer Settings/Tools and search for the entered alt text in the source code.
- The alternative text is displayed under the link to the image:
