How to Make Your E-commerce Website More Accessible 

In the e-commerce realm, we tend to talk a lot about optimizing for conversions and search engines. If you get lucky, you might also hear a thing or two about improving the user experience.

What about making e-commerce sites more accessible for people with disabilities? 

The nature of the disability a customer has — and the assistive technologies, like screen readers, they need in order to navigate e-commerce sites — can greatly impact their shopping journey.

Now, research shows that 16% of the world’s population has some form of disability. That’s more than a billion people worldwide, and chances are, at least a few of your customers.

If you're not doing anything to make your e-commerce site accessible, it might be high time to change that. Before you're actually forced to do so by the authorities.

Keep reading to find out: 

  • What is e-commerce website accessibility;
  • Why is web accessibility important — and what's the risk if your site is not;
  • How to make sure your e-commerce website is accessible.

What is e-commerce website accessibility?

An accessible e-commerce site is one that can be accessed by shoppers of every age, with any disability, within any context, having any skill, and living anywhere with an active internet connection.

If you’ve just started wondering if your website falls under the accessible category, the answer is likely to be negative.  

Researchers from the Baymard Institute analyzed and rated 33 large e-commerce websites against 4 core accessibility guidelines (regarding images, links, form fields, and keyboard navigation) and found that 94% of sites are incompliant.  

It shouldn't come as a surprise that smaller e-commerce businesses are even less likely to meet website accessibility requirements.

Ecommerce accessibility success criteria by Baymard Institute
Baymard Institute

Why is e-commerce website accessibility important

There are at least a few reasons why e-commerce website accessibility matters. It’s not only an ethical thing to do — in many countries, websites are legally required to meet accessibility standards. 

Here’s an example. In the US, if your site isn’t compliant with the latest Web Content Accessibility Guidelines (WCAG 2.1), you could be at risk of a lawsuit. And these cases are not unheard of — according to Usable Net’s 2022 Report, the number of non-compliance lawsuits has increased from 3,500 in 2020 to over 4,000 in 2022.

The worst part is that the e-commerce industry was cited in 77% of all digital accessibility lawsuits. Why so? Due to their complexity, popularity and constant content changes, web accessibility lawsuits are common among e-commerce businesses.

Luckily, accessibility guidelines don’t really differ between 'regular' and e-commerce sites. Plus, accessible website content benefits not only people with disabilities — compliant online stores tend to be more user-friendly for every shopper, which also affects conversions.   

To sum up, paying attention to web accessibility is the best thing you can do right now — from an ethical, legal and business perspective. 

How to make sure your e-commerce website is accessible

The ultimate goal is to make your e-commerce site accessible to every online shopper. If it seems like a complex, long-term project — it’s because it definitely is. 

To start things off, take a look at the most common issues related to WCAG 2.1 violations, including: 

  • Low-contrast text that prevents shoppers with visual impairments to read the copy on your website; 
  • Missing alt text for images which makes it difficult for blind and visually impaired users to understand what the images are about; 
  • Confusing links — such as links without text over an image or icon, or with an ambiguous anchor text (“Click here”, “Read more”, etc.) that create a poor user experience;
  • Missing form labels that cause confusion and slow down the checkout process, e.g. not labeling an email address field as such. 

As you can see, these accessibility issues are not incredibly complicated to fix. Tackle the following changes right away to make your online store more accessible. 

Ensure a high level of contrast

Your e-commerce website's text clarity plays a crucial role in how successful it is, as visitors can’t really engage with content that is difficult to read. In fact, small font sizes and low-contrast text are often listed among the top complaints of online readers. 

To be more specific, a contrast ratio of less than 4.5:1 between the text and background color can create readability issues. 

Make your website more accessible to all online shoppers, especially those with visual impairments, by ensuring a high level of contrast between your text and foreground and avoiding smaller fonts. If possible, allow shoppers to resize your content as they see fit. 

Accessible ecommerce website example: Nudie Jeans
Accessible e-commerce website example: Nudie Jeans

Avoid links with ambiguous text — or without text at all

When talking about web accessibility and user experience, avoiding uninformative text links, such as “Click here”, is common advice. No wonder — ambiguous anchors happen more often than you might think. 

How to fix the issue? When adding any links, make sure the accompanying text provides context for online shoppers, especially those using screen readers to navigate your online store This eliminates confusion and enables your customers to make informed decisions about whether to click on a link or not. 

So, instead of asking your shoppers to go ahead and “Click here”, consider giving more information — for example, “Read more about our latest collection” or “Explore the items on sale”. 

Also, when linking from an image or icon, which is common on e-commerce main pages, you should always add a descriptive label that will tell your customers what will happen once they click on the visual.

Accessible e-commerce site example: Zalando 
Accessible e-commerce site example: Zalando 

Don’t rely solely on colors 

Here’s the thing. E-commerce websites that rely heavily on colors as a primary UX element can be challenging or impossible for individuals with color blindness to use. 

For example, using the red color to indicate incorrect information during account setup or checkout, with no other visual or non-visual cues to explain the error, can cause confusion among such customers. Someone who is color blind may not be able to understand why they’re encountering a problem or even notice that there’s a problem in the first place.  

Of course, it doesn’t mean that you should avoid colors. There are certain UX and accessibility features, like adding descriptive labels, tooltips, underlines and error messages that help shoppers with color blindness navigate e-commerce websites easily. 

Accessible ecommerce website example: Zara
Accessible e-commerce website example: Zara

Check other accessibility features and elements on your website 

The above-mentioned changes can be implemented inexpensively and without significant technical expertise, making your site significantly more user-friendly.

To check other parts of your website for accessibility, you can use free online tools like the Accessibility Checker or WAVE. As already mentioned, it’s going to be a lengthy process, but it’s well worth it. 

Web accessibility checker example
Web accessibility checker example

Speaking of tech solutions, you can also try implementing web accessibility widgets, such as EqualWeb’s AI ToolBar. The toolbar will unfold upon clicking, showing three main remediating adjustments on your e-commerce site: Navigation, Color, and Content Adjustment. Each of them has a dropdown menu of multiple accessibility functions — 32 in total — catering to a wide range of impairment issues.

There’s a catch, though. Installing AI-powered accessibility widgets can help you improve website accessibility, but doesn't offer any guarantees when it comes to underlying legal issues. In other words, you might still be risking a lawsuit if you don't understand and act upon web content accessibility guidelines.

Accessible e-commerce site example: Bershka
Accessible e-commerce site example: Bershka

That being said, if you’re using any other widgets or third-party solutions to fuel any part of your online store, make sure they are all user-friendly and accessible. 

At Ingrid, we take web accessibility seriously and strive for compliance. If it's something that's important for you as well, let's chat to see how we can make your delivery checkout more accessible — and more profitable while we're at it.

Ingrid Delivery Checkout
Ingrid Delivery Checkout

The future is accessible 

With over one billion people worldwide having some form of disability, paying attention to commerce website accessibility is the best thing an online store can do — from an ethical, legal and business perspective. With the number of digital accessibility lawsuits on the rise, it is vital to take action sooner rather than later.

Improving website accessibility may seem like a daunting task, but it is a crucial step toward creating an inclusive shopping experience for all customers.

The good news is, you're on the right track. By now, you should already understand what ecommerce website accessibility is, and why it is important. It's time to implement the practical tips for making ecommerce websites more accessible. Every effort counts!

It might not seem like it at first, but addressing common issues such as low-contrast text, missing alt descriptions for images, or confusing links, will help you create a more user-friendly and accessible online store. You know — the kind of website that benefits every online shopper, regardless of their age, ability or location.

If you need any help once you're at it, solution partners like Ingrid are here to lead the way toward more accessible and sustainable e-commerce. Ready to join us and take action?

Improve your delivery experience

You’re one step away from scaling your business. Book a demo to find out more.

Total Black Week 2023 Volume

This text can be used to describe the data. It can also be used to explain an insight for the reader. It can end with a CTA for a blog post inviting the reader to read more.

Share of orders in 2023
Fashion
22%
Pharmacy
17%
Home & Electronics
8%
Other
54%
Change in order performance YoY
Fashion
-23%
Pharmacy
16%
Home & Electronics
-1%
Other
-13%