Do Shopify popups create ADA liability?

Yes, popups are one of the most cited components in ADA demand letters against e-commerce sites, because the average Shopify popup fails the basics: keyboard focus is not moved into it, not trapped inside it, and not returned when it closes. The good news is that a compliant popup is a solved problem with a clear checklist, and most failures trace back to the popup app, not the theme.

Why popups attract demand letters

Plaintiffs' firms look for barriers that are easy to demonstrate on video: load the page, press Tab, show the failure. A popup that appears on entry and cannot be dismissed by keyboard is a perfect specimen. It blocks the entire page for keyboard and screen-reader users, often within seconds of arrival, which makes the barrier both total and trivially reproducible. Unlike subtle contrast issues, there is nothing to argue about.

Shopify stores are disproportionately exposed because popups usually come from third-party apps: email capture, spin-to-win, exit intent. The merchant installs the app, the app injects its own modal code, and nobody ever tests what it does to a keyboard user. The liability sits with the store, not the app vendor.

The four classic popup failures

No focus management is the big one. When the popup opens, focus should move to the popup, ideally to its heading or first control. Most Shopify popups leave focus wherever it was, behind the modal overlay, so keyboard users keep tabbing through a page they can no longer see while the popup sits there unacknowledged. Screen-reader users may not even know the popup exists.

No focus trap is the second. Once focus is inside the popup, the Tab key should cycle within it until the popup closes. Without a trap, tabbing walks straight out of the modal and into the dimmed page behind it, where the user interacts with content they cannot see. This is disorienting for sighted keyboard users and a dead end for screen-reader users.

No keyboard dismiss is the third. The X is frequently a styled div with no button role, unreachable and inoperable by keyboard. Escape-to-close is missing too. For the keyboard user, the popup is a wall with no door: the only way past it is refreshing the page, which usually triggers the popup again.

Background not inert is the fourth. While the modal is open, the page behind it should be hidden from assistive technology and non-interactive. Most implementations skip this, so screen readers announce background content through the modal, and the tab order includes dozens of unreachable controls.

The five-minute popup audit

Open your store in a fresh browser session and wait for the popup. Press Tab: does focus move into the popup on its own? Keep tabbing: does focus stay inside, cycling through the popup's controls? Press Escape: does it close? Tab to the X and press Enter: does that close it too? Finally, close the popup and check where focus lands; it should return to the element that triggered it, or a sensible page location, not the top of the document.

Repeat with a screen reader if possible. The popup should be announced as a dialog when it opens, and the background page should go silent while it is up. If you hear page content bleeding through, the background is not inert.

What a compliant popup looks like

Use the native dialog element or an equivalent pattern: role dialog or alertdialog, an accessible name from the heading, focus moved in on open, trapped while open, Escape to close, and focus returned on close. Delay the popup so it does not fire instantly on page load; a short delay plus a frequency cap is better for conversion anyway. Honor prefers-reduced-motion for any animated entrance.

Audit the app, not just the theme. Test every popup app you install with the five-minute audit before it goes live, and re-test after app updates, which regularly regress accessibility. If the app cannot be made compliant, replace it: there are popup apps with proper dialog semantics, and the email list is not worth a demand letter.

The timing trap

One more failure deserves its own mention: popups that appear on a timer and cannot be dismissed easily penalize slow readers and users with cognitive disabilities, who may need more time before interacting. WCAG expects users to be able to turn off or extend time limits. A popup with a countdown, a spinning wheel, or a one-time offer timer that cannot be paused layers a timing barrier on top of the modal barrier. Keep promotional timers out of the modal itself.