RatedWithAI

RatedWithAI

Accessibility scanner

Free Scan
Blog/Compliance Guides

Squarespace ADA Compliance Guide 2026: Make Your Site Accessible & Avoid Lawsuits

Squarespace powers over 4 million websites — and none of them are ADA compliant by default. This is the complete guide to fixing accessibility issues on your Squarespace site before a lawsuit finds you first.

Published: February 25, 202615 min read
⚠️

Squarespace sites are NOT ADA compliant by default

Squarespace's own accessibility page states: "This sometimes means the end product is not fully accessible to everyone." The responsibility falls on you — the site owner.

1. Why Your Squarespace Site Needs ADA Compliance

If you have a Squarespace website for your business, portfolio, restaurant, or service — you're legally required to make it accessible. Here's why this isn't optional in 2026:

4,000+

ADA website lawsuits filed in 2025

$15K–$50K

average lawsuit cost (settlement + legal fees)

1 in 4

US adults live with a disability (CDC)

The Americans with Disabilities Act (ADA) requires that places of public accommodation be accessible to people with disabilities. Federal courts have consistently ruled that websites qualify — including business sites, portfolios, and online stores built on Squarespace.

ADA lawsuits against websites have grown every year since 2018. Plaintiff firms use automated scanning to identify sites with obvious violations, then file lawsuits in bulk. 90% of these lawsuits come from just 16 law firms, and they specifically target small businesses that are unlikely to fight the case in court.

Beyond legal protection, accessible websites perform better. They rank higher in search engines (Google rewards semantic HTML and alt text), reach more customers (26% of US adults have a disability per the CDC), and provide a better experience for everyone — including people on mobile devices, older users, and those with temporary impairments.

The compliance standard used is WCAG 2.1 Level AA — the Web Content Accessibility Guidelines published by the W3C. The Department of Justice has explicitly cited WCAG 2.1 AA as the standard in its ADA Title II final rule (April 2024), and courts consistently use it as the benchmark in Title III cases.

2. Is Squarespace ADA Compliant by Default?

Short Answer: No.

Squarespace's own accessibility page states: "Squarespace gives every customer the ability to customize their site. This sometimes means the end product is not fully accessible to everyone." The platform provides tools, but compliance is your responsibility.

Here's what Squarespace provides vs. what falls on you:

✅ What Squarespace Provides

  • • Semantic HTML in 7.1 templates
  • • Alt text fields for images
  • • Basic ARIA landmarks in newer templates
  • • Skip-to-content links (7.1)
  • • Focus styles on interactive elements
  • • Language attribute on HTML element
  • • Built-in form labels

❌ What You Must Handle

  • • Actually writing alt text for every image
  • • Ensuring color contrast meets 4.5:1 ratio
  • • Maintaining proper heading hierarchy
  • • Adding captions/transcripts to videos
  • • Custom CSS/code accessibility
  • • Third-party embed accessibility
  • • Link text that makes sense out of context
  • • PDF and document accessibility
  • • Testing with screen readers

Think of Squarespace like building materials: the foundation can be solid, but the house you build with it determines whether it's accessible. Every image without alt text, every low-contrast color choice, and every "Click here" link is an accessibility barrier you created.

3. Squarespace 7.0 vs 7.1: Accessibility Differences

This matters more than most Squarespace users realize. Version 7.1 has significantly better accessibility than 7.0, and if you're still on 7.0, migrating may be the single most impactful thing you can do.

Feature7.07.1
Semantic HTML structureVaries by template✅ Consistent
Skip-to-content link❌ Missing on most✅ Built-in
ARIA landmarks⚠️ Inconsistent✅ Standard
Keyboard navigation⚠️ Varies widely✅ Improved
Heading hierarchy❌ Often broken⚠️ Better, not perfect
Focus indicators⚠️ Minimal✅ Visible
Mobile responsiveness✅ Good✅ Good
Custom template selection60+ templatesSingle flexible system

💡 If You're on 7.0: Consider Migrating

Squarespace 7.0 templates have inconsistent accessibility because each template was built independently. Some (like Brine and Bedford) are better than others, but none match 7.1's unified framework. If your site is due for a redesign, 7.1 is the clear choice for accessibility.

Important: Even on 7.1, you're not automatically compliant. The template gives you a better foundation, but your content decisions — colors, images, headings, media — determine whether the finished site meets WCAG 2.1 AA.

4. Most Common Squarespace Accessibility Issues

These are the WCAG violations we see most frequently on Squarespace sites:

Missing or Empty Alt Text on Images

Critical • WCAG 1.1.1
ImpactScreen reader users can't understand images, galleries, or portfolio items
How to FixClick each image → Design → Image → add alt text. For decorative images, add empty alt text via custom code (alt="")
Prevalence80%+ of Squarespace sites

Insufficient Color Contrast

Critical • WCAG 1.4.3
ImpactLow-vision users can't read text, especially on hero images and light-colored backgrounds
How to FixUse a contrast checker to verify all text/background pairs meet 4.5:1 for normal text and 3:1 for large text
Prevalence75%+ of sites

Text Over Images Without Sufficient Contrast

Critical • WCAG 1.4.3
ImpactHero banners, portfolio overlays, and gallery captions become unreadable
How to FixAdd semi-transparent overlays behind text, use Squarespace's overlay opacity setting, or move text to solid-background sections
Prevalence70%+ of sites

Broken Heading Hierarchy

High • WCAG 1.3.1
ImpactScreen reader users can't understand page structure or navigate by headings
How to FixUse headings in order (H1 → H2 → H3). Don't skip levels. Use only one H1 per page (the page title). Don't use headings for visual styling
Prevalence68% of sites

Non-Descriptive Link Text

High • WCAG 2.4.4
ImpactScreen reader users navigating by links hear 'click here' or 'read more' without context
How to FixReplace 'Click here' with descriptive text like 'View our pricing plans' or 'Read the accessibility compliance guide'
Prevalence65% of sites

Videos Without Captions

High • WCAG 1.2.2
ImpactDeaf and hard-of-hearing users can't access video content
How to FixUpload captioned videos, add SRT/VTT caption files, or use YouTube/Vimeo embeds with captions enabled
Prevalence60%+ of sites with video

Inaccessible Gallery and Lightbox

High • WCAG 2.1.1
ImpactKeyboard users can't navigate through galleries or close lightbox overlays
How to FixTest gallery keyboard navigation. If lightbox traps focus or isn't keyboard-navigable, consider disabling lightbox and linking to full-size images directly
Prevalence55% of portfolio sites

Missing Form Error Messages

Medium • WCAG 3.3.1
ImpactUsers can't understand what went wrong when form submission fails
How to FixSquarespace built-in forms handle this reasonably well, but custom forms need explicit error messaging associated with the failed field
Prevalence40% of sites

5. Step-by-Step Compliance Guide

Follow these 8 steps to bring your Squarespace site into WCAG 2.1 AA compliance. Start with the automated scan, then work through the manual fixes.

1

Run a Free Accessibility Scan

Start by understanding where you stand. Use a free automated scanner to identify WCAG violations across your site. This gives you a baseline and a prioritized list of issues to fix.

🔍 Scan your Squarespace site for free — No signup required. Powered by axe-core, the same engine used by Google Lighthouse.

2

Check Your Squarespace Version

Go to Settings → Advanced → Version in your Squarespace dashboard to check whether you're on 7.0 or 7.1. If you're on 7.0 and your scan reveals significant structural issues, seriously consider migrating to 7.1 before investing time in manual fixes.

3

Fix Color Contrast Issues

This is often the most widespread issue. Go to Design → Site Styles and check every color combination:

  • Body text on background: must meet 4.5:1 contrast ratio
  • Large text (18px+ or 14px+ bold): must meet 3:1
  • Buttons: both text color AND button color against background
  • Navigation links: active, hover, and default states
  • Footer text and links
  • Text overlaying hero images or banner sections

Use our free color contrast checker to test specific color combinations.

4

Add Alt Text to Every Image

Go through every page and add meaningful alt text to every image:

  • Content images: Describe what the image shows and why it matters
  • Product images: Include product name, color, material, and key features
  • Portfolio images: Describe the project, medium, and notable elements
  • Decorative images: Leave alt text empty (Squarespace doesn't easily support this — use custom code with alt="" via Code Block or Developer Mode)
  • Logo: Use your company name as alt text

How: Click any image → Design → Image → enter alt text in the "Image alt text" field. For gallery images: click the gallery → Design → click individual images to add alt text.

5

Fix Heading Structure

Review every page's heading hierarchy. Common Squarespace mistakes:

  • Using H1 for visual styling (multiple H1s on one page)
  • Skipping from H2 to H4 (H3 is missing)
  • Using bold text instead of proper headings
  • Using headings for pull quotes or emphasis

Rule: One H1 per page (the page title). Subheadings flow H2 → H3 → H4. In Squarespace, select text and use the heading dropdown to set the correct level. If you want something to look big but isn't a heading, use custom CSS to style regular text.

6

Make Links Descriptive

Replace all generic link text with descriptive phrases:

❌ Bad

  • "Click here"
  • "Read more"
  • "Learn more"
  • "Here"

✅ Good

  • "View our pricing plans"
  • "Read the compliance guide"
  • "Learn about WCAG standards"
  • "Download the accessibility checklist"
7

Test Keyboard Navigation

Put your mouse aside and navigate your entire site using only the keyboard:

  • Tab: Move through all interactive elements (links, buttons, form fields)
  • Enter: Activate links and buttons
  • Space: Activate buttons, check checkboxes
  • Escape: Close modals, menus, popups
  • Arrow keys: Navigate within menus and galleries

If you get "trapped" anywhere (Tab doesn't move you past an element) or can't reach something, that's a WCAG 2.1.1 or 2.1.2 failure.

8

Set Up Monitoring

Accessibility isn't one-and-done. Every time you add a new page, upload an image, or change your design, you could introduce new violations. Set up continuous monitoring to catch issues before a lawsuit does. RatedWithAI monitoring plans start at $29/month and scan your site automatically, alerting you to new WCAG violations.

6. Template Accessibility Audit

Your Squarespace template determines the baseline accessibility of your site. Here's what to audit in your template:

Navigation Menu

  • Can you open/close the mobile menu with keyboard?
  • Do dropdown menus work with Tab + Enter/Space?
  • Is the current page indicated (not just visually)?
  • Does the menu have proper ARIA roles (nav, menu, menuitem)?

Page Structure

  • Is there a visible skip-to-content link? (Tab once on any page — it should appear)
  • Does the page use landmark roles (header, main, footer, nav)?
  • Is the page title unique and descriptive?
  • Does the HTML lang attribute match your content language?

Interactive Elements

  • Do all buttons and links have visible focus indicators?
  • Can accordion/FAQ sections be toggled with keyboard?
  • Do slideshow/carousel controls work without a mouse?
  • Can popup/modal dialogs be closed with Escape?

Footer

  • Are social media icon links labeled (aria-label for screen readers)?
  • Is footer text contrast sufficient against the background?
  • Are footer links distinguishable from regular text?

7. Images, Video & Media Accessibility

Images

Every image on your Squarespace site needs appropriate alternative text:

Product photo: "Hand-poured soy candle in amber glass jar, vanilla bourbon scent, 8oz"
Portfolio piece: "Modern minimalist logo design for Atlas Coffee Roasters, black text on white background"
Team photo: "Sarah Chen, Lead Designer, smiling in the studio workspace"
Don't: "image", "photo", "IMG_4521.jpg", "banner"

Video

Video content on Squarespace requires:

  • Captions for all pre-recorded video (WCAG 1.2.2) — upload to YouTube/Vimeo with captions enabled, then embed
  • Audio descriptions for video where visual content conveys information not in the audio (WCAG 1.2.5)
  • No autoplay with sound — Squarespace background videos are muted by default (good), but any embedded video with autoplay+sound must allow immediate pausing
  • Transcripts for audio-only content (podcasts, audio clips)

Background Videos

Squarespace allows background video on banner sections. Accessibility considerations:

  • Background videos are muted and autoplay by default — this is fine for WCAG
  • Ensure any text overlaying the video maintains sufficient contrast in all frames
  • Avoid rapidly flashing content (seizure risk, WCAG 2.3.1)
  • If the video conveys meaningful information, provide that content in text form elsewhere

8. Forms, Navigation & Interactive Elements

Forms

Squarespace's built-in form blocks have decent baseline accessibility — labels are associated with fields, and basic validation exists. However, watch for:

  • Newsletter popups: Squarespace promotional popups can trap keyboard focus. Test that you can close them with Escape and that focus returns to the page
  • Custom forms: If you're using Code Block or third-party form embeds (Typeform, JotForm, Google Forms), their accessibility varies widely — test each one independently
  • Required fields: Ensure required fields are indicated both visually (asterisk) and programmatically (required attribute)
  • Error messages: When a form submission fails, the error should be announced to screen readers and associated with the specific field

Navigation

Navigation is critical for all users. Key requirements:

  • Mobile hamburger menu: Must open/close with keyboard. The menu button needs an aria-label ("Open navigation menu") and aria-expanded state
  • Dropdown submenus: Must be navigable with arrow keys and closeable with Escape
  • Active page indication: The current page should be indicated with aria-current="page" (Squarespace 7.1 handles this, 7.0 may not)
  • Consistent navigation: Navigation should appear in the same location and order on every page (WCAG 3.2.3)

Accordion & FAQ Blocks

Squarespace's accordion block (commonly used for FAQs) needs:

  • Toggle with Enter or Space key
  • aria-expanded="true/false" to indicate open/closed state
  • Focus visible on the toggle button
  • Content properly hidden from screen readers when collapsed

9. Custom Code & Third-Party Integrations

If you've added custom code or third-party integrations to your Squarespace site, those are your responsibility for accessibility — Squarespace's built-in accessibility doesn't extend to custom additions.

Common Third-Party Embeds to Audit

Medium Risk
Calendly / Acuity

Booking widgets vary in keyboard accessibility. Test the full flow: selecting a date, time, and completing the booking

High Risk
Mailchimp / ConvertKit popups

Third-party popup forms often trap keyboard focus, lack form labels, and don't close with Escape

High Risk
Instagram feed embeds

Most Instagram feed plugins generate images without alt text and aren't keyboard-navigable

Medium Risk
Google Maps

Google Maps embeds are reasonably accessible but need a descriptive title attribute on the iframe

Medium Risk
Chat widgets (Intercom, Drift)

Most modern chat widgets are fairly accessible, but test keyboard flow and screen reader announcements

Low Risk
Payment processors (Stripe, PayPal)

Major payment processors maintain good accessibility in their hosted forms

Varies Risk
Custom JavaScript

Any custom JS that creates interactive elements must handle keyboard events, focus management, and ARIA states

⚠️ The Custom Code Rule

Every line of custom CSS or JavaScript you add to Squarespace is a potential accessibility liability. Common issues: display: none hiding content from screen readers, outline: none removing focus indicators, click handlers that don't work with keyboard, and custom animations that cause motion sickness. Audit everything in your Settings → Advanced → Code Injection.

10. Why Overlay Widgets Won't Protect You

You may have seen Squarespace sites with accessibility toolbar widgets — small icons that open a panel offering font size adjustments, high contrast modes, and reading aids. These are called accessibility overlays, and they don't work.

The Evidence Against Overlays

  • 🚫 800+ accessibility professionals signed the Overlay Fact Sheet opposing their use
  • 🚫 The National Federation of the Blind officially denounced overlay solutions and terminated sponsorship from the largest overlay provider
  • 🚫 400+ websites using overlays were still sued for accessibility violations in 2024
  • 🚫 Zero courts have accepted an overlay as proof of ADA compliance
  • 🚫 Overlay providers themselves have been named as defendants in lawsuits

Overlays can't fix what they can't reach: missing alt text in your CMS, broken heading hierarchy, inaccessible third-party embeds, PDF documents, video captions, or custom code. They add a visible widget that creates an appearance of accessibility while leaving the underlying issues untouched.

For a deeper analysis, read our comprehensive guide: Accessibility Widgets: Do They Actually Work?

11. Squarespace Commerce Accessibility

If you're using Squarespace Commerce to sell products, your store has additional accessibility requirements beyond a standard informational site.

Product Pages

  • Product images: Every product photo needs alt text describing the product (name, color, material, use)
  • Product variants: Size/color selectors must be keyboard-accessible and announce the selected option to screen readers
  • Price information: Must be programmatically associated with the product (not just an image of the price)
  • Add to cart button: Must be keyboard-accessible with a clear label
  • Sale indicators: Original and sale prices should be distinguishable by more than color (e.g., strikethrough text with "Was/Now" labels)

Cart & Checkout

  • Cart updates: When quantity changes or items are removed, the change should be announced to screen readers
  • Checkout forms: Squarespace handles checkout forms reasonably well, but verify all fields are labeled and error messages are clear
  • Order confirmation: Must be accessible — avoid relying solely on color to indicate success/failure

Category & Collection Pages

  • Product grid/list must be navigable by keyboard
  • Filter and sort controls need proper labels and keyboard access
  • Product cards should use heading structure (product name as heading)
  • "Quick view" modals must trap focus correctly and close with Escape

12. Ongoing Monitoring & Maintenance

Accessibility compliance isn't a project — it's a process. Your site changes constantly: new pages, updated content, new images, template updates, and third-party changes. Each change can introduce new violations.

Recommended Monitoring Cadence

Weekly:Automated scan of key pages (homepage, contact, top landing pages)
Monthly:Full-site automated scan + manual review of new content
Quarterly:Keyboard navigation test of all page types + screen reader spot-check
Annually:Comprehensive manual audit + update accessibility statement

🔍 Automate the Boring Parts

RatedWithAI monitoring scans your Squarespace site automatically and alerts you when new WCAG violations appear. Starting at $29/month — less than what most Squarespace users pay for their site plan itself. Catch issues before a lawsuit does.

13. Cost: Compliance vs. Lawsuit

Squarespace site owners often delay accessibility because of perceived cost. Here's the reality:

ApproachAnnual CostWhat You Get
DIY (free tools)$0Manual scanning, no monitoring, no alerts
Automated monitoring$348/yr ($29/mo)Continuous scanning, alerts on new issues, compliance reports
Overlay widget$490–$3,600/yrVisual toolbar only — doesn't fix code, not accepted by courts
Professional audit$3,000–$15,000One-time comprehensive assessment with remediation report
ADA lawsuit (settlement)$5,000–$25,000Settlement only — still must fix the site afterward
ADA lawsuit (full)$15,000–$50,000+Settlement + legal defense + remediation + ongoing compliance

The math is simple

A year of automated monitoring ($348) costs less than 3% of the average ADA lawsuit. For Squarespace business plan users paying $276/year for hosting, adding $348/year for accessibility monitoring is a reasonable cost that protects a much larger investment.

14. Frequently Asked Questions

Is Squarespace ADA compliant by default?

No. While Squarespace provides some accessibility foundations (semantic HTML in 7.1, alt text fields, basic ARIA), their own accessibility page states the end product may not be fully accessible. The site owner is responsible for ensuring compliance through proper content, color choices, alt text, and testing.

Can my Squarespace site be sued for ADA violations?

Yes. Any business website can be sued under ADA Title III as a place of public accommodation. Over 4,000 ADA website lawsuits were filed in 2025. Squarespace sites are not exempt — the platform doesn't shield you from legal liability for accessibility issues on your site.

What's the difference between Squarespace 7.0 and 7.1 for accessibility?

Squarespace 7.1 has significantly better built-in accessibility: consistent semantic HTML, skip-to-content links, improved ARIA landmarks, better keyboard navigation, and visible focus indicators. Version 7.0 varies widely by template, with some (Brine, Bedford) being better than others. If accessibility is a priority, 7.1 is the clear choice.

Does Squarespace offer any built-in accessibility tools?

Squarespace provides alt text fields for images, basic form accessibility in built-in form blocks, and links to external resources like the A11y Project. However, it does not include a built-in accessibility scanner, compliance checker, or monitoring tool. You'll need external tools to audit your site.

Should I use an accessibility overlay plugin on my Squarespace site?

No. Accessibility overlays have been condemned by 800+ accessibility professionals (Overlay Fact Sheet), denounced by the National Federation of the Blind, and rejected by courts as proof of compliance. Over 400 sites using overlays were sued in 2024. They cost $490-$3,600/year without fixing underlying issues. Use code-level scanning and manual fixes instead.

How much does Squarespace ADA compliance cost?

Free with DIY effort (manual fixes + free scanners), $29-99/month for automated monitoring, or $3,000-$15,000 for a professional audit. Compare this to an ADA lawsuit averaging $15,000-$50,000+. The $29/month monitoring option ($348/year) is less than 3% of the average lawsuit cost.

Which Squarespace pages should I prioritize for accessibility?

Start with your highest-traffic pages: homepage, contact/about page, main service or product pages, and any page with forms. Then expand to all remaining pages. Pages with the most interactive elements (forms, galleries, video) typically have the most accessibility issues.

Scan Your Squarespace Site for Free

Find out exactly where your Squarespace site stands on ADA compliance. Our free scanner checks your pages against WCAG 2.1 AA standards using axe-core — the same engine powering Google Lighthouse. No signup required.

Related Guides