The below is not legal advice and we do recommend seeking the advice of an expert who specializes in web accessibility.
What is web accessibility?
Website accessibility refers to how easily websites can be used by people with disabilities. It involves the design of the site and how it's coded. For example, for design that means using colors that have sufficient contrast and font sizes that are easy to read, while on the coding side it means that content is readable using a screen reader (a software that allows people with visual impairments to access digital content to do things like browse the web, send emails and access documents on their computer or device). When websites aren't created with accessibility in mind, they make it difficult or impossible for some people to use.
Why is accessibility important on Shopify?
In order for the internet to be open and accessible to anyone, websites need to be optimized for accessibility. Accessibility is something you need to consider in order to be inclusive to your customers and their different needs.
Between 15 and 25% of the US population (Source) live with some form of disability, which could include disabilities that require screen readers to access the web. By ignoring accessibility, you'll be excluding some shoppers from being able to use your website, and you could be losing customers. Your goal should be for it to be easy for all customers to read, access and buy from your website.
Paying attention to web accessibility is also important in order to avoid getting sued.
Do I legally have to make my Shopify store accessible?
Legal requirements will vary by location, but many countries such as the USA and UK do have legal web accessibility requirements. The most common compliance standards you'll encounter are the WCAG (Web Content Accessibility Guidelines) and ADA Standards for Accessible Design.
Some of the highest profile web accessibility lawsuits have been with Target (paying $6 million in fines), Netflix (paying $750,00 in fines) and Harvard (paying $1.5 million in fines). And while these are huge businesses, small businesses may be required to be compliant as well:
Under Title I of the Americans with Disabilities Act (ADA), employers, including state and local governments, with 15 or more employees, are prohibited from discriminating against people with disabilities.
Does your US business have 15+ employees? If so, you better pay attention. Website accessibility lawsuits have quickly risen in 2023, and the vast majority of Digital ADA lawsuits are targeted towards the e-commerce sector which accounts for 84% of all lawsuits (Source).
It’s worth noting that Shopify holds no responsibility if a merchant is filed a lawsuit. So it’s up to each merchant to ensure they meet accessibility standards.
How can I tell if my store is accessible?
Shopify recommends these tools to see how a web page is rated and how it can be improved:
These tools will run a test to assess how accessible your website is, and provide recommendations on what can be fixed. We recommend running these tests before a website launches, and spending some time making changes based on the recommendations. Running the tests on a scheduled regular basis is key to continued efforts toward improved accessibility.
Are Shopify themes compliant out of the box?
With the release of Shopify 2.0, theme developers are now required to meet certain accessibility standards in order to be listed in the Shopify Theme Store. However, you should still check that your store is accessible, as in our experience, even some of the most popular themes have not been fully compliant. Especially once you start customizing the designs.
How to make a Shopify store more accessible:
We’ve outlined some of the main ways to make your Shopify store more accessible below. However, for a full breakdown you should refer to the WCAG (Web Content Accessibility Guidelines), an international set of guidelines for accessibility recommendations.
1. Add Alt tags to your Shopify store
What are alt tags?
Alt tags are usually shown when an image fails to load. However screen readers use them to describe images to someone with visual impairments. They need to be added for ALL media, including image and video, and even tiny graphics such as logos and icons.
How do I write an alt tag?
Try to imagine that you’re describing the media to someone in as few words as possible. You don’t need to say ‘an image of…’ as that they’ll know what type of media it is already. Think about the context of the image — what is it there for and how does it enhance the store it’s on?
Where do I add alt tag text on Shopify?
- From the Shopify admin, go to Content > Files to see the all the media files uploaded to your store. Click on an image.
- You’ll now see an input for adding Alt text. You can add your text in here.
3. Go through your file list, item by item to ensure they all have alt text.
Get into the habit of adding an alt tag whenever you upload an image. You should also provide close captioning on any videos with audio.
2. Using proper HTML tags for text
Not only is using the proper tags essential for SEO, screen readers use the tags to distinguish hierarchy on the page. Semantic HTML should be used, meaning that you should use the correct HTML elements for their correct purpose as much as possible. For example, don't use and H3 element for styling purposes, but instead use it to correctly create the hierarchy of a page.
Also, ensure that every page has just one H1 tag, and that this is for the title of the page.
3. Consider turning off ReCaptcha
ReCaptcha is a tool added to forms to reduce spam. However it isn’t accessible so consider turning it off if you want to become more compliant.
4. Add an accessibility statement
It's very difficult to be 100% compliant, especially with accessibility laws continuously being updated. So after you've completed the basic steps above, you may provide an accessibility statement on your site. Create a page titled Accessibility and write a paragraph including things such as:
- the steps you've taken to ensure your site is accessible
- that accessibility is very important to your brand
- that you are committed to making the store as accessible as possible
- that you are continually reviewing it
- the best point of contact for any suggestions or feedback
- mention of limitations due to third-party integrations
The statement you create should be truthful and informative to state the brand's commitment to web accessibility. Place the link to this page in your footer by your terms and conditions.
5. Optimize the design for accessibility
At the very least, these are some things to consider to optimize the design of your Shopify store to make it more accessible:
- Contrasting colors
- Text is easy to read (no text inside images, font sizes are not too small)
- Ensure there are borders around all inputs on forms
- Links within paragraph text should be underlined
6. Use a web accessibility tool
There are tools that can be added to websites that that allow users to instantly make a website more accessible. These widgets are quite popular:
- accessiBE
- Accessibly (shown below)
- UserWay
- AudioEye
These tools display a small icon in the bottom corner of the page that when clicked, expands to open options. The tools allow users to adjust the page contrast, font sizes, cursor size and more. Quite useful even for those needing reading glasses. The tools are quick to install, and plans start around $49/month.
In conclusion, ensuring your Shopify store is accessible should be an ongoing task. You should regularly audit a store to make sure that it is compliant and up to standards.
Even if your business isn't currently legally required to be accessible, laws change quickly and so could your business situation, so it's best to implement these best practices sooner rather than later.
Hopefully this has given you a good start to making your website WCAG & ADA compliant. Please note that we’re not experts on this matter. Accessibility laws can be complex and we recommend consulting a lawyer who is familiar with the topic if you have specific questions.