The First 10 Steps to Site Accessibility (and the 5 Mistakes You're Probably Making)

The Web Content Accessibility Guidelines (WCAG) 2.1 defines how we can make web content more accessible to a wider range of people with disabilities, such as those who have “blindness and low vision, deafness and hearing loss, limited movement, speed disabilities, photosensitivity, any combinations of these, and some accommodation for learning disabilities and cognitive limitations.”

The three levels of WCAG guidelines are: A (lowest level), AA, and AAA. To give you a starting point, we’ve prepared a beginner’s guide (A and AA level) to get you on the right path in making your website more accessible to those with disabilities.

We recommend you take the following 10 steps to make your site more accessible:

1. Review the Website Content Accessibility Guidelines (WCAG 2.1)

Preparation is key. Reviewing the WCAG guidelines will offer recommendations on how to make your website accessible. It will help you understand why WCAG exists, its overall principles, its general guidelines, and what defines success. Within WCAG, you’ll also learn what techniques and resources are available to ensure compliance.

2. Conduct a Website Audit

Conduct an audit of your website using a WAVE® Web Accessibility Tool. WAVE® is a web-based evaluation tool that can “identify many accessibility errors and WCAG errors, while facilitating human evaluation of web content." It proves to be a valuable tool as it focuses on identifying issues that can impact the end user. Other benefits of the WAVE® tool is that it’s free, easy to follow – whether you are an expert level coder or a decision maker without technical expertise, and offers a great deal of clear, simple action items you can take action on right away.

3. Add Alt Tags

Provide alt tags which are text alternatives for any non-text content on your website. Having alt tags are used so the content can be altered to accommodate people’s needs, including large print, braille, speech, symbols, or simpler language.

4. Closed Captioning

If you have audio content throughout your website, consider including captions for any pre-recorded audio content in synchronized media.

5. Include Clear Instructions

Incorporate labels or instructions when content requires user input.

6. Use Descriptive Titles

Make note of these during your website audit to ensure all your pages have proper titles that clearly describe the topic or purpose of the page.

7. Check Text Contrast Ratio

The visual presentation of text and images of text on any of your web pages should have a contrast ratio of at least 4.5:1.

8. Add Status Messages

In content implemented using markup languages, status messages can be programmatically determined through role or properties such that they can be presented to the user by assistive technologies without receiving focus.

9. Clean All Content Elements

Make sure all elements have complete start and end tags, are nested according to their specifications and do not contain any duplicate attributes. You should also check to ensure each ID is unique, except where the specifications allow these features.

10. Review Website Code

Have your developer do a full audit of your website’s code and database. They should review both the code (i.e. HTML) and styling (CSS) to ensure best practices are being utilized. Proceed cleaning up any outdated and unnecessary code.

5 Key Mistakes You're Probably Making

1. Relying on one tool to fix all. Do not assume the use of WAVE® is the only tool you should rely on if you are shooting for AAA level. WAVE® is just a starting point. If your organization requires 100% compliance you will need to use more than one software analysis tool, as well as independent auditors and oversight service providers. Legal teams are often involved in this process when compliance is legally mandatory.

2. The “Set It and Forget It” method. Do not assume updating a website for Web Content Accessibility Guidelines (WCAG) 2.1 is a one-time job. Organizations that choose to adhere to these guidelines should set processes in place to revisit these guidelines when updated, or at least every year, and to act upon new guidelines when appropriate. WCAG 2.2 is scheduled to be published by June 2022.

3. Forms not having any descriptive text. Do not use placeholder text in your fillable fields as the only source of instruction for the field label. Clearly label each field with descriptive text that sits outside of the field property.

4. Text is too small to read. Your text should always be easy to read. Text should have a high contrast against the background and a standard font size that can easily be read without having to zoom in.

5. Images without CTA’s. You shouldn’t rely on images as the only way to access a linked page. Remember to also add a button or link the heading to provide multiple opportunities for the user to explore other parts of your site.

Key Takeaways

If we strive to build a more sophisticated and helpful world wide web beyond January 2022, then inclusion must be a focal point. With the WCAG leading this area of focus, this allows us to have the most robust set of rules and resource materials to take action now so we can improve the overall user experience for those with disabilities. It is up to you to decide what part your organization wants to play in, and we hope you take those steps in making your website more accessible for everyone.