Accessibility for your online store is essential to providing an inclusive experience for your customers.
We have gone to great lengths to put our clients in the best position possible to maintain accessible websites. Keep in mind that your business is ultimately responsible for ensuring that everything published on your website meets accessibility guidelines. While we may assist in your efforts, we cannot guarantee to any extent that your website is compliant.
Understanding ADA for your website
The Americans with Disabilities Act (ADA) does not explicitly mention websites, but is interpreted to include websites as “places of public accommodation” and therefore covered under the act.
While the law related to business websites is not yet settled, it is clear that businesses are expected to make website content and navigation accessible for people with disabilities, affording every visitor with “full and equal” use of its resources.
Just like in your physical store, there are aspects of online ADA compliance that you’ll need to pay attention to and we’ll try to make it as easy as possible. The goal is to make your website as easy to utilize as possible for people with disabilities.
Recommended guidelines
The Web Content Accessibility Guidelines 2.1 (WCAG 2.1) published by the World Wide Web Consortium (WC3) is a widely-accepted standard for accessibility.
Anyone visiting your website must be presented with content that is:
- Perceivable - All users must be able to perceive the information being presented.
- Operable - All users must be able to operate the interface.
- Understandable - All users must be able to understand the information as well as the operation of the user interface.
- Robust - Users must be able to access the content with a wide variety of user agents, including assistive technologies.
Improving Your Website's Accessibility
To review your current site for potential accessibility issues, you can use tools like Wave Web Accessibility Evaluation to access your website. This can be helpful to find potential accessibility issues that may need to be remedied. However, it is important to note that these tools only offer a snapshot of possible issues. They may not be hyper-accurate and do not serve as a guarantee of compliance.Image Alternative Text
Alt text helps users with impaired vision understand image content. You can add alt text to images when you add them in the page builder. Every image on your website must have an alt= attribute. There are three principal categories of images that require different approaches. A helpful practice for adding helpful alt text is to imagine what a person would need to know about that image if you were describing it to them.-
- Decorative images should have empty alt text: Alt="" (this is the default state for images within the page editor).
- Informative images should have alt text that describes the information (not the picture) in brief, clear terms.
- Active images (e.g., linked images) require descriptive alt text.
- Learn more about adding alt text here.
Contrast
It is important that the text on your website is visible to visually impaired visitors. You can use a contrast-ratio tool like Contrast Ratio to make sure elements of your website meet the following ratios against their background:
- Body text and button text should have a contrast ratio of at least 4.5:1
- Headings and large text (24 px font size and up) should have a contrast ratio of at least 3:1
- Borders and icons should have a contrast ratio of at least 3:1
All stock templates and default themes pass WCAG AAA contrast tests. Our onboarding team is trained in accessibility, so any client just getting started with us will be compliant with the recommended guidelines.
Page Content
When you add headings to your page, add them in sequential order from 1 - 6. Assistive technologies use headings to communicate how page content is organized. Altering the sequence can be confusing to users.
Site Content
Add an accessibility statement to your website and link to it in your footer. This demonstrates your commitment to making your site accessible for all visitors and provides a clear contact method for anyone who encounters an issue while visiting you. A stock accessibility page is available in the content library in Website > Page Editor > Page Library > About. Learn more about adding pages here.
Additional resources
For your benefit, here are some additional resources for you to learn more.
Google Accessibility Resources
Web Content Accessibility Guidelines (WCAG) 2.1
Material Design color accessibility tool
Mozilla: Understanding Web Content Accessibility Guidelines
MOZ: What You Should Know About Accessibility + SEO
https://webaim.org/resources/contrastchecker/