10 Questions to Ask About Shopify Accessibility and ADA Compliance

The accessibility of your online store is an important consideration, because your company could be leaving out 1.3 billion people around the world with disabilities from engaging with your products. According to Return on Disability’s 2016 Annual Report, the emerging market size of people with disabilities (PWD) globally is estimated to be the size of China, with an additional 2.4 billion potential customers who act on their emotional connection to PWD. Together, the report estimates that PWD controls over $8 trillion in annual disposable income – That’s a large slice of the web to be left untapped!

Here’s a few other significant stats about accessibility today:

• Approximately 15% of the world’s population lives with some form of disability, according to the World Health Organization. 

• Nearly 1 in 5 people in the United States has a disability, claims the United States Census Bureau – That’s 19% of the population or 56.7 million people. 

• 1 in 7 Canadians 15 years and older reported a disability in the Canadian Survey on Disability by Statistics Canada, totaling 3.8 million Canadians. 

To help you better understand today’s web accessibility standards and how to seize the opportunities for growing your user base and increasing your sales on Shopify, here are the answers to 10 Frequently Asked Questions about ADA Compliance and web accessibility:

1. What is ADA compliance?

The Americans with Disabilities Act (ADA) is a law that aims to protect people with disabilities against discrimination by businesses that are open to the public. Since many businesses have moved online, ADA compliance has extended from brick-and-mortar places such as schools, hospitals and restaurants, to anything a user can interact with, which includes websites and applications as well. 

Globally, many organizations also recognize and accept the World Web Consortium (W3C) Web Content Accessibility Guidelines (WCAG) and Section 508 of the Rehabilitation Act, that outline technical requirements to ensure that websites and apps are inclusive to people of all abilities.

These standards ensure that all information online must be accessible to people with disabilities. Examples of this include ensuring that: 

• Shoppers with color blindness can see buttons to click and select a product online.
• An electronic reader will  pick up your product image text descriptions.
• Promotional videos include subtitles for people with hearing disabilities.
• Users with visual disabilities can magnify text for easier reading.
• Customers with limited motor skills can navigate your site with a keyboard.

2. What is the ROI of ADA compliance?

More traffic, exposure, and an increase in conversion rates are just a few of the tangible benefits of improving your user experience for people living with a disability. If users with a disability find your Shopify store easy-to-use, you may become their preferred company for your specific product because you offer a more convenient user experience and faster path to purchase than your competitors.

3. How do you make your Shopify store accessible?

Accessibility testing is a type of software testing performed to ensure that your website or application is usable to people with disabilities. Maintaining an accessible website requires identifying your key accessibility issues, as well as making regular assessments of your content and best practices to stay up to date. Following a thorough and multifaceted approach can help your company avoid legal implications such as lawsuits that are becoming commonplace in the USA and abroad. 

4. What does accessibility testing include?  

There are 2 important aspects to testing that will help your Shopify store become more inclusive of people living with disabilities: 

Follow accessibility guidelines

Manual and automated audits can check every page of your Shopify website to ensure that it meets accessibility guidelines. At Diff, our QA team looks at our client site’s purchase flow, user journey, main templates and page types. 

Understand the user experience

Even if your Shopify website code is compliant, there is nothing in an automated or manual pass that will tell us if users are having a great experience. That’s where tools like screen readers come in handy! At Diff, our QA team uses a variety of screen readers for Windows and Mac (iOS) systems. 

Here’s how testing with a screen reader works. A person who is blind will not be able to see a page and what’s on it, including text, images, buttons or links. Our QA team replicates the user experience of a blind person using a piece of software called a screen reader, which changes text into speech in order to read out the text on the page.

With a good user experience, the screen reader will also provide appropriate context in terms of where they are navigating on your website. By using multiple screen reader tools, we can see common trends that will give our team insight on how to improve client websites to meet accessibility standards.

Another way to understand the user experience is to conduct one-on-one moderated usability testing sessions. Having a real user from your target audience with a disability test your site is the best way of verifying whether your assumptions concerning accessibility features were right. You’ll also discover potential issues and opportunities for improvements based on your working Shopify website or prototype. 

5. What’s the value of working with an agency to meet accessibility standards?

If you don’t have access to multiple screen reader tools in-house, you might want to consider hiring an agency (like Diff!) who can provide you with the technological know-how to thoroughly test your Shopify website to ensure someone with a disability can navigate through your user experience. In addition to knowing how to build a site, Diff offers the knowledge on how to test and design your website for people with disabilities, ensuring that all of your work meets accessibility standards and represents your company’s brand accurately.

6. What are the WCAG 2.0 levels of compliance?

As mentioned previously, the American Disabilities Act (ADA) was created before the rise of the online economy, which is why many companies now follow The Web Content Accessibility (WCAG) Guidelines to achieve ADA standards. At Diff, we help clients achieve the WCAG levels of compliance based on the three levels of compliance:

Level A

At the minimum, Level A covers the basics. Scripted text for images, animations and video help users navigate your site who have hearing impairments, for example. Tap keyboard navigation ensures that users with motor or visual disabilities can navigate through your site by tapping keys with their fingers, without the need to use a mouse or other pointing devices. 

Level AA

In addition to covering the basics, Level AA addresses additional common barriers for disabled users. For example, color contrast can help someone navigate your site who is color blind or partially blind with limited vision capacity.

Level AAA

This level is the highest level of compliance for web accessibility, covering the most enhancements. Level AAA includes enhancements to videos and animations such as assigned language interpretation, instead of only using subtitles, and pre-recorded audio that synchronizes with your audio, video and animations.

7. What is ADA Maintenance and how do you keep up?

In retail, the look and skin of websites constantly change according to time of year and relevant holidays, like Christmas, Valentines Day, and Back to School season. Regardless of the branding at any given moment it’s essential that all of your users, whether with a disability or not, are able to navigate your Shopify website. When adding assets, page types, or changing features, it’s important to double check that nothing on the site is broken.

The new feature or code injected should follow web accessibility standards so that your team doesn’t introduce any new issues. Whether a website was built a few weeks or a few months ago, continued automated and manual audits combined with passes by a screen reader will ensure your site remains ADA compliant. 

8. What are common mistakes of accessibility non-compliance?

The two most common mistakes that companies make include designing without keyboard navigation in mind, and not adding alt-text to images.

Keyboard navigation

Many users with motor or vision disabilities typically use a keyboard to fulfill the function of using a mouse or other pointing device. Poor keyboard navigation capabilities can lead to an unpleasant and frustrating user experience, which is why testing with a keyboard is essential in accessibility testing.

For example, let’s say a person is landing on your homepage and is only using keyboard navigation arrows to go through your site. If the logic of those elements (HTML and styles) is well placed, a person will be able to hit arrows and the enter key to go to the previous links.

If the navigation doesn’t work, the person will not be able to go back to previous links and will become trapped on the page they are browsing, leading to a poor user experience. If the navigation is not well placed, the user may end up clicking all the way to the footer instead of the middle section they want to read.

Alt-text for images

To create an accessible user experience, every image needs a scripted text, otherwise known as alternative text. The purpose is to describe images so that people who are unable to see them can navigate your website with a screen reader. Lack of alt-text can create frustrating user experiences when users cannot find what they are looking for easily and in a timely manner.

For example, If a visually impaired person is shopping for a red shirt on your site hovers over a red shirt with their screen reader, and there is no alt-text provided, their screen reader will read to them “image”. The user won’t know what content they are viewing, even if it’s the product they have been looking for!

Having alt-text helps everyone know where they are in your website navigation and what content they are viewing — And it’s as easy as adding that alt-text to your image. In the case of Shopify, adding alt-text can be accessed from theme settings in the CMS (content management system), or hard coded as needed.

9. How do you ensure your mobile site is web accessible?

It’s important to test for mobile in a similar way that you test for desktop, using a screen reader. VoiceOver, for example, is a screen reader integrated with iOS to test Apple products like iPhones and iPads for web accessibility. Common strategies to enhance accessibility include making sure text is zoomed in, and changing the contrast of colors of text and images to make them more visible for people with vision disabilites.

10. What’s the best way to protect yourself against ADA accessibility claims?

To avoid lawsuits, it’s important to have an Accessibility Disclaimer on your Shopify website. This lets your users know that you are taking progressive steps to become ADA compliant. Of course, this claim must be true and you must have proof of your work to backup your claim if you are questioned. At Diff, we help our clients gather evidence against lawsuits, like reports, quality analysis tickets, and created graphics that can demonstrate their efforts in taking action to be web accessibility compliant. 

Make your Shopify store accessible-ready

Removing technology barriers can make your Shopify website more accessible to everyone, and prevent you from getting sued from potential lawsuits. Additionally, increasing web accessibility will increase the satisfaction of disabled users, which can feed your company’s sales and bottom line. Disregarding the accessibility market is not only a legal risk, but it presents a lost revenue opportunity, that digital businesses can no longer ignore. 

Get in touch with Diff Agency to learn about our web accessibility audit and usability testing services to see how well your Shopify store supports the needs of your users living with disabilities.