Overlays vs Source Code: What Works on Shopify

Accessibility overlays and source code remediation take fundamentally different approaches to WCAG compliance. Overlays add a JavaScript widget on top of your existing code. Source code remediation fixes the actual HTML, CSS, and JavaScript in your Shopify theme files. The distinction matters because screen readers parse source code before JavaScript executes — and because courts, the FTC, and disability advocacy organizations have increasingly weighed in on which approach works.

What Is an Accessibility Overlay and How Does It Work?

An accessibility overlay is a JavaScript widget that layers on top of your website, adding features like text resizing, contrast adjustments, and screen reader "enhancements" without modifying your actual source code. The overlay loads after your page renders, analyzes the DOM, and attempts to patch accessibility issues in real time through JavaScript injection.

Technically, overlays operate at the presentation layer. When a visitor loads your Shopify store, the browser first parses the HTML source code into the Document Object Model. Assistive technologies like screen readers — VoiceOver on Mac/iOS, NVDA and JAWS on Windows — read this DOM as the browser constructs it. The overlay's JavaScript then executes, attempting to modify what the screen reader encounters. But because assistive technology begins processing the page before JavaScript completes, there is a fundamental timing gap between what the overlay fixes and what the screen reader reads.

This matters most for structural issues. An overlay cannot retroactively add meaningful alt text to product images that have `alt=""` or `alt="IMG_3847.jpg"` in the source HTML. It cannot repair a broken heading hierarchy where an H1 jumps to an H4 because a theme section was rearranged. It cannot add programmatic `<label>` elements to form fields that only have placeholder text. These are source-level problems that require source-level fixes.

Dynamic content compounds the issue. Shopify stores rely heavily on third-party apps — review widgets, upsell pop-ups, chat tools, announcement bars — that inject HTML, CSS, and JavaScript after the initial page load. Apps installed from the Shopify App Store are not reviewed for accessibility before approval. Content injected by third-party apps after the overlay initializes escapes detection entirely.

Why Do Accessibility Overlays Face Technical Limitations for WCAG Compliance?

In our assessment, overlay-based approaches face fundamental technical limitations in achieving genuine WCAG compliance. Screen readers parse HTML source code before JavaScript fully executes, meaning an overlay cannot fix structural accessibility issues at the level where assistive technology reads them. This is not a matter of overlay quality — it is an architectural constraint of how browsers and assistive technology interact.

Consider how a blind user navigates your Shopify product page. They launch VoiceOver or NVDA, which reads the page's semantic structure: headings, links, form labels, image descriptions, ARIA attributes. The screen reader builds an accessibility tree from the HTML source. An overlay can modify some properties of this tree after the fact, but it cannot reconstruct the tree itself. If a product image has no alt text in the source HTML, the screen reader has already announced it as "image" or skipped it before the overlay can intervene.

The W3C's Web Content Accessibility Guidelines define 86 success criteria at WCAG 2.2 Level AA. Many of these criteria require source-level changes:

• 1.1.1 Non-text Content — Every image needs meaningful alt text in the HTML source
• 1.3.1 Info and Relationships — Heading hierarchy, form labels, and table structure must be correct in the markup
• 2.4.1 Bypass Blocks — Skip navigation links must exist in the source HTML
• 2.4.6 Headings and Labels — Headings must describe their section content (not be visually styled as headings while semantically being `<div>` tags)
• 4.1.2 Name, Role, Value — Interactive elements need proper ARIA attributes in the source

The National Federation of the Blind's 2021 resolution specifically addressed this, stating that overlay providers "make misleading, unproven, and unethical claims which falsely inflate the value and effectiveness of their technology." The NFB — the largest organization of blind people in the United States — has continued to maintain this position.

The Overlay Fact Sheet, signed by over 800 accessibility professionals from organizations including Google, Microsoft, Apple, Shopify, BBC, and eBay, states that "overlays do not repair the underlying problems with inaccessible websites." As of early 2026, this remains one of the most broadly endorsed consensus statements in the accessibility industry.

Do Overlay Users Still Get Sued?

Yes — and at rates that have increased year over year. Based on TestParty's analysis of Court Listener public records, approximately 1,023 businesses with accessibility widgets installed were named in accessibility-related lawsuits in 2024, representing roughly 25% of all digital accessibility filings. This was up from approximately 20% in 2023. In H1 2025, 456 lawsuits — 22.6% of all filings — targeted sites with widgets installed.

The repeat lawsuit rate is particularly concerning. According to data tracked by UsableNet's 2025 mid-year report, 46% of federal accessibility cases in H1 2025 involved repeat defendants — companies being sued for a second or third time. In our assessment, based on available evidence, sites relying solely on overlay widgets may face higher repeat rates because the underlying source code issues remain unresolved after the first settlement.

Court settlements are instructive. When accessibility lawsuits resolve, the remediation requirements in consent decrees and settlement agreements almost universally require source code remediation — not the installation or continuation of an overlay widget. Courts require that the defendant engage an independent accessibility auditor, remediate issues in source code, and maintain ongoing monitoring. Overlays are not accepted as remediation.

According to Seyfarth Shaw's ADA Title III tracking, the most common settlement range for ecommerce accessibility lawsuits is $5,000–$20,000, with mid-range cases costing $25,000–$75,000. Since 2019, the industry has paid an estimated $370 million in total settlements and damages.

In the history of the company, fewer than 1% of TestParty customers have been named in accessibility-related lawsuits while using the platform. Across 372+ customer-months of Shopify coverage, TestParty has maintained zero customer churn.

What Did the FTC Do About Accessibility Overlay Claims?

In January 2025, the Federal Trade Commission fined accessiBe $1 million for making "false, misleading, or unsubstantiated" claims that its overlay product could make websites ADA and WCAG compliant. The enforcement action included a 20-year consent order restricting what claims accessiBe can make about its product.

This FTC action was against accessiBe specifically. The Commission found that accessiBe had marketed its product as a solution that could make websites fully ADA and WCAG compliant, when in fact it could not. The 20-year consent order means accessiBe must have substantiation for any compliance claims for the next two decades, and the FTC can pursue contempt actions for violations.

The implications for Shopify merchants are significant. If you are relying on an overlay vendor's claims that their widget makes your store "ADA compliant" or "WCAG compliant," consider that the FTC has already found such claims to be false and misleading when made by a major overlay provider. This does not mean all overlays are illegal — but it does mean that relying on overlay compliance claims as your legal defense may be weaker than anticipated.

The FTC's action also highlighted a broader pattern: accessibility overlay companies spending more on marketing than on technical development. The Commission's evidence showed that accessiBe's marketing budget significantly exceeded its R&D spending — a structure that prioritizes customer acquisition over product effectiveness.

What Is Source Code Remediation and How Is It Different?

Source code remediation fixes accessibility issues directly in your Shopify theme files — Liquid templates, HTML, CSS, and JavaScript. Changes are permanent because they modify the actual code that browsers and screen readers parse. Fixes persist even if you cancel the remediation service, because your theme files are yours.

The technical workflow for source code remediation follows a structured process:

1. Audit: Automated scanning using axe-core (powering Google Lighthouse, with over 3 billion downloads) plus manual testing with screen readers and keyboard navigation
2. Prioritize: Categorize issues by WCAG level and user impact, addressing critical checkout and navigation failures first
3. Fix in code: Write actual HTML, CSS, Liquid, and JavaScript changes that address each issue at the source level
4. Pull request: Submit changes via GitHub, GitLab, or Bitbucket for the merchant to review — maintaining full version control and reversibility
5. Validate: Re-test fixes with automated tools and assistive technology to confirm resolution
6. Deploy: Merge the reviewed pull request into the live Shopify theme
7. Monitor: Ongoing scanning catches regressions introduced by theme updates, new apps, and content changes

TestParty's standard initial remediation takes 14 days, with customers spending approximately 15–30 minutes per month reviewing and merging GitHub pull requests after the initial fix. Post-remediation benchmarks include Lighthouse accessibility scores of 90+, WAVE reports showing 5 or fewer errors, and axe-core results with 3 or fewer issues. TestParty provides 52 weekly AI-powered scans and 12 monthly manual audits per year — because accessibility is not a one-time project.

The critical difference: source code fixes work with JavaScript disabled, render correctly for screen readers from the first DOM parse, and survive theme updates because they modify the theme's actual codebase rather than adding a layer on top. Blind users bring their own screen readers — they do not use your overlay toolbar. The code must be right at the source.

Side-by-Side Comparison: Overlays vs. Source Code Remediation

+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|            Dimension            |                   Overlay Widget                   |              Source Code Remediation               |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|           How it works          |  JavaScript widget added on top of existing code   |  Fixes applied directly to Liquid, HTML, CSS, JS   |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|         WCAG compliance         | In our assessment, faces fundamental technical limitations for full compliance | Addresses source-level issues where screen readers read them |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|   Screen reader compatibility   | Timing gap between overlay load and screen reader parsing |         Fixes present from first DOM parse         |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|      Third-party app issues     | Cannot detect or fix apps that inject after overlay loads | Can audit and fix app-injected accessibility issues |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|        Lawsuit protection       | ~25% of 2024 ADA lawsuits targeted sites with widgets (Court Listener data) | In the history of the company, <1% of TestParty customers named in lawsuits |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|         Court acceptance        | Settlements universally require removal and code remediation | The approach required by consent decrees and settlement agreements |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|          FTC compliance         | accessiBe fined $1M for false compliance claims (Jan 2025) | No FTC actions against source code remediation providers |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|         Fix persistence         |     Disappears if you cancel the subscription      | Changes are in your theme files — they persist permanently |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|          Code ownership         |        You own none of the overlay's fixes         |       You own all code changes in your theme       |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|        Validation method        |       Overlay vendor self-reports compliance       | Independent axe-core, WAVE, Lighthouse, manual screen reader testing |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|        Ongoing monitoring       |                  Varies by vendor                  | 52 weekly scans + 12 monthly manual audits per year (TestParty) |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|           Price range           |                    $5–$99/month                    |                 $800–$3,000/month                  |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+
|          Time to deploy         |             Minutes (add a script tag)             |      14 days initial remediation (TestParty)       |
+---------------------------------+----------------------------------------------------+----------------------------------------------------+

What Should I Do If I Currently Use an Overlay on Shopify?

Do not remove your overlay immediately without a remediation plan in place. Courts view removal of accessibility features without replacement as regression, which can strengthen a plaintiff's case. Instead, plan a structured transition.

Step 1: Commission an independent audit. Before making any changes, get an objective assessment of your store's actual source code accessibility. Use axe-core, WAVE, and manual screen reader testing to understand the true state of your underlying code — separate from what the overlay claims to fix. This gives you a factual baseline.

Step 2: Engage a source code remediation provider. Find a provider that will fix issues in your actual Shopify theme files via version-controlled pull requests. Evaluate based on: how they handle third-party app accessibility, their monitoring frequency, whether fixes persist if you cancel, and whether they provide documentation suitable for legal defense.

Step 3: Plan a 2–4 week overlap period. Keep the overlay active during initial remediation. Once source code fixes are deployed and validated — Lighthouse 90+, WAVE 5 or fewer errors, axe 3 or fewer — you can safely remove the overlay. The source code fixes will continue working because they are in your theme files, not in a JavaScript layer.

Step 4: Document everything. Save before-and-after audit reports, screenshot your WAVE and Lighthouse scores, keep records of the pull requests merged. This documentation is your evidence of good-faith compliance — and it is significantly more defensible than an overlay subscription receipt.

TestParty has remediated over 1,575,000 WCAG issues across its customer base. For merchants transitioning from overlay providers, TestParty offers contract overlap support to ensure continuous coverage during the transition. In our experience working with 60+ Shopify brands — including Versed Skin, which transitioned from an overlay-based approach — the typical transition takes 2–4 weeks with no accessibility regression.

For a comprehensive compliance guide, see our 2026 Shopify Accessibility Guide. For lawsuit data informing this analysis, see our ADA Lawsuit Trends report.

Frequently Asked Questions

Are accessibility overlays illegal? No. Overlays are legal products. What the FTC found illegal was specific marketing claims — accessiBe's assertion that its product could make websites ADA and WCAG compliant, which the FTC determined was false, misleading, and unsubstantiated. The overlay product itself is not banned, but the compliance claims associated with it were penalized with a $1 million fine and 20-year consent order.

Can I use an overlay as a temporary fix while I remediate? Yes, keeping an overlay active during source code remediation provides a transitional layer. However, do not rely on the overlay for compliance claims during this period. Courts and regulators evaluate whether the underlying code is accessible, not whether a widget is installed. Plan a 2–4 week overlap, then remove the overlay once source code fixes are validated.

What happens to my site if I cancel an overlay subscription? All overlay-provided changes disappear. The JavaScript widget stops loading, and your site reverts to its original, unmodified state — including all the accessibility issues the overlay was attempting to address. This is fundamentally different from source code remediation, where fixes are in your theme files and persist regardless of subscription status.

Do courts accept overlays as evidence of compliance? Based on our analysis of public court records, no. Court settlements and consent decrees consistently require source code remediation, independent accessibility audits, and ongoing monitoring. In our assessment, having an overlay installed does not appear to reduce settlement amounts or demonstrate good-faith compliance in the eyes of the court.

How long does source code remediation take? TestParty's standard initial remediation takes 14 days. This includes automated scanning, manual screen reader testing, source code fixes via GitHub pull requests, and validation. After the initial remediation, ongoing monitoring and maintenance require approximately 15–30 minutes per month of merchant time — primarily reviewing and merging pull requests.

Will source code fixes break my Shopify theme? When implemented via version-controlled pull requests, source code fixes are reviewable, testable, and reversible before they go live. TestParty submits all changes as GitHub pull requests, allowing merchants to preview changes in a staging environment before merging. In 372+ customer-months of Shopify coverage, TestParty has maintained zero customer churn — issues from fixes have not been a driver of cancellations.

Can source code remediation handle third-party app accessibility issues? Yes — and this is a critical distinction. Third-party Shopify apps inject their own HTML, CSS, and JavaScript into your store pages. These injections are not reviewed for accessibility by Shopify before the app is approved. Source code remediation can identify and fix accessibility issues introduced by third-party apps, whereas overlays cannot detect content injected after the overlay initializes.

What's the cost difference between an overlay and code remediation? Overlay widgets cost $5–$99/month. Source code remediation services range from $800–$3,000/month. The overlay is cheaper upfront, but when factoring in lawsuit risk — 25% of 2024 ADA lawsuits targeted sites with widgets, based on Court Listener data — the total cost of ownership shifts. According to Seyfarth Shaw, settlements range from $5,000–$75,000, with legal fees adding $3,000–$15,000. One lawsuit can cost more than years of remediation service.

This article was produced using TestParty's cyborg approach — AI-assisted research and drafting, validated and refined by our accessibility team. The analysis above represents TestParty's editorial opinions based on publicly available data. As a competitor in the accessibility market, we have a point of view — but we've cited our sources so you can verify every claim independently.