Framer Sites
Framer WCAG 2.2 Accessibility Checker for Designers & Studios
Framer makes shipping animated marketing pages effortless, yet default frame wrappers often export as nested div tags without semantic landmarks, accessible button labels, or visible keyboard focus rings.
REGULATORY BENCHMARK
WCAG 2.2 Level AA requires clear keyboard focus indicators (SC 2.4.7), minimum 24x24px pointer targets (SC 2.5.8), and 4.5:1 text contrast (SC 1.4.3).
TYPICAL AGENCY RETAINER TICKET
$450 - $1,100 per Framer marketing site
High-frequency compliance traps & source remediations
Missing Main, Nav, and Footer Accessibility Tags on Frames
WCAG 1.3.1 Landmark RegionsAssistive technology users cannot jump past header links straight to main content.
<a href="#main-content" class="sr-only focus:not-sr-only">Skip to main content</a>
<main id="main-content">...</main>Low-Contrast Muted Zinc Copy Over Translucent Cards
WCAG 1.4.3 Contrast (Minimum)Subtle 45% opacity body copy drops below 3.1:1 contrast on dark glass surfaces.
<p class="text-zinc-700 dark:text-zinc-300">
Guaranteed >= 7:1 body text readability across themes.
</p>3-Step Studio Handoff Workflow
- Assign semantic HTML tags (`header`, `nav`, `main`, `section`, `footer`) in Framer's Accessibility panel.
- Add descriptive `alt` text to every CMS and hero image layer.
- Run WCAGBrief's 5-minute keyboard check to confirm focus order matches visual layout.