Do Shopify popups and slide-out carts break accessibility?

Very often, yes. Popups, slide-out carts, promo modals, and chat widgets are among the most cited components in ADA demand letters against Shopify stores. The typical failures are consistent: keyboard focus is not moved into the popup, focus is not trapped inside it, screen readers are never told it opened, and there is no keyboard path to close it. Each one is fixable, but app vendors rarely fix them without pressure.

Why popups fail more than pages

Static pages are easy to make accessible: headings, labels, and alt text cover most of it. Popups are dynamic. They appear without a page load, sit above the content, and demand interaction before the customer can continue. Every one of those behaviors needs deliberate accessibility handling, and most popup apps were built for conversion metrics, not for assistive technology.

The slide-out cart is the highest-risk component because it touches the purchase path. When a customer adds an item and a cart drawer slides in, a sighted customer sees it immediately. A screen reader user hears nothing unless the drawer announces itself. A keyboard user may find their focus still sitting on the add-to-cart button while the drawer they need to interact with is somewhere else in the tab order. The customer who cannot find the cart cannot check out.

The five checks that matter

First, focus management. When the popup opens, keyboard focus should move into it, usually to the heading or the first interactive element. When it closes, focus should return to whatever opened it. Test this with only a keyboard: open the popup, and check where your focus actually is.

Second, focus trapping. While the popup is open, the Tab key should cycle within the popup, not wander off to the page behind it. A customer tabbing through a promo modal should never end up activating links on the obscured page. Third, announcements. The popup should tell screen readers it opened, through a dialog role and a label, and dynamic content inside it, like a cart total updating, should be announced.

Fourth, a keyboard-close path. Every popup needs an Escape key handler and a visible close button that keyboard users can reach. Popups that can only be closed by clicking a tiny X are a dead end for keyboard users. Fifth, timing. Popups that appear within seconds of page load or reappear aggressively punish everyone, and they are especially hostile to customers using assistive technology, who need more time to orient on each page.

Who owns the fix

For theme-built drawers and modals, your developer owns it. The fixes are standard patterns: proper dialog markup, focus management on open and close, Escape handling, and background content hidden from assistive technology while the dialog is open. A competent Shopify developer can retrofit these in hours, not weeks.

For app-built popups, the vendor owns the component and you own the risk. Email capture apps, upsell apps, and chat widgets inject their own markup, and many of them fail all five checks. Ask the vendor directly for their accessibility conformance documentation. If they cannot provide it, that is your answer about their priorities. Switching to an accessible alternative is often faster than waiting for a vendor roadmap.

What to do this week

Inventory every popup, drawer, and modal on your store, including the ones apps inject. Test each with keyboard only: open it, tab through it, close it with Escape, and confirm focus lands somewhere sensible. Note every failure with the component name and the vendor. Fix theme components first since you control them, and open tickets with app vendors for the rest. Then retest, because popup fixes have a habit of breaking the next popup in line.