ADA Compliant Website: The Ultimate Guidelines

Our guide provides a comprehensive overview of the Americans with Disabilities Act (ADA) for accessible design and its significance for your organization’s website. We’ll explore the essentials of creating an ADA compliant website, ensuring it meets all necessary standards for accessibility. This ensures not only compliance with legal requirements but also enhances user experience for people with disabilities.

What is ADA (Americans with Disabilities Act)?

Website requirements for accessibility can be traced directly back to the ADA, which was first passed in 1990. This was a civil rights law designed to mandate equality for all Americans with disabilities – equal access to services and employment, among various other requirements. It also banned any discrimination against people with disabilities and required businesses to make reasonable changes to help those with disabilities. If you’ve walked into a lobby and seen wheelchair ramps and stairs for equal access, that’s likely the ADA at work. The ADA requirements are enforced by the U.S. Department of Justice (and the legal system, which we’ll talk more about below).

The ADA is divided into several sections of “Titles,” each designed to focus on different United States entities and their requirements. For most organizations, the applicable section is Title III, a.k.a Public Accommodations. In summary, Title III of the ADA states that public accommodations with over 15 employees must make “reasonable modifications” to their operations so that people with disabilities can use them. But what counts as places of public accommodation? The ADA gives a variety of essential examples of privately owned, leased, or operated facilities, including:

• Hotels
• Restaurants
• Retail stores
• Doctor’s offices and clinics
• Golf courses
• Private schools
• Daycare centers
• Health clubs
• Sports stadiums
• Movie theaters

As you can see, the definition of public accommodation is broad enough to apply to most growing organizations in the United States, outside of small sole proprietorships, etc. It also applies equally to nonprofits and similar organizations. Meanwhile, the other Titles address different cases:

• Title I: This section deals with equal employment. It mandates that all employers must provide reasonable accommodations to applicants with disabilities.
•  Title II: This section addresses state and local government services, prohibiting discrimination against individuals with disabilities and requiring that all government services be accessible regardless of disability. This is also an essential section for any organization that may need it. It also helps clarify the important Section 504 of the Rehabilitation Act of 1973, which mandates accessibility for federal government services and related government contractors.
•  Title IV: This section focuses on telecommunication companies, including phone and internet services. These services are seen as so crucial for communication that they are required to provide certain kinds of accessibility for those with hearing or speech disabilities.
•  Title V: This Title clarifies the Act and how it applies to various situations, other laws, cases of immunity, related fees, etc.

Now, let’s examine why ADA website compliance is necessary.

Why the ADA Affects Websites

If you look at the original requirements of the ADA, much of it applies to buildings and how organizations offer real-world services. So, how did the ADA come to apply to websites?

Like many laws, the ADA has changed over time and has been affected by several court rulings. For example, there was an essential phase around the early 2000s when the Supreme Court made several rulings severely restricting what counted as a disability (Toyota Motor Manufacturing, Kentucky, Inc. v. William, Sutton, et al. v. United Airlines, Inc., etc.). After years of requests by representation groups, this eventually led to the ADA Amendments Act, which was signed into law in 2008 to clarify and expand what a “disability” is.

Smaller court rulings can also impact how the ADA is interpreted for specific situations. Over time, websites have become increasingly important to the organizations running them and the people using them. Eventually, the legal system had to start deciding whether websites count as public accommodations.

To an extent, this is still a gray area with different opinions and an assortment of case law – but the consensus is growing that websites are so important in today’s world that the ADA covers them. Court rulings have been particular about websites connected to a brick-and-mortar store or business, in that decisions people make on the website create a real-world transaction.

What sort of disabilities may make using a website more difficult? The ADA specifies physical and mental impairments, many of which can affect online browsing. Common examples include:

Visual impairments	This includes various forms of blindness, color blindness, inability to see contrast, and difficulty reading text on a screen. People with visual impairments can use the internet, especially with assistive technology such as screen readers.
Hearing disabilities	Those who cannot hear or easily understand speech will have trouble listening to online videos, podcasts, and other audio content.
Mobility disabilities	These disabilities, including neurological conditions, nerve damage, amputation, and so on, can make it difficult or impossible to use a mouse, a keyboard, or both.
Learning disabilities and similar conditions	Conditions such as ADHD or dyslexia can make it much more difficult to understand certain kinds of digital content or designs.
Temporary disabilities	For example, someone who broke their arm will be unable to use their keyboard and mouse in the same way while they are healing – or those who forget their glasses may need website text to be much more prominent before they can read it.
Disabilities that come with age	This can include arthritis, loss of vision, and other conditions that can make browsing the web difficult or painful.

State and Local Laws

The ADA is a federal law, and many organizations may also have questions about state laws that affect accessibility. These laws do exist, but they can vary from state to state. Most are similar to Section 508 regulations on the digital front and are primarily concerned with government websites. In states like Texas, accessibility standards focus on building codes and permits. States like California and New York have specific legislation requiring additional website accessibility.

The ADA clearly states that state laws complement the ADA and cannot replace it. However, states can add more definitions of disabilities or extend compliance to additional entities and create penalties for violations in addition to federal penalties.

Why ADA Compliance is Good for Business

ADA compliance can quickly start to sound like a large project, especially for older websites or sites that have never been updated with accessibility in mind. However, it’s important to remember that ADA compliance includes plenty of advantages for all website visitors, which can improve website performance. That’s especially true for business websites created to get more leads or facilitate sales. Let’s look at why customers of all kinds like ADA compliance.

• Accessible websites are easier to navigate. Visitors appreciate their clear menus and layouts that make finding exactly what you’re looking for simple. Combined with best practices and decluttering steps with accessibility, this can help lower bounce rates and other negative web traffic indicators.
•  Sites become easier to use on mobile devices. More people than ever are using their mobile devices to make buying decisions, and accessibility enables mobile and touchscreen use without creating optimization problems.
•  Accessible sites are easier to read. The text flows well, doesn’t overwhelm visitors, and is categorized into different sections. Font and language choice support quickly finding the information you’re looking for.
•  Colors complement each other well, making the website pleasant to look at. There are no distracting design choices, only helpful visuals.
•  Visitors find web forms, blog posts, and product pages easier to understand. They are more likely to fill out information and use CTAs, leading to improved response numbers and sales.
•  Accessible websites are often easier to use for those who may have slow or spotty internet connections.

Additionally, website accessibility will increase the number of potential customers for your site and give you an advantage against similar competitors that don’t have accessible sites. That can be a significant advantage for specific businesses: The CDC estimates that around 1 in 4 Americans live with some disability, with percentages rising in the southern states. Those with disabilities also often form tight-knit communities that share businesses and websites that are particularly easy to use.

How to reduce legal risk?

Did you know your website is a potential source of liability issues? Online liability can increase the chances of your organization facing a lawsuit and potential government fines for failing to meet specific requirements. That’s especially true of the ADA, or Americans with Disabilities Act, which requires many websites to comply with accessibility standards.

Why Ignoring ADA Accessibility is Dangerous

Ignoring ADA compliance creates two notable risks. The first risk is a direct fine from a state or federal government. Federal penalties can be as high as $75,000 for the first violation and twice that for repeated violations. Public records will also indicate that the organization was at fault. As we mentioned, website compliance isn’t explicitly cited in the ADA standards, and the federal government is currently doubtful of pursuing any ADA fines for websites alone. Still, state governments are more willing to apply penalties like this.

The other risk is the possibility of a lawsuit over website compliance. This has become a particularly thorny issue in the early 2020s, with an astronomical rise in the number of website accessibility lawsuits being filed in specific courts around the country – 64% growth in the first half of 2021 alone, according to reports. With thousands of lawsuits being filed yearly, the number of businesses at risk of this has grown exponentially. Some point to the decisive 2016 case where Domino’s Pizza was successfully sued by a blind man (who couldn’t use his screen reader app to order pizza online) as the start of this trend.

However, many of today’s current lawsuits appear aimed at quick settlements more than creating lasting website accessibility. The suits often cite problematic website audits and error reports, which we will discuss more below, without an in-depth analysis of a site’s usability. While website owners or businesses have successfully fought back until these suits have been dismissed, that takes time and money, which only some companies may have.

The best defense against such lawsuits is to remove liability issues altogether. That means a complete website update that fixes notable accessibility problems and creates a lasting format for future accessibility, so there’s insufficient evidence to make a lawsuit worth filing. But how do organizations know how to update a specific website? That’s where the WCAG (Web Content Accessibility Guidelines) become very important.

The ADA and WCAG (Web Content Accessibility Guidelines)

Laws like the ADA don’t go into much detail about accessibility, but they often refer to widely accepted standards. For websites, that’s the WCAG, an internationally recognized body of standards and “success criteria” for ensuring web accessibility. The WCAG is periodically updated on website technology and the latest devices. It’s currently on WCAG 2.1, with plans to update to WCAG 2.2 in 2022.

While the WCAG provides many examples of what individuals with disabilities should be able to do on a website, the guidelines are founded on four fundamental pillars of usability, a.k.a. POUR:

• Perceivable: This means that websites should be perceivable to the senses, including individuals with disabilities. Content should be available to more than one sense to help compensate for senses people may be lacking. The visual text should be friendly for audible screen readers. Visible captions or alternatives should supplement the audio. We can’t do much about the sense of taste or smell online, but multiple inputs (keyboard controls, different cursor devices, touchscreens) should be supported for the sense of touch.
•  Operable: Can an individual with disabilities use the website? There are many ways to interact with sites. Menus, internal links, buttons, keyboard shortcuts, and many other options exist. These options should all be usable by those with disabilities. That means they should be easily accessed by a keyboard or touchscreen and large and clear for easy pointer access. It also means avoiding timers blocking content options after a particular time and ensuring menus and navigation options are consistent throughout a website.
•  Understandable: Users may be able to perceive content, but that doesn’t always mean they can understand it. The content itself should be readable and clear. Those with trouble focusing or learning disorders should be able to understand what is being said, especially when it comes to instructions. Information should also be consistent, using the same phrasing and design throughout the site to avoid confusion. It’s also advisable to avoid industry jargon and technical terms where possible and provide a glossary if necessary.
•  Robust: If a website is strong, it supports a wide variety of user agents, including assistive technologies and other means that those with disabilities use to access websites. It also means that the website is coded to remain friendly as assistive technology evolves in the future – or as much as possible, based on where technology is headed.

Choosing the Right WCAG Levels

Look through the WCAG standards, and you’ll see they are divided into three levels of compliance – A, A.A., and AAA. This allows governments and other bodies to specify just what level of accessibility a website needs. While it may seem complicated at first glance, it’s a relatively simple system that works like this:

• A: This is base-level conformance that broadly means a website is usable. It’s very easy to meet and rarely enough to fulfill compliance requirements. There needs to be more than level A to satisfy the ADA.
•  A.A.: The level AA conformance includes additional standards to help make sites more accessible to those with disabilities. This is the standard that most businesses should aim for compliance, and most of what we discuss in our guides comes from A or A.A. conformance.
•  AAA: AAA is the highest level of conformance and is rarely required for organizations by law. The common exception is government services that need maximum accessibility. AAA conformance may include ensuring extra-large button” targets, including sign language support for audio files and more.

What ADA Compliance Looks Like on a Site

We’ve looked at how the ADA works, why it affects websites, and how the WCAG provides the necessary guidelines for what a site needs to do. Now, let’s look at ADA compliance for the average website. These are examples of accessibility components compliant websites should have (or similar alternatives).

• Captions and subtitles for video content: Those with hearing problems may not be able to hear videos, and even those without disabilities may prefer to watch without the sound on. That’s why ADA compliance includes captions and subtitles for those videos. Full transcripts are also good for interviews or videos with lots of information. You can also have these options when posting videos on platforms like YouTube for an added SEO(search engine optimization) benefit.
•  Transcripts for audio content: Podcasts and other audio files also benefit from transcripts if they contain personal information. The reverse may also be true in some cases. An audio description should be included if a screen reader can’t access non-audio content. In general, avoiding the use of images of text is a good idea if a screen reader can’t perceive them.
• Images with alt text: Alt text on images is crucial for web accessibility, as it ensures that users with visual impairments can understand the content conveyed by images. Screen readers rely on this text to describe images, making websites navigable and informative for all users. Additionally, alt text improves SEO by providing context to search engines, enhancing the site’s visibility and usability.
•  Easy text resizing/magnification: Websites should support native text resizing while ensuring readability. That means when using keyboard commands to magnify a site, etc., the text should automatically adjust so everything is clear to read. Specific limits may vary, but ensuring text size works up to 200% is a good idea. This can also improve your site on mobile devices where users of all kinds may be magnifying content to read.
•  High contrast ratios: Color contrast refers to how different two or more colors are. Colors that are too similar in contrast may be complex to tell apart for users with specific vision problems or those with night modes and low brightness settings. This is especially important for text and backgrounds but applies to menus and targets like buttons. The WCAG indicates a minimum of a 4:5:1 contrast ratio in these cases.
•  Sitemap, site search, and clear menus: These are also vital parts of website navigation and can save those with disabilities (and others) a whole lot of time on your site. There should only be one way to access a part of your website if necessary. It’s also a good idea to go through these elements and ensure they are simple, logical, and easy to spot.
•  Full support for screen readers: Screen readers don’t just read all available text on a webpage. They can also read descriptive tags that show specific website elements or their purpose. That’s vital for users with certain visual disabilities to understand what web forms are for, what a CTA button does, and much more. These tags can indicate what kind of content is coming up, what exactly navigation buttons do, and so on – but they need to be correctly inserted and confusing terminology replaced where appropriate. There are several ways to do this, but one of the latest solutions is to use the inherent flexibility of HTML5 to insert tags and explanations wherever needed.
•  Full support for keyboard navigation: Have you ever tried navigating a website entirely by keyboard? Accessible websites support quick navigation using primary keys like Tab and Shift, which cycle through menu options and all other essential operations. This functionality needs to happen clearly and logically, and many accessible sites also add helpful features like a popup “skip” button to get to the most critical information when using a keyboard. It’s also essential to avoid keyboard traps where users can’t return to the menu using only a keyboard. Since many keyboard users have shortcuts for website navigation, sites must also avoid using unique shortcuts that interfere with these.
•  Visible focus support: A “focus” is what part of a website is currently selected to interact with. If a Submit button is the focus of a webpage, clicking it or selecting Enter will activate that button. Both keyboard users and mouse users with disabilities can significantly benefit from a clear website focus so that they always know what’s being highlighted. If you look at highly accessible websites, you’ll see that when menu options or buttons are focused, they significantly change – changing color completely, appearing with a clear border around them, etc. This helps everyone navigate more easily.
•  Clear and descriptive hyperlinks: Hyperlinks in text should always be evident to users. Keyboard navigation should include the ability to cycle through them, and their contrast should make it clear exactly where you need to select to choose the link (and that it has been determined). The anchor text should also be very descriptive of what the link does and what content it will offer users.
•  Auto filling and error suggestions: Certain disabilities can make it challenging to fill out web forms, especially if many forms ask for similar information (think about entering your address multiple times when filling out credit card information). Accessible websites support auto-filling (often offered by browsers) to make these steps more accessible, as well as error correction that pops up with automatic correction options, so users don’t have to fill out the form again.

Many other examples include offering different modes on your website that make it easier to use, making your site work with landscape touchscreens, and including an accessibility policy page. What’s required for your site will depend on its size, how much content is on the pages, if the website enables transactions and other unique aspects.

How to Make ADA Changes to a Website

How does your site get from point A to point B for ADA compliance? There’s no single way for most success criteria listed in the WCAG: There are multiple options for various web design approaches, including ARIA, HTML, CSS, Silverlight, and more. There’s no single “right” choice for every website, but some options are more robust than others when considering the future of the internet and related technology.

This allows web developers to study how a site has been created and which options are best for implementing accessibility efficiently. Sometimes, the website’s existing code can be easily modified to include necessary features. In other cases, developers may recommend significant changes to how the website has been created, and organizations may want to consider choosing an entirely different design or approach.

Where Does Your Business Begin with an ADA Update?

When making these decisions, starting with a website audit is common. This can be accomplished with automatic auditing tools like Axe, Dynomapper, Remediate, Wave, etc. These tools generate reports indicating where it looks like there are accessibility problems (missing tags, etc.) and can even visually pinpoint where these problems are on a page. But this is only a starting place: There are accessibility issues that tools can’t catch, and an automatic report can’t choose the best way to address a problem.

This is where web developers must do a complete site examination and help organizations find the best ways to meet ADA compliance. The time an update takes depends on the website’s size, what the site needs to do, and what kind of content is on the site. For larger projects, this is also a good time for organizations to make other changes they want to make to their websites, and it can be easier to budget all changes under one umbrella.

Organizations sometimes must choose different colors, font styles, images, and logos for their site to meet accessibility goals. In this case, it’s often helpful to bring in a graphic designer or similar expert to help make new design decisions and ensure your website will look its best. If you are handling design in-house, various tools help you choose color schemes with high contrast, proper fonts and text spacing, use of white space, and much more.

Key Takeaway

Achieving ADA compliance for your website goes beyond legal requirements; it ensures equal access to information, a fundamental right for all. This encompasses a thorough understanding of the ADA’s impact on digital accessibility for individuals with disabilities. With practical advice on making websites user-friendly and insights into legal aspects, the guide also explores the benefits for businesses and delves into WCAG standards. It’s a vital resource for those looking to integrate ADA principles effectively in web design and development.

Blue Atlas Offers Expertise in Crafting ADA Compliant Websites

Are you looking for help with your ADA update? Sometimes, compliance projects are too large to handle without a partner, or completing updates ASAP is essential. In cases like these, contact Blue Atlas to discuss your website and accessibility goals.

Our experts can help do a complete site examination using the latest tools, so you know exactly what needs to be done. Our web developers are experienced in making accessibility updates when you are ready to begin, and our agency is happy to help your organization make decisions about new colors, logos, and other essential design elements. Accessibility compliance doesn’t have to be tough – we’ll help make it easy!