8 Accessibility Blockers We Keep Finding in eCommerce Stores

In our work with online stores, accessibility issues are rarely isolated to one page. That's become especially relevant since the European Accessibility Act came into force, raising the bar for stores selling into the EU. We help stores get ahead of this with a dedicated accessibility audit; and across those audits, we keep finding the same technical barriers repeatedly, in nearly every client project we undertake.

That repetition is the key point of this post. These aren't hypothetical WCAG violations pulled from a textbook checklist. They're real patterns we've found in the codebases of fashion retailers, electronics stores, pet food stores, and subscription shops alike. Whether it's a boutique brand or an enterprise-level platform, the same fundamental accessibility hurdles keep reappearing in front of users.

We often see accessibility framed strictly as a compliance burden rather than a user experience priority. But the reality is simple: when an interface fails a screen reader or keyboard user, it almost always mirrors a frustrating, broken experience for non-disabled users too. Below are the 8 most frequent blockers we encounter across our client projects, starting with a classic homepage component that frequently breaks the buying flow.

Uncontrollable Carousels and Sliders

Carousels and sliders are eCommerce favorites for homepages, promotional campaigns, and cross-selling sections. They let store owners showcase multiple offers in a single prime visual location. Yet they consistently rank among the most common accessibility issues we encounter across client projects.

The core issue comes down to control and navigation. Custom or library-driven sliders often lack basic keyboard navigation support, meaning shoppers relying on the Tab key or arrow keys are completely unable to cycle through slides or reach the buttons inside them. Many carousels also autoplay by default, rotating every few seconds with no pause button, which is both a usability problem and a direct conflict with WCAG's requirements about moving content.

Comparison of two carousels: one without keyboard control and one with autoplay and no pause button

"Button, Button, Button": Icon-Only Controls Without Accessible Names

Modern eCommerce interfaces rely heavily on minimal, icon-driven navigation to keep headers and product cards clean. Search magnifying glasses, shopping cart bags, heart-shaped wishlists, hamburger menus, and close "X" buttons are practically universal in online shops.

Visually, their meaning is obvious. But if you strip away the visual context, as a screen reader does, that same button will announce itself only as "button" – no name, no purpose, no way to know what happens if you interact with it.

The same issue shows up with trust badges and promotional banners that are wrapped in a link but have no descriptive text behind them, so a screen reader user hears "link" or a cryptic filename instead of "Verified secure checkout" or "30% off summer sale."

Store header icons as sighted users see them versus a screen reader announcing each one only as "button"

Broken Heading Hierarchy: Visual Style vs. Page Structure

Heading levels are more than a font size. They form the structure of a webpage, helping both users and assistive technologies understand how information is organized and prioritized.

In our work, too often have we seen heading levels used for styling purposes instead of properly representing the page logic. For instance, a designer might want a promotional banner to look big and bold, leading to an <h1> tag being applied for aesthetics, while the actual product title—the most important heading on the page—gets demoted to an <h3>.

This visual-first approach breaks document logic. Screen reader users rely on headings as an interactive navigation map, using keyboard shortcuts to jump straight between major sections like product specs, delivery information, or customer reviews. When headings skip levels or jump out of order, product pages and category listings become confusing to scan—making it much harder for customers to make a purchase decision.

Comparison of a logical heading structure and a broken one with skipped heading levels

Disconnected Forms and Missing Labels

Forms are where accessibility issues tend to have the most direct impact on whether a sale completes at all. Checkout, address, login, registration, and contact forms are the usual offenders: input fields with no associated <label>, placeholder text used as a label (which disappears the moment someone starts typing), and error messages that appear visually right below a field but aren't semantically tied to it.

That last one is subtle but costly. If an error message isn't connected through aria-describedby, a screen reader user might submit a form, hear that something failed, and have no way of knowing which field caused the problem and why. On a multi-step checkout form, that's the difference between a completed order and an abandoned cart.

Checkout form as users see it versus a screen reader hearing only unlabeled "edit text" fields

Missing Focus Indicators: Shopping with an Invisible Cursor

Keyboard users navigate by knowing, at every moment, exactly where they are on the page. When focus outlines are removed without a replacement, that sense of location disappears. It is the equivalent of asking a mouse user to shop with an invisible cursor. On a long category page with filters, product cards, and a sticky header, or across a multi-step checkout, losing focus visibility even once can mean the user has no idea whether they're about to click "Apply filter" or "Remove from cart."

This is one of the more frustrating blockers because the user isn't stuck due to a lack of skill – the interface has simply gone silent on them.

Category page comparison: visible mouse cursor versus keyboard navigation with no focus indicator

Trapped Behind a Modal

Mini carts, cookie consent banners, newsletter popups, chat assistants or login windows – eCommerce stores are full of modals, and each one is a small accessibility test on its own. When a modal opens, keyboard focus needs to move into it immediately; when it closes, focus needs to return to where the user was. Otherwise, users can end up trapped behind an invisible overlay, tabbing through a page they can't see, or unable to close a pop-up that's blocking the content they came for. If a popup stops people from shopping, they won't fight with the interface—they'll just leave.

Newsletter popup comparison: keyboard focus trapped behind the modal versus focus returning to the trigger

Making Alt Text Actually Communicate

Not every image in a store carries the same weight, and that's exactly where alt text decisions tend to go wrong. A product photo, a campaign banner announcing a sale, a trust badge, or a graphic explaining delivery times often carries information the customer needs to understand. Too often, we find these treated identically: either everything gets a generic "image" alt text, or everything gets left blank.

The question isn't just whether alt text exists. It's whether the image communicates something a sighted user can understand in half a second – and if a screen reader user is getting that same information.

Promotion banner as sighted users see it versus a screen reader announcing it only as a generic image

Contrast Isn’t Just a Design Preference

Low color contrast is one of the most common issues we find, and it's rarely intentional — it's usually a side effect of minimalist design trends favoring pale text and muted palettes, combined with a lack of awareness of the required contrast ratios.

While low contrast is an immediate barrier for users with visual impairments, its impact extends to anyone shopping on a mobile device in direct sunlight, browsing on a lower-quality screen, or reading with low battery brightness.

This is one of the clear examples of accessibility and everyday usability being the same problem wearing different labels.

Product page on a phone in normal conditions versus in bright sunlight, where low-contrast text becomes unreadable

Fixing the Friction, Not Just Ticking Checkboxes

These eight issues aren't rare edge cases — they're the ones we find again and again, in stores of every size and category. And they matter for a reason that goes beyond legal risk: they show up exactly where customers are trying to make a decision. A carousel that traps keyboard focus, a form error nobody can find, a modal that won't close, a button whose purpose is invisible to a screen reader — each one is friction when a visitor is deciding whether to become a customer.

The good news is that none of these issues requires a redesign. They are all achievable within an existing design system – usually as targeted fixes, not overhauls. The pattern we see across client projects isn't that accessibility is hard to build. It's that it's easy to overlook until someone actually tests for it. With the European Accessibility Act raising the stakes, that's exactly what our accessibility audit does – it goes through your store screen by screen and shows you precisely where customers are getting stuck.

FacebookTwitterPinterest

Krzysiek Kaszanek

Senior Full Stack Engineer