Conformance target
The LexGrade marketing site (lexgrade.com) targets WCAG 2.2 Level AAA wherever the criterion can be met without destroying the content. The product application (api.lexgrade.com) targets WCAG 2.2 Level AA. The reason for the split is honest: marketing is mostly prose and short interactive flows, where AAA is achievable. The application carries complex stateful UI (the Grader, the citation report) where AAA on every criterion is harder to guarantee. AA is the floor for both surfaces; we aim higher where the cost is reasonable.
What we have done (Level AA, both surfaces)
- Keyboard navigation works everywhere. Every interactive control is reachable by Tab, activatable by Enter or Space, and shows a visible focus ring. We use
focus-visibleso the ring appears for keyboard users without distracting mouse users. - Skip-to-content link at the top of every page. One Tab away from the address bar, you can jump past the header navigation.
- Semantic landmarks throughout. Every page uses
<header>,<nav>(witharia-labelfor primary vs. footer nav),<main>, and<footer>so screen-reader users can jump between regions. - Color is never the only signal. Verification status badges use text labels alongside color, so red/green color blindness doesn't hide whether a citation is verified or hallucinated.
- Live region for verification results. When the verifier finishes, screen readers announce the result automatically via
role="status" aria-live="polite"— no need to manually navigate to find the report. - Motion respects
prefers-reduced-motion. If your operating system requests reduced motion, our CSS shuts down transitions and animations. - Form labels are explicit. Every input has an associated
<label>; error messages are programmatically linked viaaria-describedby. - Adequate contrast. Our color palette targets the 4.5:1 contrast ratio for body text and 3:1 for large text required by WCAG AA. Dark mode mirrors the same ratios.
- Page titles are unique and meaningful. Browser tabs and screen-reader page lists differentiate every page.
WCAG 2.2 Level AAA — aspirations and carve-outs (marketing site)
LexGrade's marketing site is designed as a published reference for legal-tech peers. Below is the exact list of AAA criteria we conform to, the two we cannot conform to without harming the content, and the regression guards we maintain for each. This section is meant to be useful to other projects evaluating AAA — it documents the policy, not just the implementation.
AAA criteria we meet on the marketing site
-
1.4.6 Contrast (Enhanced) — body text and labels clear the
7:1 contrast threshold (and 4.5:1 for large text). Small uppercase eyebrow
labels were bumped from
text-neutral-500(~4.6:1 against white) totext-neutral-700(~10.3:1). Dark cards usetext-neutral-200/text-neutral-300onbg-neutral-900, both above 7:1. -
1.4.8 Visual Presentation — prose blocks use the
Tailwind
prosedefaults: line length capped at ~75ch, line spacing 1.5+, paragraph spacing > line spacing, no full justification, user-resizable text without horizontal scroll. - 2.1.3 Keyboard (No Exception) — the marketing site has no functionality that requires path-timed input or pointer-only gestures. Every interactive control is fully keyboard-operable.
- 2.2.3 No Timing — nothing on the marketing site is gated by a timer. There are no auto-advancing carousels, no countdowns, no forms that expire while you're filling them out.
- 2.2.4 Interruptions — no automatic interruptions, pop-ups, toast notifications, or modal interrupts. The visitor controls when content updates by clicking or navigating.
-
2.3.2 Three Flashes — no flashing content anywhere.
CSS animations honor
prefers-reduced-motionand never strobe. -
2.4.8 Location — the active page is marked with
aria-current="page"in both the primary nav and the footer nav. Screen readers announce "current page" on the matching link. - 2.4.9 Link Purpose (Link Only) — link text is self-describing out of context. Where a short arrow link appears (“Read the Standard →”), the visible text alone communicates the destination; arrow glyphs are decorative.
-
2.4.10 Section Headings — every content section uses
a semantic heading. Heading order is never skipped:
h1thenh2thenh3, no leaps. - 2.4.12 Focus Not Obscured (Enhanced) — new in WCAG 2.2. The marketing site has no sticky or fixed header, footer, or overlay that can cover a focused control: the header scrolls away with the page and nothing is pinned on top of the content. When any control receives keyboard focus, the whole control stays visible.
-
2.5.5 Target Size — interactive controls in nav,
headers, and CTAs measure at least 44 by 44 CSS pixels. Header nav links
were bumped from
py-2topy-3to clear the threshold. Inline text links inside flowing prose are exempt per the WCAG specification. -
3.1.4 Abbreviations — on first use per page, the
abbreviations AGPL,
CC-BY-SA,
and LLM are wrapped in
<abbr title="...">so assistive technology can expand them. - 3.2.5 Change on Request — no context change happens without an explicit user action. We never auto-submit a form, auto-navigate away from a page, or open a new window without warning.
-
3.3.6 Error Prevention (All) — the marketing site has
no legal-commitment forms. Any contact path is a
mailto:link, which lets the user review and edit before sending.
What WCAG 2.2 changed. Version 2.2 added three AAA success criteria and retired one (4.1.1 Parsing). Of the three additions, 2.4.12 above is met; 3.3.9 Accessible Authentication (Enhanced) does not apply — the marketing site has no login, password, or cognitive-test gate. The third, 2.4.13 Focus Appearance, is the one criterion we have not yet formally audited; it is listed under Known gaps below rather than claimed.
AAA criteria we cannot conform to — documented carve-outs
Two AAA criteria conflict with the content this site exists to communicate. We name the conflict openly rather than claim conformance we don't deliver.
- 3.1.5 Reading Level (lower secondary education / ~9th grade): LexGrade publishes legal methodology, technique-register entries with terms of art, disclaimers required by professional-responsibility rules, and a scoring standard that quotes the Federal Rules of Civil Procedure. Flattening that language to a 9th-grade reading level would change its legal meaning. The target audience — pro se litigants doing serious research, solo attorneys, law-school clinics — expects this vocabulary unedited. Where we can simplify without losing precision, we do.
- 3.1.3 Unusual Words (glossary): the same audience expects terms like “LexGrade Standard,” “exemplar,” “hallucinated citation,” “court module,” and “technique register” unadorned. Defining each inline or behind a glossary widget would clutter the page for the users who need the content most. The open LexGrade Standard is the long-form definition; that is the appropriate place to learn the vocabulary.
The two ignored rules above are also the only WCAG2AAA rules suppressed in
our automated pa11y-ci configuration. They are named, not hidden.
If you fork LexGrade and want to remove these carve-outs — for example,
because your audience is K-12 or English-as-a-second-language learners —
you should reopen them in your fork's .pa11yci.json and supply
simpler language in your equivalent of the Standard.
How we keep AAA conformance from regressing
-
Static PHP tests in
apps/marketing/tests/Feature/AccessibilityTest.phpassert:aria-current="page"appears on the active nav link; header nav links carrypy-3; body text usestext-neutral-700(nottext-neutral-500) on pages that previously failed 7:1; first-use abbreviations are wrapped in<abbr title="...">. -
Dynamic browser audit via
pa11y-cirunning against the live marketing routes in a dedicated CI workflow (.github/workflows/marketing-a11y.yml). Configured toWCAG2AAAwith the two carve-outs above and nothing else. - Public commit: if a future PR drops below AAA on a criterion that isn't one of the two named carve-outs, the CI gate fails and the PR does not merge. Visible policy, mechanical enforcement.
Known gaps
We are committed to fixing these. None are blockers but we list them openly rather than wait until someone files a bug.
- WCAG 2.2 SC 2.4.13 Focus Appearance (AAA) is not yet formally audited. Every interactive control shows a
focus-visibleindicator — a 2px amber ring with offset on buttons and CTAs, an underline on inline text links — but we have not measured each against the criterion's minimum-area and 3:1 state-contrast metrics. Until that audit is done we do not claim 2.4.13. - The methodology renderer outputs long-form Markdown; we have not yet manually audited every heading order for skipped levels.
- The OG/social preview image carries the wordmark only and is generated programmatically. Production will replace it with a designed asset that survives high-contrast mode.
- The product application (
api.lexgrade.com) is AA, not AAA; AAA on the Grader UI is a future scope decision.
Report an accessibility problem
If something doesn't work for you, we want to know. We treat accessibility bugs as first-class — same priority as a broken sign-in flow.
Email hello@lexgrade.com with the subject "Accessibility issue." Tell us what page, what assistive technology (if any), and what you expected to happen. We respond within two business days and prioritize the fix accordingly.
The bigger picture
Roughly one in four U.S. adults lives with a disability. Among the population most likely to need LexGrade — people who can't afford a lawyer — that rate is higher, not lower. An inaccessible access-to-justice tool is a contradiction in terms. If you ever find this page rings hollow because the rest of the site isn't living up to it, hold us accountable.