UK regulations require e-commerce websites to be accessible so that people with disabilities can use them. Meeting these expectations helps avoid complaints and improves the experience for all visitors.
This guide explains the core requirements, focusing on WCAG guidelines, alt text, keyboard navigation and colour contrast. It provides specific, practical steps you can take on platforms such as Shopify, WooCommerce or Magento.
Understanding the legal framework
The Equality Act 2010 places a duty on businesses to make reasonable adjustments so disabled people are not disadvantaged when using goods and services, including websites. Public sector bodies have stricter rules under the Public Sector Bodies (Websites and Mobile Applications) Accessibility Regulations 2018, but private e-commerce sites must still avoid discrimination.
These obligations change over time and enforcement varies. Always check the latest guidance on GOV.UK for current requirements. Failure to address accessibility can lead to formal complaints, requests for changes or, in some cases, legal action. The costs and disruption of reacting to a claim are usually higher than preventing problems in the first place.
Following WCAG guidelines
The Web Content Accessibility Guidelines (WCAG) are the internationally recognised standard. Most UK organisations aim for WCAG 2.1 level AA. This covers four principles: perceivable, operable, understandable and robust.
Perceivable means users must be able to see and hear content. Provide text alternatives for images and ensure sufficient colour contrast. Operable requires that all functionality is available from a keyboard and that users have enough time to read and use the site. Understandable covers clear language, predictable navigation and helpful error messages. Robust means content works with current and future assistive technologies.
Start by running your site through an automated checker such as WAVE or axe. These tools highlight many basic issues quickly. Then test manually with real users or follow structured checklists.
Writing useful alt text for product images
Every image on your store needs appropriate alternative text. Decorative images can have empty alt attributes (alt=""). Product photos and images that convey information require descriptive text.
Practical example: instead of alt="red dress", write alt="Red cotton summer dress with short sleeves and fitted waist, shown on model". This helps screen-reader users understand what the product looks like and why it matters. Keep descriptions under 100 characters where possible. On Shopify, add alt text in the image settings for each product. In WooCommerce, edit the image description field in the media library. Review all existing product images systematically; prioritise best-sellers first.
Write alt text from the perspective of someone who cannot see the image but wants to decide whether to buy the item. Avoid repeating the product name in every alt unless it adds value.
Ensuring keyboard navigation works
Many users with motor impairments or who use screen readers rely on the keyboard rather than a mouse. Every interactive element must be reachable and usable with the Tab key, Enter and arrow keys.
Test by pressing Tab repeatedly through your site. The focus indicator must be clearly visible on links, buttons, form fields and checkout steps. Skip links that let users jump straight to main content are helpful. Avoid trapping keyboard users in loops where they cannot escape a modal or video player.
On checkout pages, ensure the payment form, address fields and continue buttons are fully keyboard accessible. In Magento or WooCommerce, check that custom JavaScript does not break native focus behaviour. If you add third-party widgets for reviews or size selectors, confirm they support keyboard operation. Fix any element with a tabindex value greater than zero unless absolutely necessary, as this often creates navigation problems.
Achieving sufficient colour contrast
Text and background colours must provide enough contrast so users with low vision or colour blindness can read them. The minimum ratio for normal text under WCAG AA is 4.5:1. Larger text (24px or 19px bold) needs 3:1.
Use a contrast checker such as the WebAIM Contrast Checker or the built-in tools in browser developer tools. Common problems include light grey text on white backgrounds for secondary information or coloured buttons with white text. Adjust your brand palette early rather than fixing hundreds of product pages later.
Practical steps: set your primary button colour and test it against both light and dark backgrounds. Ensure error messages in the checkout stand out clearly. Product swatches for colours should have additional indicators (such as ticks or labels) so colour-blind users can distinguish them. Re-test after any theme update because new fonts or background images can change ratios unexpectedly.
Reducing legal risks in practice
Legal risk usually arises when a user cannot complete a purchase or access important information and then raises a complaint. Common triggers are inaccessible checkout flows, missing alt text on key images, or poor keyboard navigation on mobile menus.
Document the steps you take: record dates when you test with automated tools, fix contrast issues or add alt text. Publish an accessibility statement on your site explaining what you have done, what still needs work and how users can contact you. This shows good faith even if the site is not perfect.
Train anyone who adds content (product descriptions, images, blog posts) on basic rules. Schedule regular reviews before peak sales periods. If you receive a complaint, respond promptly, ask for specific details of the barrier and fix it. Most issues can be resolved without reaching formal legal stages if handled early.
Next steps and ongoing maintenance
Begin with a full audit of your most important pages: homepage, product category pages, individual product pages and the checkout flow. Fix critical barriers first. Then improve supporting pages such as delivery information and returns policy.
Use built-in platform tools where available. Shopify and WooCommerce both have accessibility-focused themes and apps; evaluate them carefully rather than assuming they are compliant. Test on real devices with screen readers such as VoiceOver on iOS or NVDA on Windows. Budget time each quarter to re-test after updates.
Founders based in West Yorkshire can access practical support at Loomworks in Liversedge, which offers free desks and mentoring for selected early-stage e-commerce startups. For everyone else, the key is steady, consistent improvement rather than aiming for unattainable perfection on day one.
Frequently asked questions
Do I need to meet WCAG level AA for my online shop?
WCAG 2.1 level AA is the generally accepted target for private e-commerce sites in the UK to demonstrate reasonable adjustments under the Equality Act. It is not a strict legal minimum for every private business but following it significantly reduces the chance of successful complaints. Check current GOV.UK guidance because expectations can evolve.
How do I write good alt text for product photos?
Describe the actual appearance and relevant details a customer would use to judge the product. Include colour, style, material and key features in under 100 characters. Avoid keyword stuffing. Decorative images should have empty alt text. Review alt text whenever you add new products.
What is the easiest way to test keyboard navigation?
Disconnect your mouse and use only the Tab, Shift+Tab, Enter and arrow keys to move through every page. The focus outline must be visible at all times and every button, link and form control must be reachable and activatable. Fix any elements that trap the keyboard or skip important sections.
Can I be sued for an inaccessible website in the UK?
Yes, a disabled person can bring a claim under the Equality Act if they are unable to use your site on an equal basis. Most cases are resolved by making changes rather than large payouts, but defending a claim still takes time and money. An accessibility statement and evidence of ongoing improvements help demonstrate reasonable efforts.
How often should I check my site for accessibility issues?
Run automated checks monthly and complete a fuller manual review every quarter. Always test after major updates, theme changes or new app installations. Peak sales periods are a good time to confirm the checkout flow remains fully accessible.
Related reading: Selling internationally from a UK Shopify store, Optimising individual product pages for UK Google search, Which trust signals and badges work best for UK shoppers?. Browse all e-commerce setup guides or apply to Loomworks.