ADA Website Compliance Testing: What to Look for on Your Site

In today’s age, technology has made information and entertainment more accessible to people in all parts of the world. Whether it’s on a phone, tablet, or computer, a user is able to view photo galleries of cats or read articles about current affairs or stream an endless number of videos. So what happens when a user is not physically capable of accessing information? How do you cater to users with special needs? Well, you can thank the Rehabilitation Act of 1973 for allowing technologies to benefit people with disabilities.

In 1998, Congress amended the Rehabilitation Act to require federal agencies to make their electronics and information technology accessible to people with disabilities. It was enacted to eliminate barriers in information technology, to make available new opportunities for people with disabilities, and encourage development of technologies that will help achieve these goals. This pretty much states that agencies and companies must give their employees and members of the public with disabilities access to information that is comparable to the access available to others.

You may have noticed that the law refers to federal agencies, so you might be thinking, “Well, this a federal issue -- how does this relate to a private business website, or how am I affected by this law?” Websites are now considered public entities since any user can access them via a computer or any other device. Think of this as a building requiring wheelchair-accessible ramps. The same basic principle applies to websites or any other technology.

Now you are probably wondering, “How do I make my website accessible? What am I looking for in terms of making my site accessible?” Even though there are great guidelines (such as WCAG 2.0) and documentation on how to make your site accessible, rarely do they discuss what to look for on a site to make it more compliant for people with disabilities. After reading this blog, hopefully, you will have a bit more of an understanding of what to look for and using both automated and manual testing to make your website more accessible.

ADA-compliant website test: What should I look for? 

As testers, we need a better understanding on what it means to make your site ADA-compliant. You have to consider the needs of people with disabilities, which can include the following:

• Visual Impairments: This can include blindness, various common types of low vision and poor eyesight, various types of color blindness.

• Motor/Mobility: This includes difficulty or inability to use hands, tremors, muscle slowness, loss of fine muscle control due to conditions such as Parkinson’s Disease, muscular dystrophy, cerebral palsy, stroke.

• Auditory: Deafness or hearing impairments, including individuals who are hard of hearing.

• Seizures: Photo-epileptic seizures caused by visual strobe or flashing effects

• Cognitive/Intellectual: Developmental disabilities, learning disabilities (e.g., dyslexia, dyscalculia, etc.) and cognitive disabilities of various origins, affecting memory, attention, developmental “maturity,” problem-solving and logic skills, etc.

So when it comes time to do accessibility testing, what do we look for? How can I, as a tester, determine whether something is an accessibility issue or not? While it would be best to ask the people with disabilities directly, budget and time constraints can prevent firsthand feedback. A second approach is to emulate some of these disabilities and use other automated testing platforms to determine where the site needs ADA compliance.

Before we get more into manual and automated testing, let’s focus on what we are looking for when it comes time to address and implement ADA compliance for your website. Keep in mind though, that these methods may not work for all testers personally, but it’s a good way to approach accessibility testing:

• Visual: Use a screen reader to help you navigate the site. Users who are blind must be able to understand any element on the site where they land and if it contains functionality such as a link. Several ways to emulate this are to close your eyes or turn your monitor around and navigate the site using the keyboard. If, you as a tester, land on an element and a screen reader cannot make sense of what the element is, that is an issue of ADA compliance. For users with poor vision or colorblindness, testers have to make sure colors are distinguishable, and these can include background colors, link colors, font colors, etc. Screen magnifiers are a great way to test for poor visibility. There is a great tool known as Color Oracle that can emulate what a user with colorblindness sees on the screen. If colors can’t be distinguishable, that is an issue of ADA compliance. Make sure text alternatives are provided to images that convey information (look at the alt tag on the code).

• Motor/Mobility: Voice recognition software, touch screens, head/mouth wands, special switches, keyboard overlays, one-handed keyboards, oversized mouse or trackball are some of the tools a user with limited mobility may use, but for testers, all you’ll need is a traditional keyboard to test. Ensure that there is a logical tab order (left to right, top to bottom) and provide logical and standard keyboard commands. Tab through the site and visually see if the tabbing order is logical (usually known as OnFocus). If an element is skipped or the tabbing order doesn’t make sense to you as a tester, that could possibly be an issue of ADA compliance.

• Auditory: The best approach for testing for this criterion is to turn the volume off on your machine and look at the website. This is mainly to focus on audio media elements such as videos. Do video elements contain captions, text transcripts, or a description of what the video contains and the purpose of the video? If the captions or text transcripts are not added to the video or the description of the video does not make sense, this can be an issue of ADA compliance.

• Seizures: Users who suffer from seizures are usually triggered by viewing images or video content showing strobe lights or repeating bright lights. Avoid these as much as possible. If an image (gif) or video is showing strobe lights or similar effects, remove these from your site.

• Cognitive/Intellectual: Make sure the content on your website can provide simple and clear instructions and contains an intuitive interface design. The site must use consistent UI elements and prominent icons to make the site easier to navigate. Whenever possible, the content should not contain jargon or large blocks of text, since people who have this disability have a hard time understanding, and avoiding these allows them to consume the information and commands easily. Reading aloud with simultaneous text highlighting, predictive or auto-text for input fields, and adjustable time for completing site tasks are also factors a tester should look for.

Manual and automated testing: The two best friends any tester should have

When Section 508 compliance was first implemented, testing for accessibility was a very time-consuming process. Manual testing is performed by a tester sitting in front of a computer carefully going through pages, trying various usage and input combinations, comparing the results to the expected behaviors and recording their observations. Most testers had to rely on manual testing since not many automated testing platforms were available.

But in recent years, automated testing tools have become more available and even more sophisticated. Automated testing platforms, such as Siteimprove and Tricentis, can now crawl a site and use visual indicators to detect which issues might need to be addressed on your site for accessibility. Testers can set test criteria based on the level of compliance (Level A, AA, and AAA) they are trying to achieve on a site. Automated testing software can reduce test times and vastly increase test coverage.

Even though automated testing is a great tool any tester can have, there are still some issues that even the most sophisticated testing platforms can’t detect. Automated testing platforms are not able to detect how a screen reader relays the content to the user, how the page navigates using the keyboarding (tabbing through the site), alternative text that is inadequate (automated tests are just checking to make sure you have something in the ALT text field), certain color combinations that fall outside acceptable ratios for contrast, and videos that are uncaptioned or do not contain text transcripts.

Automated testing also tends to find too many false positives, indicating something is wrong when your website does not actually need any more work. Performing manual tests on the code and pages allows testers to identify the issues that automated tests cannot detect. The solution is always a mix of manual and automated testing. Always perform both for best results, and to ensure that you meet the level of ADA compliance needed for your site. Think of it this way: automated testing is a great start, and will help you determine where there’s a need for manual testing. Both are extremely important and, if performed well, can make your site more user-friendly for all users.