Skip to content

Common Accessibility Requirements Checklist

The chief elements that you want to ensure are 100% compliant are:

1. Use ALT text on your images that are NOT simply decorative

ALT TEXT is a short written description added to an HTML image on web pages (alt="alt text goes here") that explains the image’s content for users who rely on screen readers or when the image cannot be displayed.

When you add an image to a webpage, you have to decide if it needs alt text or if it should be marked as decorative. The best rule of thumb for deciding if you need to give alt text to an image is to ask, "Does this image give the user information they need to understand the page?" If YES, the image is NOT decorative and meaningful alt text is required. If NO, the image IS decorative and no alt text is required. Leave it blank and WordPress will leave it as a decorative image.

Keep in mind that it is preferable to NOT have any text appearing in your images. If the text of an image is required in order for a user to understand the page, it would be best to post the text onto the page itself or link to a PDF.

For example, if you have an image of a chart with text on it, the alt text should to read, "Chart with three columns. (then list out the actual text and numbers in the chart)." In WordPress, if you add the alt text when you upload an image to your site, the alt text is automatically added to the code of the page when you add an image to it.

You can add alt text to images by going to the media library. Select the picture you'd like to use on your website, then add a quick descriptive sentence to the alt text section.



Name your image files appropriately.
If your image shows two students lying in the grass reading, the file name shouldn't be DSC3492.jpg but "two-students-reading-in-grass.jpg".

2. Make sure all Headings are Hierarchical


Read our article on the Proper Use of Headings to learn more.

3. Fix All Broken Links


Links generally have two pieces of information:
  • URL: Web address where the link sends visitors when they select it

  • Display text: Visible text that tells visitors what to expect to find if they select the link

For example, in HTML code a link looks like this: <a href="https://help.blackboard.com/Ally">Anthology Ally</a>.

A link is broken when the page the link goes to can't be found. The page doesn't or no longer exists. Links can be broken when the content linked to is moved or removed. You need to test every link on every page when you create them, and whenever you're aware of a URL changing on your site, or other sites that you have no control over, you must correct the links so that they always remain working.

Write Descriptive Links in the display text

Write your display text to indicate what the user should expect to see when they click on a specific link. For example, a helpful link would be "Learn how to apply for student housing." A bad link would be one that says "Click here," or simply displays the full URL. All links should clearly describe what the user will see when they click on them.

4. Have Clear Contrast Between Text and Background Colors


5. Fix Links With Missing Discernible Text


Links need discernible text that tells visitors where the link takes them. You need to check the following on every page:
  • Is there text between the hyperlink <a> tags? Is the text descriptive?

  • Is the text between the <a> tags hidden?

  • Do images used as links have alternative descriptions?


If you build your pages properly, and use Ally to test your pages regularly, correcting these, and any other issues Ally points out to you, you are well on the way to having a 100% compliant website.




Keywords: accessible websites, alt text, web accessibility standards, ADA website compliance, WordPress accessibility, americans with disabilities act, Anthology Ally, broken links, contrast, background color, heading hierarchy, 508 compliance, decorative, not decorative



Feedback and Knowledge Base