What is a Website that is ADA and WCAG Compliant?

What is the ADA (Americans with Disabilities Act)?

The Americans with Disabilities Act (ADA) became law on July 1, 1990. The ADA established that discrimination is prohibited against individuals with disabilities in all aspects of "public accommodation", including jobs, schools, transportation, etc. The aim of the act is to ensure that everyone has equal rights and privileges.

The ADA's passing brought a new legal cottage industry that used the judicial system to keep companies liable for complaints and lawsuits. Many of these legal acts were legitimate. Some were only used by lawyers to make easy money. In the US today, cases like this have been increasing as more and more people claim that websites and mobile apps violate the ADA.

Although the ADA was passed in 1990, which was before the internet, it was intentionally designed to evolve. As technology advances, the meaning of the notion "public accommodation", also expands. In 2010, the U.S. DOJ passed the American with Disabilities Act Standards for Accessible Design, mandating that all information technology and electronics, like websites and mobile apps, be accessible to individuals with disabilities like vision and hearing impairments. Websites and mobile apps are now essential public places to shop, share, learn, enjoy, and connect, and therefore are protected by the ADA.

What kinds of businesses are required to comply with the ADA?

These businesses are required to comply:

Businesses with at least 15 and up employees that operate for 20 or more weeks every year.

Compliance is also required for businesses that fall under "public accommodations." This includes physical and digital accommodations. Examples are hotels, restaurants, public transportation, etc.

If you disagree that you are compliant, but your business falls under the two categories above, then consult with a disability lawyer to know your options.

What is WCAG Compliance?

The Web Content Accessibility Guidelines (WCAG) are the World Wide Web Consortium’s (W3C) recommended guidelines for the web. They are not federal laws or legal requirements.

The ADA doesn’t offer a set of guidelines for the web, but the WCAG does.

The WCAG has four principles:

• Perceivable

• Operable

• Understandable

• Robust

Perceivable

Elements of the Information and user interface must be presentable to users in ways they can perceive.

• Provide alt text for non-text contents.

• This implies that users have to be able to interpret the provided information (which may not be invisible to all their senses).

• Create material that can be viewed numerous ways without losing sense, including by assistive technologies.

• Make it easy for consumers to see and hear content.

Operable

UI components and navigation of the user interface must be easily operable. This implies that the interface must be operable by users (the interface cannot require interaction that a user cannot perform).

• Make all features accessible from a keyboard.

• Giving users enough time to read the content and use it.

• Do not use content that causes seizures.

• Help users easily navigate through the contents.

Understandable

The user interfaces’ information and content must be easy to understand. Make the content predictable and readable.

• Make text readable and comprehensible.

• Having content appear and work in predictable ways

• Help users prevent and correct errors.

Robust

Content needs to be versatile and robust enough that a wide range of devices and platforms can view it reliably.

• Maximize compatibility with current and future user tools.

Meeting these requirements increases the website's accessibility to people with visual or hearing disabilities or those with cognitive, language, or intellectual difficulties.

Parts that are crucial for Website Accessibility:

• Navigation links, active/focus state

• Electronic Forms.

• Sliders, Images, and galleries

• Video and audio.

• Tables and iframes

• Maps, graphs, and infographics

• Text fonts, sizes, and color contrasts

• Page structure and organization

How Do I Develop an Accessible Website?

Basic guidelines for accessibility begin with the visual user interface. Typically, these are the simplest to address first. It is necessary to always test any new change in design and continue to educate yourself about WCAG updates.

A good place to start is with the following WCAG2.1 recommendations:

Use of Color

• Avoid color as the only alert message. For example, forms that state "Required fields in red" need an alternate way to show a required or incorrect field for people who are colorblind or those who use a screen reader.

• Test foreground and background colors to see if they can pass tests for color contrast. There are many free apps and websites available that help you select suitable contrasting color palettes.

• Avoid a light gray color for text.

• For buttons, the text inside must contrast against the background color.

Links

• Color must not be the only way to determine links.

• The text of the link must explain the link's purpose. (Don't ever use 'Click here.')

• To allow keyboard users to navigate directly to the main content, Skip Links should be provided. The skip to the navigation connection is related to this.

• Remember that there is no hover state for mobile devices. Touch screens do not either.

Content Structure and Semantics

• A title is required on every page.

• The first heading should always be an H1.

• Do not skip the hierarchical level of the heading tags.

• The size of the text must be easy to read and see. The text of the navigation link is now typically 16–18 pixels and 14–16 pixels for regular paragraphs.

• Contents should be left-aligned other than the header section. This is for people with poor eyesight and the way we read (left to right). It is possible to center or left-align headings and subheadings.

• Breadcrumb navigation should also be left-aligned.

• Make fonts responsive, so they can be magnified on mobile devices.

Images and Media

• Put alt text on all images.

• When a connection would take users off-site, it is considered a courtesy to alert both visual and non-visual users.

• The alt text should have no more than 250 characters and be concise.

• Using images as text should be avoided.

• Provide a way to pause, stop, or hide media content that is automatically played.

Businesses will get ahead of the regulatory curve by creating a compliant website and preventing future litigation by making enough effort to ensure fair accessibility for users with disabilities. In addition, designing a compliant website can lead to more sales and a better ranking on search engines.

Consult with a disability attorney to find out more about ADA website enforcement and how you can protect your business.