ADA Compliant Web Design: Accessibility For All

Blog No Comments

“We need to make every single thing accessible to every single person with a disability.”– worldwide famous blind singer and tech advocate Stevie Wonder said at the 58th Grammy Awards in 2016. The Web is no exception as well, and its accessibility is a vital necessity today: it is the year 2020, global pandemic made us stuck at our homes, and even if before everyone was attached to their phones and the web, now we almost became one with our devices. And what about people with disabilities?

What is the ADA?

The Americans with Disabilities Act (ADA) is a civil rights law that protects people with disabilities, gives them equal and fair opportunities, and prohibits discrimination against them in all spheres of public life – jobs, schools, transportation, and all public and private places that are open to the general public. The law was passed in 1990, but the movement started much earlier around the 1950s, when volunteerism and parent-oriented organizations appeared, such as the March of Dimes. But even then the idea of equality was not so widespread and society didn’t think of people with disabilities as individuals with extra needs. These days such a mindset is no longer relevant.

So who is protected by the ADA? Actually, the ADA does not contain a certain list of medical conditions, but it does have a general definition of disability. A person with a disability is an individual suffering from a physical or mental impairment that essentially limits one or more major life activities, having a record of such an impairment, or is regarded as having a disability.

What is ADA compliant web design?

We are living in the 21st century and with the global use of the internet, the ADA is now also intended to apply to our online world in addition to real physical life around. Title III of the ADA is being interpreted to include websites as “places of public accommodation”. Moreover, Article 9 of the UN Convention on the Rights of Persons with Disabilities claims the elimination of obstacles and barriers to accessibility and that applies to information, communications, and other services, including electronic services and emergency services. Thus web design accessibility must be fully recognized and used to ensure this right and to be ADA compliant.

Accessible design implies the ease with which everyone can navigate, understand, and use your website. The focus is on people with disabilities related to hearing, vision, and movement: deaf, color blind, blind, individuals with low vision, mobility difficulties, cognitive disabilities, and others.

To urge designers and developers to implement accessible web design and help them to reach full accessibility for all The World Wide Web Consortium (W3C) created Web Content Accessibility Guidelines (WCAG). The guidelines mention the following four principles. Content must be:

  1. Perceivable 
  • Users must be able to perceive the presented information and it shouldn’t be invisible to all of their senses.
  1. Operable 
  • Users must be able to operate the interface: the interface mustn’t require interaction that a user cannot perform.
  1. Understandable
  • Users must be able to understand the information as well as the operation of the user interface.
  1. Robust 
  • As technologies and user agents evolve, the content should still remain accessible.

If any of these principles are not applied, individuals with disabilities will have major difficulties or will not be able to use your website at all. If your web design is not accessible, It is contrary to the principles of equality. Furthermore, you lose users who are your potential customers, and that means the loss of your profit.

Recommendations for ADA compliant accessible web design


WCAG 2.1 share clear tips for web developers to achieve ADA compliance. Here are some recommendations for your ADA compliant web design:

Contrast ratio matters. It is often difficult for people with visual impairments to read the text which merges with the background. A typical example is movie subtitles. There are moments when the picture becomes so bright that it is impossible to read the text even for people without any vision issues. To solve this problem use a proper contrast ratio. WCAG 2.1 requires the visual presentation of text and images of text to have a contrast ratio of at least 4.5:1, except for large-scale text and images of large-scale text, which needs to have a contrast ratio of at least 3:1. If it is a text or images of text and they are a part of an inactive user interface component, for example, they represent pure decoration or not visible to anyone, then there are no contrast requirements.

Colors? Not important. If your favorite color is green, it doesn’t mean everyone will appreciate it on your website as there are people color blind. Just as traffic signs, the actual picture on a sign is more important than color and it gives you more information about what to do on the road. The same about ADA compliant web design: color itself does not give enough information, so better to pay attention to other accessible design tactics to help your users.

Images to read. All of them must be accompanied by alt tags. Alt tags are the text that interprets the content of all the graphics and can be read aloud by screen readers and audio players.

No mouse, just a keyboard. Some people with limited fine motor control experience difficulties using a mouse. An ADA compliant website should not rely on the mouse and must be operated from a keyboard or with such a tool as speech input.

Audio as texts. Logically, audios are not available to people who have hearing disabilities. What to do in this case? Text transcripts. They make the audio information accessible and it is not hard for websites to provide them.

Some other tips for creating a proper UI design can be found here.

Why is ADA compliant web design the right thing to do for everyone?

Applying ADA compliant web design helps users to fulfill their needs, such as ordering food, getting an education, searching for information, and gaining knowledge. Meanwhile for you, as a web designer or a businessman, accessibility means attracting much more customers. And something that can be a little bit surprising… protection from lawsuits.

The Internet hosts more than 400 million active websites and those websites that do business in the USA are legally required by the ADA to be accessible for all people. Some big companies like Domino’s Pizza, Nike, Five Guys Enterprises were sued because their websites had accessibility issues. Among them was also world-famous Netflix. The service lacked closed captions for a number of streaming videos and was sued by the National Association of the Deaf (NAD). In the end, Netflix had to agree to finish captioning its entire library and was obliged to pay the $755,000 in legal fees to cover the plaintiff’s attorney fees.

According to international law firm Seyfarth Shaw LLP tally, the total number of website accessibility lawsuits filed in federal court in 2019 was 2,256.

In 2019 even a well-known American singer  Beyoncé Knowles faced a lawsuit. Her company, to be exact, was sued over a violation of the Americans With Disabilities Act by failing to accommodate visually impaired users. The suit was filed by a blind woman from New York who claimed that the website was not accessible for people with significant vision impairments.

Although the ADA has been the law for 30 years now, with the development of the internet, we can witness a huge wave of “digital” lawsuits in recent years. And the reasons are often very similar: websites that are supposed to help the public, don’t always provide accessibility for people with disabilities.

As you can see website accessibility has become a trend and necessity. A great help to reach accessibility compliance is the recommendation WCAG 2.1. The guidelines are available to anyone. Web designers can study them on their own, or order a professional website accessibility audit (do not rely on automated ones, make sure you are getting a manual audit). Have a look at this article to get a better understanding of what steps you should certainly take on the way to an accessible website. Once all the issues on the website are fixed, your company will be able to serve the entire audience, make a much bigger profit, and avoid possible lawsuits. That is a win-win solution.

We really appreciate you for visiting PremiumCoding and reading this article! Now you might also want to check out our Themes here.