Gerald Angelo is a Senior Solution Engineer at Clarity Partners. Working primarily with Drupal and WordPress websites, he makes the projects both look and operate well on both the front and backend with a focus on User Experience (UX) and Accessibility. In this article, he discusses the importance of making sure your website is ADA compliant, what those standards are, the benefits of doing so, and the tools you can use to assist you in this process.
Why Accessibility Is Important for Your Website
Accessible design accommodates everyone that reads the language a site uses without regard to individual ability. The 2010 United States census  concluded that 19% of the population had a disability of some kind.
If a site is not compatible with assistive technologies, it risks alienating one in five users.
Accessibility Is Not a Burden
Most stakeholders view accessibility compliance of a website negatively. “It’s a hassle.” “It’s expensive.” “It’s not even useful to most people.”
These statements are false. The culprit is actually a lack of planning. If you wait until the last minute to address accessibility, your team is going to be scrambling to make costly changes to the code that may be less than ideal — all to serve a (perceived) small percentage of your users. That’s not the perception to have and that’s not the workflow to follow.
Accessibility should be approached at the beginning of a project, as it greatly improves the usability for all users.
Everybody Can Use Accessible Designs
If you factor in equal access into the basic DNA of your project from the beginning, all other decisions that follow end up benefiting all users.
Consider these real-world examples of accessible design used by everyone:
- A door handle – rather than a door knob — makes it easier for people with a limb difference or an arthritic hand to operate. But it’s also useful for you to be able to open a door with your elbow or knee when your hands are holding grocery bags or an infant.
- The corners of city sidewalks are sloped for wheelchair users, but they are also convenient for dragging your overpacked suitcase to your hotel without having to drop it off the curb on one corner and lift it up the other curb at every crossed intersection.
- Closed captioning is used by the deaf and hard-of-hearing to watch TV programming, but it is also very useful when the audio from a TV is inadequate or inconvenient to the surroundings – be it a gym, bar, airport, or viewing shows on your phone or tablet during your commute.
Much like these real-world accessible designs benefit more than the intended audience, when a site’s design includes accessible features, it becomes a better experience for everyone. Read more in “Accessibility is a benefit” below.
Accessibility Is No Longer Optional
It’s the law. In the United States, the Rehabilitation Act of 1973 and later the Americans with Disabilities Act (ADA) of 1990 strengthened equal access and anti-discrimination prohibitions against people with disabilities.
ADA was first focused on physical barriers in the real world, but has now transitioned to the digital world as the internet has risen to be the leading (or popular) source of communication, education, entertainment, commerce, and news.
Title III deals with “public accommodation”. The precedent has been set that a website is a public space and is therefore subject to public accommodation. The convenience that the internet provides has to be accessible to everyone.
Accessibility Is A Benefit
Assistive technologies are digital devices that interface with your website and translate a usable experience to the end user. Giving a website an intelligent structure, cohesive messaging, and user-initiated actions are part of the best practices for accessibility – which are also foundations of usability.
In short, making a website usable for people with impairments makes it better for all users.
The templating behind your website’s global structure benefits accessibility as follows:
Clear hierarchal structure
- Accessibility need met – Screen readers and text-to-speech assistive technologies can quickly “scan” content without having to consume the entirety of the page.
- Additional benefits – Hierarchal structure connects to the graphic design to convey the order of importance of each item. Search engines properly weight the content of your site.
Color palette provides contrast ratio of at least 4.5:1 between the text and its background
- Accessibility need met – Those with vision impairments do not strain to read text.
- Additional benefits – Text is still legible in less-than-ideal conditions, like an uncalibrated monitor (most monitors are set to whatever the user prefers, not true colors) or a cellphone with glare from the sun.
Font size for body text is 16 pixels or greater
- Accessibility need met – Users do not strain to read text.
- Additional benefits – Helps control line-lengths, which should be 50-60 characters for better readability.
Clear form labels and instructions
- Accessibility need met – Field labels are displayed for each field. Help text is available when invoked. Error messaging provides feedback.
- Additional benefits – Forms are logical and not confusing.
Your accessibility-friendly content yields bonuses as well:
Content is clear and concise
- Accessibility need met – Easy to understand and digest. Acronyms are expanded upon first use, proper list formatting.
- Additional benefits – Better ranking in natural search traffic results. Material is easier to understand.
- Accessibility need met – Images have very descriptive alt (alternative) text.
- Additional benefits – Text loads before images on connections that are temporarily or permanently slow. More relevancy in image searches.
- Accessibility need met – Captioned for the deaf and hard-of-hearing; transcript provided for visually impaired.
- Additional benefits – Users that have trouble understanding quiet passages or accents can still consume the spoken words; poor or confusing audio or video segments are still understandable. Search engines will index the content of a transcript or captions.
- Accessibility need met – Links are descriptive and avoid vague language like “click here” or showing the exposed website address.
- Additional benefits – It’s a very basic and beneficial usability concept to let users know where a link leads before it is selected. Also, search result relevancy.
What Standard Should Your Code Conform To?
WCAG  is the Web Content Accessibility Guidelines standard created and maintained by the World Wide Web Consortium (W3C) as part of their Web Accessibility Initiative (WAI). This is a global body that has considered the equal access laws from all internet-connected countries. Terms like “section 508” is specifically for the U.S., while “Disability Discrimination Act 1992” is Australian and “Zero Project” is Norwegian.
WCAG has three levels A, AA, and AAA – where A is the minimum and AAA is the most comprehensive.
Consider how an error on form submission is handled for each level of WCAG:
- A – The error is identified and described to the user in text.
- AA – The error is identified and described to the user in text; suggestions for corrections are given.
- AAA – The error is identified and described to the user in text; suggestions for corrections are given; a mechanism is available for reviewing, confirming, and correcting information before finalizing the submission.
Ideally, your site should strive to WCAG 2.1 Level AA, with some elements of your site exceeding to AAA, and some of your elements falling short at A. Your site and its changing content should never fall below Level A.
What Assessment Tools Should You Use?
At the beginning of your project, you should use actual people with their own assistive technologies to see where your code and design is failing. Automated and semi-automated tools should be used pre-launch and post-launch of your site.
Like most automated tools, they don’t catch everything. You will get some false positives and find that they miss some obvious errors. They are a good starting point.
Accessible design is great design that everyone can use. When you design for people that need assistance today, you are also perpetuating accessible designs that you will use as your future self, as we are all just temporarily abled.