I take most websites for granted. I can see and navigate most websites without much struggle because I’ve grown up using the web and don’t struggle with my sight or hearing. Unfortunately, not everyone can say the same.
ADA compliance is something that most Americans are familiar with. When considering ADA compliance as a concept, we typically think about accessible doorways, adequate elevators and wheelchair ramps, and distance between retail displays.
However, businesses who have a website are expected to also make sure that their website is accessible to all who view it including those with disabilities. Maintaining an ADA compliant website means that patrons who are disabled in a variety of ways can easily access my business, ordering products or services along with non-disabled individuals.
In recent years, many businesses and celebrities have discovered how vital an ADA compliant website is, and their pocketbooks took the brunt of the failure. The Americans with Disabilities Act was written into law before the internet became a mainstay resource, but has since been updated to include websites as regularly used business resources.
While reading the ADA has issued a guideline that answers the question of what is an ADA compliant website and giving some general directions on how to better build websites to be accessible to people with disabilities, as is often the case with governmental agencies, the language is needlessly complicated.
I believe that making your WordPress or other website accessible for people living with disabilities doesn’t have to be complicated. Moreover, I believe that ADA compliance can be used to enhance user experience for everyone making your websites better for all of your visitors.
While you can easily make a WordPress website like a rockstar, it will take some extra thought to be a rockstar web developer and make those websites compliant to the Americans with Disabilities Act. However, I don’t believe that it is hard to do so, I’ve compiled some information to help you build websites that are more accessible to everyone.
How Does an ADA Compliant Website Help People?
When I visit a website to buy a product, I can see the products offered. Adding alt descriptions to that product photo allows third-party assistive programs to communicate the visual into words to help blind customers understand what they’re ordering.
If I visit a website with a video that shows how a product is used, I can choose to listen to the audio, or turn on subtitles and read them instead. Someone who is hearing impaired doesn’t have the choice and must rely on the subtitles. If a site chooses not to offer subtitles, they’re creating an unnecessary roadblock to hard-of-hearing customers.
Similarly, I can view most texts on my phone or computer without much difficulty. However, those who are vision-impaired may need to zoom in on the fonts or view them in different colors to read them. If your website cannot zoom or has overly fine print, or the colors are hard to see, people won’t spend the time trying to adapt.
How Can I Adapt to ADA Regulations
Some of the steps to ADA compliance are simple shifts in how you do the things you’re already doing. Consider the difficulties a patron with a disability might have in a physical location and then adapt your website in similar ways.
Review Requirements
Knowledge is power. Once you’ve reviewed the requirements of an ADA compliant website, you’ll notice features on other sites that you didn’t see before.
A case of the Baader-Meinhof phenomenon. will follow you to your site. When I work on sites, I’ve noticed it’s become second nature to make little subconscious adjustments to my coding to make that site more user friendly.
Science says that you’re more likely to see a new word more frequently if you’ve recently learned it and use it in context. Writing web content and building sites follows the same trend. If you’ve recently discovered a new tool or resource, you’ll use it and identify it in other works more efficiently.
Some of the key requirements for an accessible website are:
- Descriptive text for image elements
- Including transcripts of video and other multimedia
- Ability to adjust the color of the website and text for better visibility
- Alternative options for PDF downloads
- Avoiding blinking and flashing elements
- Using descriptive headers
- Reduced reliance upon auto updating features
- Use of a skip navigation button for those with screen readers
- Reduced use of video and multimedia
Run An Audit
There are several resources available to help you understand where your site could improve and what you’re already doing well. I like to use free resources to get an idea of my needed improvements before investing in more costly options.
Google Chrome and Firefox browsers offer an extension tool to search for missing alt tags, problematic styles, etc. It’s called the WAVE Web Accessibility Tool, and it can be installed on your browser tab. WAVE also offers more advanced accessibility tools for a small cost and can help you further your accessibility efforts.
The Bureau of Internet Accessibility also offers its own free automated ADA accessibility review on their website. All you need to do is submit your site’s URL, and let the tool browse it. You’ll get a full report of compliance failure points to work on and resources to improve your overall score.
Descriptive Alt Text
When I upload new posts to my blog or offer new resources, I ensure that all of my images are given descriptive alt text. This is a massive step in the right direction because it provides assistive technology a baseline to start adapting your site for its users. Further, you can use your descriptive alt text as additional space for your SEO to capture searches.
For many sites, alt text is simple: “Image of ice cream on a blue background,” for an ADA aware website, you could see something more complex and useful: “Image of Tillamook Creamery Monster Cookie ice cream on a chocolate-covered waffle cone, with rainbow sprinkles in front of a blue backdrop.”
Website Elements – Buttons, Headings, Hyperlinks
Another step you can take is to consider the ease of viewing your templates. If your colors are bold, or you have flashing buttons and wildly colored text, this can be difficult or painful for some people to view.
Consider that flashing lights can trigger seizures in some of your potential clients, and leave those kinds of design features in the 90s. Similarly, I avoid websites that use small or light text on a light-colored background. It’s difficult for me to see with my relatively good vision. I can’t imagine how hard it can be for those with vision impairments.
Being mindful of a website’s hyperlinks and what colors they shift to before and after use can help someone find them later if they’re a color that they can easily see or assistive technology can find.
Failure to Comply – What Happens?
While there are many problems that you can run into when you make some of the simple WordPress development mistakes, if you develop a website that isn’t ADA compliant for your client, it can cause them expensive problems.
Businesses like Foot Locker and Kylie Jenner Cosmetics have a rather intimate experience with a failure to comply with ADA regulations on their website, and it’s cost them. Each of these businesses, and several others, were sued by patrons who felt they were not making an adequate effort to make their online presence accessible to those with disabilities.
While the Department of Justice is typically the legal entity who is authorized to act to enforce the civil liberties of persons with disabilities, compliance is typically enforced by way of lawsuits.
In the lawsuits, the businesses lost money and damaged their reputation. While large companies can easily handle the fees associated with a lawsuit due to a lack of compliance, smaller companies could easily be crushed under the weight of legal fees and when building an ADA compliant website is so simple, why take the risk.
ADA regulations affect businesses with more than 15 employees and operate more than 20 weeks in a calendar year. Small businesses are the most at risk for substantial damages due to lawsuits because they often don’t have the financial resources to shoulder a significant burden.
A website that is hard to view and that users struggle to fill out forms or make purchases decrease your possible sales potential. By opting not to make changes to accommodate, you’re ostracizing an entire demographic of potential paying customers.
Furthermore, a well-designed website with ADA considerations will rank higher in search engines naturally. As part of Google’s website image best practices, they expect images to have alt text to be made more accessible for their users. While Google hasn’t specifically said that image alt text will improve your rankings, the highest ranking sites tend to follow Google best practices.
Further, fines for failure to comply with ADA regulations in a large business website could land you up to a $50,000 bill, depending on the state your business is based in. I know that I wouldn’t want to account for that kind of loss over a simply fixed issue. First, writing a website to comply with ADA regulations may seem daunting; editing and adjusting an existing website will take time. However, once you’ve got the current content adapted for accessibility, all future content will be easy to keep compliant with mindful design steps.
Many of the steps described above to create a compliant and accessible site are second nature to competent content writers and web designers. These skills are taught from the start in most college courses in the industry.
508 Compliance
508 compliance is part of a 1973 congressional act called the Rehabilitation Act of 1973. This act was amended once in 1998 and again in 2017 to update section 508, which requires agencies to give people with disabilities (both employees and members of the public) access to electronic and information technologies. This access must be comparable with the access given to those without disabilities.
Section 508 of the Rehabilitation Act of 1973 is managed by the U.S. Access Board. In 2017, the board issued a rule that updated the accessibility standards. These standards not only affected Section 508 but they also affected Section 255 of the Communications Act. These rules have been in effect since 2018.
This new rule changed both sections in response to market trends and technological innovations. The rule was also made to help bring American guidelines into harmony with those set forth by both the European Commission and W3C’s Web Content Accessibility Guidelines, also known as WCAG 2.0.
508 Compliance Guidelines
There are a number of different guidelines written in Section 508. We will look at the ones that are most relevant to building accessible websites.
Functional Performance Criteria
Section 508 has specific functional performance criteria that all those who disseminate electronic communication should follow. These guidelines can be found in Chapter 3 of Section 508.
Electronic Content
The electronic content section of Section 508 of the Rehabilitation Act of 1973 has been amended to state that electronic content should conform to WCAG 2.0 Level A and Level AA success criteria.
Level A Success Criteria
- Controls and inputs must have a name that describes its purpose
- Time-based media that is not text-based should have a text alternative that gives the user descriptive information about the content. Nontext-based time-based media are things like audio clips or videos.
- Any tests or exercises that use non-text content, like images or sounds, to create a specific sensory environment should have a text-based alternative to give all users the same experience.
- When using CAPTCHA there should be a text-based alternative or an alternative method of CAPTCHA that works for people with all manner of different disabilities.
- When using decorative non-text content, like formatting or invisible elements, they should be implemented in a way that assistive technologies (screen readers or other devices) can ignore.
For more information about Level A Success Criteria, please see the WCAG 2.0 Guidelines.
Level AA Success Criteria
- Large-scale text and images of text should have a 3 to 1 minimum contrast ratio.
- The minimum contrast ratio for the presentation of text and images of text should be at least 4.5 to 1 except as otherwise indicated.
- Text or text-based images that are decorative do not have a minimum contrast requirement.
- Logos and branding text are also not required to have a minimum contrast ratio.
- When using images of text it is preferable to use actual text to convey the information.
- If using images of text to convey information they should have the ability to be visually customized to the user’s requirements.
- If the text-based image is essential to the conveyed information it does not need to be transferred into text. For example, logos.
For more information about Level A Success Criteria, please see the WCAG 2.0 Guidelines previously linked.
ITC Two-Way Voice Communication
Since a number of websites, especially in this post-Covid pandemic age, have started to institute web-based chat functions including voice chat, I felt it important to include some of these requirements as well. Two-way voice communication is dealt with in-depth in its own section in Section 508.
Assistive Technology Devices That Help With Web Browsing Subjective Regulations
ADA Compliance with websites is still a fluid concept. The details on the regulations are outlined and subject to state-by-state interpretation. However, as web resources become more frequently used, the rules will begin to stabilize over state lines.
With Simple Programmer, I work to teach best practices for my readers to prevent the scramble of adjusting things later. I follow trends and work to learn the newest methods to keep our readers on top of their game.
Building an ADA compliant website is relatively simple. Keeping ADA compliance in mind when you’re building will keep you ahead of the pack and add to your reputation as a skilled web programmer.
