The key to building accessibility into your eCommerce store website

Published By:

woman making a purchase on her tablet or ipad

eCommerce has taken the world by storm. And the trend doesn’t seem like it will die down any time soon. According to the BCG, ecommerce is poised to capture 41% of global retail sales by 2027. This is great news for online stores, but with great power comes great responsibility.

To play their part in contributing to a fairer, more equitable society, ecommerce sites must make their products and services accessible to those with disabilities. Besides being the right thing to do, implementing accessibility best practices brings with it a range of compelling business benefits, from increasing sales to improving SEO rankings. Before you jump straight in, there is a lot of ground we need to cover. This article will break down the key steps needed to create a more inclusive online shopping experience, benefitting both your customers and your bottom line.

Why is web accessibility important for eCommerce stores?

Web accessibility is important for all websites, but particularly for eCommerce. Globally, over 1 billion people live with a disability. In the UK alone, 73% of people with disabilities have experienced barriers on more than a quarter of websites they visited, and 71% leave sites they find hard to use.

This demonstrates just how much of an impact web accessibility, or lack thereof, can have on your business. For ecommerce stores, your website is your store front, so if the browsing experience is not easy, users will go from potential customer to lost customer very quickly. In this way, your ability to create an inclusive online space is inextricably linked to your business’s ability to make a sale. It’s not just a moral obligation; accessibility is a business imperative.

Free Accessibility Check of your Website or eCommerce Store

Detecting accessibility issues has never been easier than it is now. At Recite Me we offer a free automated scan of your websites homepage. This will identify and highlight any non-compliance on your website. Followed by recommendations on how to implement the necessary changes to improve your websites accessibility score and standing.

Key accessibility laws for eCom stores in the USA

Before jumping straight into the nitty-gritty of accessibility strategies, it is worth gaining a broad knowledge of key accessibility laws. After all, you have to know what is required of you to know where you are going. Think of these regulations as your north star, the guidelines within which you must remain throughout your accessibility journey.

Web Content Accessibility Guidelines (WCAG)

WCAG is a globally recognized set of digital accessibility standards created by the World Wide Web Consortium (W3C). It serves as the baseline for web accessibility across the USA and is referenced throughout various regional laws, such as Section 508 of the Rehabilitation Act.

It provides recommendations for making online content accessible to disabled users, which, for ecommerce sites, could have a range of implications. It may mean adding alternative text to product images so that they can be understood by users with visual impairments who rely on screen readers to perceive visual information. It could also mean crafting product listing with simple, accessible language to cater for those with cognitive disabilities. The list is seemingly endless.

Americans with Disabilities Act (ADA)

The Americans with Disabilities Act (ADA) is a landmark civil rights law enacted in 1990, which prohibits discrimination based on disability across all areas of public life; this includes jobs, schools, transportation, and any other space that is open to the general public. The fundamental purpose of the ADA is to make sure that people with disabilities have access to the same rights and opportunities as everyone else, such that they are not unduly prevented from living the life they dream of.

The ADA requires ecommerce stores to make reasonable accommodations for people with disabilities. This can be achieved by, for example, by providing users with assistive technologies, like screen readers, or allowing them to customize your online content according to their own specific needs.

Section 508 of the Rehabilitation Act

Section 508 was a much-needed amendment to the Rehabilitation Act of 1973, bringing it into the modern digital world by requiring government agencies and their contractors to make their electronic and information technology accessible to disabled individuals. What does this mean exactly? It means that any ecommerce store working with the government must ensure that those of its customers with impairments are able to navigate websites, consume digital documents, and use software, without significant barriers.

10 Strategies for building an accessible eCommerce store

While there might seem like a lot of rules and regulations involves, creating an online store does not need to be an overwhelming process. Here are 10 key accessibility strategies you can implement today to help you get started:

1. Descriptive alt text

Alternative text, often referred to as ‘alt text’, provides a description of what the image contains. This is essential for blind users or those with visual impairments, as it allows screen readers to read image descriptions aloud. An ecommerce store, for example, might tag a product image of a red handbag with the following alt text: “Red leather handbag with gold buckles”. This provides enough detail for the user to know what the image contains without confusing them with too many words or too much jargon.

2. Clear color contrast

People with vision impairments or color blindness may struggle with low-contrast text. Make sure that text stands out clearly from the background by using dark text on a light background. According to WCAG best practices, the minimum contrast ratio for normal text should be 4.5:1. Use a contrast checker tool, or similar, to ensure your brand’s palette aligns with current accessibility guidelines.

3. Keyboard navigation

Some disabled users rely on keyboard accessibility, rather than a mouse, to navigate websites. Your site structure should accommodate this by allowing users to browse and purchase products using keyboard functions only, like the “tab” key and “enter”.

4. Font size and style

Font size and legibility help make your website content accessible for those with visual impairments or conditions such as dyslexia. Stick to simple, sans-serif fonts like Arial or Helvetica, and make sure your font size is easily readable – typically, a minimum of 16px, or 12pt, works well for body text.

5. Descriptive links

When inserting hyperlinks on your online store, rather than using generic link text, like “click here,” use descriptive link text that will tell the user exactly where they will end up by clicking on the link. For example, writing “view our summer collection” provides much more context about the link destination. This also improves your site’s SEO and helps visually impaired users who rely on screen readers.

6. Responsive design

Responsive design ensures your website works seamlessly across all devices, including mobile phones, PCs, tablets, and laptops. If, for example, your ecommerce site is designed for desktop viewing only, buttons, text, and images may appear too large or too small on a mobile device, making it incredibly difficult for anyone, but especially disabled users, to navigate your website.

7. Accessible online forms

Forms are essential for any ecommerce store. They are used both when customers first register their account and when they check out. Therefore, all forms need to be fully accessible. Label fields clearly, use placeholders in the field entry box to show examples of what is required, and provide specific instructions. And don’t forget that, like the rest of your website, forms should also be navigable via keyboard only.

8. Content structure and headings

Structuring your website content with clear headings (H1, H2, H3) and a strong hierarchy brings about a range of accessibility benefits. First, it makes your online content easier to read for everyone, but especially for those with cognitive impairments.

Second, it helps users with visual impairments, who rely on screen readers, to better understand the structure of your content. Without a logical structure, certain elements might be misinterpreted, which can lead to inaccurate reading of the web page. The screen reader might even misunderstand the intended flow of the content, confusing the user by skipping heading or using them out of order.

9. Accessible multimedia

To create accessible videos and other media displayed on your ecommerce site, be sure to include captions, subtitles, or transcripts. This ensures that users who are hard of hearing or deaf can still engage with your content. Additionally, it gives non-disabled users the flexibility to follow along a video at times when there is too much background noise, or when they don’t have access to headphones in public spaces.

10. Compatible with assistive technology

Ensure your ecommerce site works well with different types of assistive technologies like screen readers, voice control software, and magnifiers. One way to do this is to add ARIA (Accessible Rich Internet Applications) labels to your site’s HTML elements. This gives assistive technologies, like screen readers, additional information about a given element’s purpose or functionality, helping users to better understand and navigate your store.

Ultimately, by making sure your ecommerce site is compatible with assistive technologies, you open your doors to a broader audience of disabled users, which, as well as being the right thing to do, helps you stand out from your competitors.

Online Accessibility and Inclusion Toolkit

This year we published our Digital Inclusion Toolkit that was developed to help businesses make a real difference to the lives of the millions of people around the world who encounter online barriers. The 40 page document provides practical advice covering the complete landscape of online accessibility from how to write an accessibility statement to our top tips for providing an inclusive recruitment journey.

Building accessibility with an eCommerce platform

If you’re striving to build an accessible online store, ecommerce platforms, like Shopify or Wix Commerce, should be your new best friend. But how do you know which one to choose? The right ecommerce platform for you can be rather subjective. But as a bare minimum, it should offer features that support accessibility and make it easier to comply with accessibility standards.

Here’s a breakdown of popular platforms and how they cater to accessibility:

  • Shopify: Shopify is a user-friendly ecommerce platform which helps small businesses build an online store by offering a range of website templates and integrating with various payment gateways.
  • Squarespace Commerce: Squarespace is a popular choice, mostly for its aesthetically pleasing templates and ease of use. Its intuitive design means that creating an accessible ecommerce is simplified; easily adjust text size, color contrast, and add alt text to images.
  • WooCommerce: WooCommerce is one of the most popular ecommerce platforms on the market today. As an open-source platform based on WordPress, WooCommerce allows for extensive customization, opening up a huge range of possibilities for accessibility. 
  • Wix eCommerce: Wix ecommerce is ideal for small businesses looking to set up their online stores without much hassle. It offers a range of customizable templates, many of which come with screen reader compatibility, high-contrast color schemes, and even visual indicators.
  • Magneto: In contrast to many of the other ecommerce platforms mentioned in this list, Magento is more suited to larger businesses and enterprizes. It is a powerful ecommerce platform which offers a high level of customization to its users. It supports ARIA attributes, keyboard navigation, and various assistive technologies.

The benefits of building an accessible eCommerce website for your business and its customers

Granting disabled people the same access to your company’s products and services as everyone else should be reason enough to make your ecommerce site accessible. But, fortunately for you, there are also a multitude of compelling business benefits that come with it too. Here are just a few:

  • Increased sales: Making your content available to a wider audience means more increases your pool of potential customers and, therefore, sales.
  • Better user experience: Implementing accessibility strategies improves usability for everyone, including non-disabled users.
  • Legal compliance: Adhering to WCAG principles helps you avoid fines and costly lawsuits associated with non-compliance.
  • Stronger brand loyalty: Demonstrating inclusivity builds trust and loyalty among ethically conscious consumers.
  • SEO improvements: Accessibility features like alt text and descriptive links helps improve your search rankings.

Maintaining accessibility at your eCommerce web store

So, you’ve chosen your preferred ecommerce platform, implemented a few accessibility strategies, and made sure you’re WCAG-compliant. All well and done, right? Not quite. Once your eCommerce store is accessible, maintaining those standards is crucial.

Automated testing

Automated testing involves the use of software and other digital tools to audit your site for areas of inaccessibility. Auditing tools like Recite Me’s accessibility checker can be used to conduct a quick scan of your website, identifying any inaccessible or non-compliant features. Using such tools to conduct regular audits helps you stay on top of compliance with laws and guidelines.

Manual testing

Unlike automated testing, manual testing is conducted by humans, without software or third party tools. Typically, these tests are carried out in-house by developers or web designers, and can involve anything from checking navigation to checking that color contrast ratios are within WCAG standards.

User-testing

User testing differs from manual testing in that it is carried out by users, not developers or web designers. In this sense, it is the final step in the auditing process, and arguably the most important. Invite users with disabilities to test your site, and offer valuable feedback on how to improve the shopping experience. Capitalize on this feedback by implementing changes soon after. This demonstrates to your community a commitment to inclusivity.

Providing customizability

Beyond auditing, ecommerce sites can maintain accessibility long term by providing customization options to their users. One of the best ways to do this is to integrate software, such as Recite Me’s accessibility toolbar, which allows users to customize things like text size, font style, and color contrasts according to their specific needs.

Get serious about Accessibility Compliance with Recite Me

Act today to ensure your website or eCommerce store is accessible and compliant with the latest accessibility legislation. Get started on your website accessibility strategy with any of the following action points:

  1. Contact our team for more advice about how you can make your website or store compliant.
  2. Find out more about the Recite Me Web Accessibility Checker, to fix accessibility issues at source.
  3. Schedule a free demonstration to learn how our technology can help you.
  4. Run a free accessibility scan of your website for WCAG 2.1 AA compliance.
  5. Get a free trial of our toolbar, to see how it integrates with your website or eCommerce store.

Related Content

To provide candidates with an inclusive recruitment journey, KFC has implemented the Recite Me assistive toolbar on its careers website...