Why ecommerce website accessibility is not just about disability

As we adapt to the new normal, web accessibility is even more crucial as people increasingly shop online. Yet, many ecommerce websites fall short of basic web accessibility compliance.

The lack of website accessibility isn’t just a problem for those with a disability though. It’s also damaging to ecommerce businesses that want to reach more customers.

Why does ecommerce website accessibility matter?

Having an accessible ecommerce website matters because it is good for your business, and here’s why.

Some businesses are unaware of how many people have a disability that affects their ability to use a website. But with 1 in 5 (20%) of us having a disability (figures from The Papworth Trust) and 8.5% of these having a disability that affects their ability to use a computer, it is not an insignificant number.

Having an accessible website also benefits people without disabilities, for example:

  • People using a slow Internet connection, or who have limited or expensive bandwidth.
  • People whose abilities may change as they age
  • People with ‘temporary disabilities’ for example, a broken arm.
  • People with ‘situational limitations’ such as in bright sunlight

Many websites are hard to navigate, with small text, poor contrast, and confusing forms.  These websites are difficult for anyone to use and haemorrhage customers.

Unsurprisingly, a recent study by accessiBe analysing 10 million webpages, found that most ecommerce websites are not compliant with the Web Content Accessibility Guidelines (WCAG). Many sites were not navigable by a keyboard (essential for people with a physical disability who struggle with a mouse). Furthermore, most were not compatible with screen readers.

What makes an ecommerce website accessible?

There are a few key elements on an ecommerce website which need to be accessible. This is to ensure that all users have equal access to all the content and can make a purchase.

Navigation

Users should be able to use the tab key to navigate the menu navigation including any drop-down menus. The status (i.e. open or closed) of hidden menus such as mobile or drop-down menus should be provided to users of screen readers.

Images

All images must have an Alt attribute (alternative text). These must accurately describe the objects in the image. If the image contains texts (as typical banners do) then the embedded text must also be present in the alt attribute.

Pop Ups

When a pop up appears, the keyboard focus must shift to the content in the pop up and users must be able to exit the pop up with the Esc key. Many websites (not just ecommerce websites) fail this requirement.

The big problem with pop ups is that once they do not fully comply, they break the ENTIRE compliance level of the site. When a pop up appears, it literally blocks the entire screen, making keyboard users unable to do anything about it. Screen reader users won’t even know a popup has appeared.

Forms

Forms can be visually and cognitively complex and challenging to use. Accessible forms are easier for everyone to use, not just people with disabilities.

Ecommerce websites typically have forms at checkout, account login and a general contact form.

All forms should include:

  • A “Label” tag, to identify the purpose of each field
  • Identification of required fields (both identified visually and to screen readers)
  • User notification of any missing required fields and any errors (both visually and via screen readers)
  • User notification for screen-readers when the form is submitted successfully

Search form

The search function is especially important on an ecommerce website for users to find things quickly. A search form should be accessible using a keyboard and labelled so that users of screen readers understand what it is.

Product Filters

Many ecommerce websites have product filters to help users find what they are looking for by narrowing down the results. These filters typically include checkboxes, dropdowns, and radio buttons. Users should be able to navigate and operate the filter controls with a keyboard and those using screen readers should be notified when the results are displayed.

To find out more about website accessibility and to book a review of your existing website, simply contact us using the form below or email us at hello@studiobrandup.com

About Angie Vale

Angie is Technical Director at Studio Brand Up and has been designing and building websites with WordPress for over 10 years.