Over 90% of websites have at least one accessibility failure. Not all hope is lost because you can avoid adding to this statistic by making sure that your website is ADA compliant.
You may be wondering what even is ADA compliance? How do you become compliant? Not to worry, we got you covered!
This blog will cover:
- What ADA means
- Who needs to be ADA compliant
- How you can make your website ADA compliant
- Conducting an accessibility audit
- TLDR: Key Takeaways
What does ADA stand for and what does it mean?
ADA stands for the Americans with Disabilities Act. What does this act entail? It’s a civil rights law that was passed to prohibit discrimination against individuals with disabilities in various areas of life. This includes but not limited to employment, education, transportation and access to public spaces. All in all, it makes sure that people with disabilities have the same opportunities and access to the same rights and privileges as anyone else. This act spans to websites as inaccessible website content means that people with disabilities have been denied access to information.
In 2010, the U.S. Department of Justice passed the Americans with disabilities act standards for accessible design. This act mandates all electronic and informational technology like websites to be accessible to those with disabilities.
People with disabilities navigate the web in various ways. For example, blind people may use screen readers, while those who are deaf or hard of hearing may use captioning. The methods of accessibility are endless, which is why it should be easy for businesses to ensure they are ADA compliant. Which in turn provides everyone with an equal opportunity of accessing the information provided.
Simply put, ADA compliance allows businesses and organizations to reach a wider audience, demonstrating their commitment to inclusivity and accessibility. More importantly than just the fact that it is a legal obligation, it is also just the right thing to do.
Who needs to be ADA Compliant?
ADA does not only apply to state and local governments but also businesses that are open to the public. According to ADA.gov businesses that are open to the public must “provide full and equal enjoyment of their goods, services, facilities, privileges, advantages, or accommodations to people with disabilities.”
Regardless of if your business falls under Title I or III of the ADA, it is just good practice to be ADA compliant. This enables people with disabilities to perceive, understand, navigate, interact and contribute to the web. Additionally, many things that boost your ADA standards are also beneficial to your SEO. (If you need a refresher on SEO – not to worry just check out our blog post to get caught up). You make your experience better for your users and web crawlers who are looking to index your website. Who wouldn’t want that? It’s a win-win! So let’s go over how to make your website ADA compliant!
How can I make sure my website is ADA compliant?
Ensuring your website is ADA compliant requires taking some important steps. Here are easy ways to get started:
Understand the Web Content Accessibility Guidelines (WCAG)
While the ADA does not offer a set of guidelines for website compliance, several organizations follow Web Content Accessibility Guidelines (WCAG). These are not a legal requirement but are a reference point for organizations that are looking to enhance their digital accessibility. These guidelines ensure that your website is Perceivable, Operable, Understandable, and Robust. What does that really mean?
Perceivable
The content is provided in an easily perceivable manner. This includes offering alternatives to text (ie audio and assisted technologies) that allow sight-impaired individuals to perceive the content of your website.
Operable
Navigation is easy to operate. Ensure that users are able to navigate the website using the keyboard rather than the mouse.
Understandable
This sounds easy right? It not only encompasses that your content is clear with simple instructions, but also that the website functions in a way that is understandable and not unusual, unexpected or inconsistent.
Robust
Your website must meet recognized standards such as using a clean HTML and CSS. This minimizes the risk that users who rely on technology cannot process your website correctly.
Meeting these standards improves your website accessibility to users who have vision or hearing impairments, or cognitive, language or learning disabilities.
Steps to increasing accessibility on your website:
There are several avenues that you can take to improve accessibility on your website. Two major ways to ensure you do this is through: providing alternative content options and using accessible design. In the following sections we will dive into how you can go about doing just that!
Provide alternative content options
This encompasses making sure all non-text content, such as images and videos, have appropriate alternative content options that provide an equivalent experience for people who cannot see them. So how do you go about making sure your website has these? Be sure to use alt text, video captioning, and form assistance where appropriate. Next, we will dive into the specifics of each of these.
Alt text
Alt text, also known as alternative text, describes the appearance or function of an image on a page. It is what screen readers use to describe the image to the visually impaired users. This is also what shows when an image fails to load and it is indexed by the search engine bot to understand the context of the page.
Good alt text describes the image and is specific, it adds context that relates to the topic of the page. It’s best practice to keep this text to fewer than 125 characters and to not start with “picture of…” or “image of…”. While it may seem like the best place to keyword stuff, don’t. Instead use keywords sparingly. It’s not necessary to have every single image have a keyword in the alt text. Instead select one that is most representative of the keyword and use it in that alt text. Finally, if an image is purely decorative, it’s ok to not add alt text to it at all.
Video Caption
Video captioning has been on the rise, not only for accessibility but also because it can boost your audience’s comprehension as a whole. Video captioning allows not only users with disabilities to have a better understanding of the contents; but it also allows users who often scroll through their phones with the volume off to have a better understanding of the content. Closed captioning on your videos can make it easier for you to capture your audience’s attention and increase viewing time.
Forms
Forms are a commonly used way of gathering user/potential client information in exchange for something else (either a product or a trial etc.). There are a few ways in which you can ensure that your forms are accessible, this includes providing instructions that help users understand how to complete the form. Another way to make forms more accessible is by adding a notification when the form has been successfully completed or if any errors arose during the submission process. If your forms are long, it is best practice to divide them into smaller sections that consist of logical steps or stages. Finally, labeling the elements assists not only in the comprehension but the accessibility of the form.
Use accessible design
It is common knowledge that design can make a huge impact, and the same is true for design when it comes to accessibility. You may be tempted to think of the most common example of accessibility in design: color. While that is critical and not to be overlooked, accessibility in design also takes on several other forms. Let’s start with the easiest piece, color.
Color
Color not only has a huge impact on the look and feel of products, but it is a strong medium that can communicate even more than it initially appears. It is important to not ONLY use color when it comes to conveying information. This means that when you’re using colors to differentiate elements, you should also provide additional identification elements that do not rely on color perception. For example, do not only use red to indicate required fields but also add an asterisk. This is critical as it helps those who are unable to or have difficulty distinguishing one color from another to have a better understanding of what is going on.
Contrast
Accessibility in color encompasses providing sufficient contrast between the foreground and background. This includes text on images, background gradients, buttons and more. There are several free tools available that allow you to check color contrast such as: https://coolors.co/contrast-checker/112a46-acc8e5 . Simply select your text color and your background color and see if it is sufficient contrast according to the WCAG. Having enough of a contrast between the foreground and the background ensures that users with visual impairments are still able to digest the material presented.
Viewport Sizes
Viewport Sizes are another aspect of creating accessible design. Viewport sizes are the various sized screenshots that your website will be presented on: whether it’s mobile or desktop the website may look slightly different.
Creating designs for different viewport sizes is a great way to ensure that your website is accessible because it means it presents well in mobile phones and zoomed browser windows. Optimizing your website for different viewport sizes includes ensuring that main elements such as the header and the navigation adjust accordingly. It also encompasses the text size and line height, to ensure that it is set to a maximum readability and legibility. A narrow window (like on a mobile phone) should utilize a single column for primary content and navigation options are revealed by an icon. These are all considerations when creating accessible content as over 50% of all traffic is done on mobile devices and this number just continues to increase!
Conduct an accessibility audit
A good way to see where you stand is to conduct a quick accessibility audit on your website. You can conduct your own audit by evaluating your website’s color contrast (utilizing the tool we linked or any other free option available online), as well as checking your alt text and navigation accessibility.
If you do not want to conduct the audit yourself, there are several free tools available now to give yourself an idea of where your potential inaccessible areas lie. One great free tools that will help you get an understanding of where you stand is: accessibe.com
Here’s A Quick Summary (TLDR):
- ADA compliance allows businesses and organizations to reach a wider audience, demonstrating their commitment to inclusivity and accessibility.
- It’s critical that websites are ADA compliant so that everyone is able to access them.
- No aesthetic choice should ever come at the expense of accessibility.
- ADA Standards also help improve your SEO!
- Utilize alternative content and accessible design choices to assist in accessibility.
- Finally, we cannot forget that it is actually also a legal obligation and more importantly the right thing to do.
Be more than another statistic – be ADA compliant!