7 Best Tips to Make Any Website ADA Compliant
.svg)
Technology is constantly evolving and changing- especially with the advent of the World Wide Web. Being a public space by technical standards, the internet and web design can fall under some rules and regulations. One of those regulations is website accessibility under the Americans with Disabilities Act (ADA). It can apply to websites; you as a creator must provide an accessible website that all potential customers can access. However, the ADA and keeping a website ADA compliant can be a little complicated for an everyday internet user.
What are the Americans with Disabilities Act (ADA)?
The Americans with Disabilities Act may have been created for more than just the internet, but it was specifically designed to evolve with time. The range that the ADA covers, then, is broad and ever-spreading. The ADA's bottom line is that it encompasses all domains considered 'places of public accommodation,' flexible language that means your website- being public domain- falls under it. These days, the ADA in the web context means keeping your website free of accessibility issues for all users that may come across it. The ADA, being a wide net of accessibility regulations, is complex and ever-evolving. So how do you go about having an accessible website compliant to the ADA and immune to any lawsuits?
Here are some simple tips on how to make a website ADA compliant.
i. Review the Website Content Accessibility Guidelines (WCAG 2.0)
The guideline is comprehensive and offers a great place to start in making your website ADA compliant. The WCAG has three levels: A, AA, and AAA, which all encompass different levels of ADA compliance, from the most basic to the more complicated. Keep in mind that your website should aim to meet Level A and Level AA requirements at the very least. Adhering to these levels will keep you from running into any legal trouble down the line.
The main principles of the WCAG are as follows:
- Perceivable - Is the information and the site interface presented so that users can easily perceive it and its contents?
- Operable - Is the website's interface and web navigation user-friendly and clearly operable?
- Understandable - Is the site's content and its user interface's operation easy to understand and use at first glance?
- Robust - Lastly, is the website adaptable to the myriad of browsers and assistive technologies its users might be utilizing, even after steady updates?
Following this criterion set by the WCAG is a good way to gauge your website's ADA compliance.
These criteria for web accessibility are then separated further into the three levels mentioned earlier: Level A, the minimum; Level AA, the mid-range level; and finally, Level AAA, the highest level.
Level A (minimum) - Counting the most basic web accessibility features, which sets a minimum level of accessibility but not broad enough to encompass more situations.
Level AA (mid-range) - Includes the broader and more common barriers for people with disabilities.
Level AAA (highest) - Being the highest level of accessibility for online content, it is difficult to satisfy this criterion because not all content types can meet the AAA level.
ADA website compliance boils down to ensuring all the aspects of your website- text, design, video, or audio- conform with the technical guidelines laid down by the WCAG.
ii. Make sure to add alt text to images on your site
Alternative text or alt text is used by screen readers and assistive technology to describe your website's elements to your users. This is useful for sight-impaired users and is a general requirement for any website.
iii. Make your website design elements, including headings, page titles, and buttons, accessible to all. The ADA is created to make sure all users that may come across your web content, especially disabled users, can access all the elements of your website at any time. This includes color use, font size, and audio and video content. The 2021 ADA Web Compliance Checklist covers this comprehensively. Still, the basics of that checklist are broken down into the levels in the WCAG 2.1 to enumerate the requirements for web accessibility further.
The checklist is as follows:
Level A Compliance Checklist
- Images should have alternative text or alt text that screen readers can translate.
- The video should have text captions.
- Video or audio content should have either a text transcript or audio descriptions.
- A link on a media player is required to view content
- Any heading or title should be readable and presented in a logical order
- Ensure and 'b' or 'i' HTML tags are replaced with 'strong' and 'em.'
- There are no empty links or heading tags.
- The presentation should have more than just color alone and convey information clearly.
- Autoplay audio is discouraged and should have an option to be stopped
- Time limits provide notifications
- The site is navigable via keyboard, and the keyboard does not get stuck on any page elements.
- Automatic scrolling or blinking content has an option to be stopped
- No strobing light, or rapidly flashing lights or colors used in the website design
- A skip navigation link should allow keyboard users to access the content easily
- Page titles should clearly describe the content
- Logically and clearly label every link on the page
- The language of every page is identifiable in code
- Any bad form input is immediately identifiable
- Elements in focus do not change the website content in any way
- Forms are labeled and have legends that are easily read by screen reader software
- There aren't any major validation errors on the website design
Level AA Compliance Checklist
- Any live video or audio content on your website should have text captions.
- The color contrast ratio is kept at a level pleasing to the eye for the visually impaired.
- The contrast ratio between page backgrounds and text must be at least 4.5-1
- The text must be allowed to resize to 200% while still keeping its form.
- Images should not be used where text can achieve the same effect
- Pages on your website are accessible in several ways
- Keyboard focus should be clear and visible
- The language of content is easily identifiable in code, despite any language changes.
- Menus, buttons, and any navigation are kept consistent regardless of the user's location on your website.
- The site should allow users to receive suggestions on solving input errors.
- Error prevention techniques should be implemented whenever sensitive data is input.
- No underlined text does not lead to a link.
- Links that are redundant on the same page are either removed or minimized.
iv. Use the web writing best practices when you develop your content
To make your website ADA compliant includes keeping your content simple to help your users scan the content of it easier. The text must be broken up into headings and sub-headings, correctly punctuated, and all abbreviations and acronyms should be punctuated with periods for readability. Take the initiative to audit your website against the best practices to make sure it can meet the criteria.
v. Have a developer review your website code
Get an expert to audit your website's code and its CSS to make sure that the best practices are being utilized and to make sure you have clean, up-to-date code. Your website must adhere to the law, of course, but it should also be completely functional and not have any holes in its code. After all, what is your website if it is not usable at the most basic level?
vi. Be sure to audit your site with the WAVE Web Accessibility Tool
Available from Google, the WAVE Tool on Chrome is a great tool easily used to look for any issues, including and not limited to alt tags, styles, and site elements.
vii. Analyze the logic flow of your website
To make a website accessible to individuals with disabilities, it's important to label all forms on your site properly. Screen readers cannot work properly without carefully assessed labels to determine the functions on your site. Adding to this, pages on your site should be easily visited and found at any time of use. An ADA compliant website should be usable even without a mouse, with all elements accessible by moving the focus in a logical order.
How to create an ADA compliant website: conclusion
With these tips to make your website ADA compliant in hand, web design with accessibility in mind could feel a little less intimidating. However, manual checking of your content for ADA compliance for people with disabilities can still be a daunting task.
That's where ADA Compliance Pros can help. You can work with experienced, certified professionals who can identify all the liability risks on your website and provide cost-effective solutions for meeting all ADA requirements.
Visit our website at adacompliancepros.com today to find out what we can do for your web content.
Technology is constantly evolving and changing- especially with the advent of the World Wide Web. Being a public space by technical standards, the internet and web design can fall under some rules and regulations. One of those regulations is website accessibility under the Americans with Disabilities Act (ADA). It can apply to websites; you as a creator must provide an accessible website that all potential customers can access. However, the ADA and keeping a website ADA compliant can be a little complicated for an everyday internet user.
What are the Americans with Disabilities Act (ADA)?
The Americans with Disabilities Act may have been created for more than just the internet, but it was specifically designed to evolve with time. The range that the ADA covers, then, is broad and ever-spreading. The ADA's bottom line is that it encompasses all domains considered 'places of public accommodation,' flexible language that means your website- being public domain- falls under it. These days, the ADA in the web context means keeping your website free of accessibility issues for all users that may come across it. The ADA, being a wide net of accessibility regulations, is complex and ever-evolving. So how do you go about having an accessible website compliant to the ADA and immune to any lawsuits?
Here are some simple tips on how to make a website ADA compliant.
i. Review the Website Content Accessibility Guidelines (WCAG 2.0)
The guideline is comprehensive and offers a great place to start in making your website ADA compliant. The WCAG has three levels: A, AA, and AAA, which all encompass different levels of ADA compliance, from the most basic to the more complicated. Keep in mind that your website should aim to meet Level A and Level AA requirements at the very least. Adhering to these levels will keep you from running into any legal trouble down the line.
The main principles of the WCAG are as follows:
- Perceivable - Is the information and the site interface presented so that users can easily perceive it and its contents?
- Operable - Is the website's interface and web navigation user-friendly and clearly operable?
- Understandable - Is the site's content and its user interface's operation easy to understand and use at first glance?
- Robust - Lastly, is the website adaptable to the myriad of browsers and assistive technologies its users might be utilizing, even after steady updates?
Following this criterion set by the WCAG is a good way to gauge your website's ADA compliance.
These criteria for web accessibility are then separated further into the three levels mentioned earlier: Level A, the minimum; Level AA, the mid-range level; and finally, Level AAA, the highest level.
Level A (minimum) - Counting the most basic web accessibility features, which sets a minimum level of accessibility but not broad enough to encompass more situations.
Level AA (mid-range) - Includes the broader and more common barriers for people with disabilities.
Level AAA (highest) - Being the highest level of accessibility for online content, it is difficult to satisfy this criterion because not all content types can meet the AAA level.
ADA website compliance boils down to ensuring all the aspects of your website- text, design, video, or audio- conform with the technical guidelines laid down by the WCAG.
ii. Make sure to add alt text to images on your site
Alternative text or alt text is used by screen readers and assistive technology to describe your website's elements to your users. This is useful for sight-impaired users and is a general requirement for any website.
iii. Make your website design elements, including headings, page titles, and buttons, accessible to all. The ADA is created to make sure all users that may come across your web content, especially disabled users, can access all the elements of your website at any time. This includes color use, font size, and audio and video content. The 2021 ADA Web Compliance Checklist covers this comprehensively. Still, the basics of that checklist are broken down into the levels in the WCAG 2.1 to enumerate the requirements for web accessibility further.
The checklist is as follows:
Level A Compliance Checklist
- Images should have alternative text or alt text that screen readers can translate.
- The video should have text captions.
- Video or audio content should have either a text transcript or audio descriptions.
- A link on a media player is required to view content
- Any heading or title should be readable and presented in a logical order
- Ensure and 'b' or 'i' HTML tags are replaced with 'strong' and 'em.'
- There are no empty links or heading tags.
- The presentation should have more than just color alone and convey information clearly.
- Autoplay audio is discouraged and should have an option to be stopped
- Time limits provide notifications
- The site is navigable via keyboard, and the keyboard does not get stuck on any page elements.
- Automatic scrolling or blinking content has an option to be stopped
- No strobing light, or rapidly flashing lights or colors used in the website design
- A skip navigation link should allow keyboard users to access the content easily
- Page titles should clearly describe the content
- Logically and clearly label every link on the page
- The language of every page is identifiable in code
- Any bad form input is immediately identifiable
- Elements in focus do not change the website content in any way
- Forms are labeled and have legends that are easily read by screen reader software
- There aren't any major validation errors on the website design
Level AA Compliance Checklist
- Any live video or audio content on your website should have text captions.
- The color contrast ratio is kept at a level pleasing to the eye for the visually impaired.
- The contrast ratio between page backgrounds and text must be at least 4.5-1
- The text must be allowed to resize to 200% while still keeping its form.
- Images should not be used where text can achieve the same effect
- Pages on your website are accessible in several ways
- Keyboard focus should be clear and visible
- The language of content is easily identifiable in code, despite any language changes.
- Menus, buttons, and any navigation are kept consistent regardless of the user's location on your website.
- The site should allow users to receive suggestions on solving input errors.
- Error prevention techniques should be implemented whenever sensitive data is input.
- No underlined text does not lead to a link.
- Links that are redundant on the same page are either removed or minimized.
iv. Use the web writing best practices when you develop your content
To make your website ADA compliant includes keeping your content simple to help your users scan the content of it easier. The text must be broken up into headings and sub-headings, correctly punctuated, and all abbreviations and acronyms should be punctuated with periods for readability. Take the initiative to audit your website against the best practices to make sure it can meet the criteria.
v. Have a developer review your website code
Get an expert to audit your website's code and its CSS to make sure that the best practices are being utilized and to make sure you have clean, up-to-date code. Your website must adhere to the law, of course, but it should also be completely functional and not have any holes in its code. After all, what is your website if it is not usable at the most basic level?
vi. Be sure to audit your site with the WAVE Web Accessibility Tool
Available from Google, the WAVE Tool on Chrome is a great tool easily used to look for any issues, including and not limited to alt tags, styles, and site elements.
vii. Analyze the logic flow of your website
To make a website accessible to individuals with disabilities, it's important to label all forms on your site properly. Screen readers cannot work properly without carefully assessed labels to determine the functions on your site. Adding to this, pages on your site should be easily visited and found at any time of use. An ADA compliant website should be usable even without a mouse, with all elements accessible by moving the focus in a logical order.
How to create an ADA compliant website: conclusion
With these tips to make your website ADA compliant in hand, web design with accessibility in mind could feel a little less intimidating. However, manual checking of your content for ADA compliance for people with disabilities can still be a daunting task.
That's where ADA Compliance Pros can help. You can work with experienced, certified professionals who can identify all the liability risks on your website and provide cost-effective solutions for meeting all ADA requirements.
Visit our website at adacompliancepros.com today to find out what we can do for your web content.
.svg)
.svg)
.svg)
We will contact you shortly.
.png)
.svg)
.svg)
.svg)