How to improve the accessibility of your e-commerce site

Person shopping online on a clothes website

The popularity of online spaces has spiked in the last few years and given us the opportunity to buy and sell products and services easily, with faster than ever access to an increased number of options. Although we have a huge benefit in being able to use e-commerce sites on a day-to-day basis, people with disabilities face serious difficulties because many sites are very hard to use.

To make e-commerce sites more accessible, developers need to become aware of the techniques that can be implemented. Web Content Accessibility Guidelines (WCAG) 2.1 Level AA is the latest standard for digital accessibility and a resource that can be used to design inclusive websites. Fixing accessibility issues can remove barriers for users, avoid litigation, and improve the on-site experience for everyone.

So here are three ways to make your site more accessible:

1. Be careful with images and colours

Many e-commerce websites rely on images to display their products and services, but this can block users with vision impairments and other similar disabilities from accessing information if alternative text is not used or is poorly implemented. Clear, concise alternative text for every image and other non-text content, such as videos or charts, should be provided.

Images of text should also be avoided if possible, as screen readers and other assistive technologies can’t identify text in an image. In addition to images, colours are another important aspect of an accessible site. An appropriate colour contrast ratio of at least 4.5:1 should be used for components such as normal-sized text.

2. Make sure forms have proper descriptions and labels

Because e-commerce sites rely on forms with multiple input fields, developers need to make sure that the fields are labelled correctly and clear instructions are given for the required input.

Any instructions should be given before the start of a form and they should be concise and easy to understand. Examples may be included for inputs where certain values and formats are expected (e.g., DD/MM/YYYY, MM/DD/YYYY etc.). Each form element must also have a text label. If there are errors, users should be informed about them with specific error messages instead of using only visual indicators.

3. Make your website keyboard accessible

Some visitors with disabilities may use only a keyboard to browse the web, which is why e-commerce sites should have a keyboard-friendly design. However, an incorrect keyboard focus order could confuse users when browsing, so web developers need to implement a logical and intuitive order. This helps users to navigate the content of a site and find all the important sections faster.

Conclusion

Because basic issues can prevent people with disabilities from properly using sites for e-commerce purposes, web developers should be aware of all the techniques that can be implemented to make a website more accessible. If you would like any advice or need help with a digital inclusion issue, please don’t hesitate to contact IA Labs.