Back to docs

Tool Empathy Audit

Walk your site as a disability persona, with the WCAG checks running as you go.

empathy_audit runs the WCAG checks and then keeps going. It walks your flow as a persona with motor tremors, vision loss, ADHD or another condition, and reports where that walkthrough got stuck. Each issue includes specific fix guidance and the WCAG criterion it maps to.


Quick Start

{
  "url":
    "https://example.com/checkout",
  "disabilities": [
    "motor-impairment-tremor"
  ],
  "goal": "Complete a purchase"
}

What happens:

  1. The page is checked for barriers that affect this persona, mapped to WCAG criteria.
  2. Their impairments change how barriers are weighted. Tremor makes small targets costly. Low vision makes small, low-contrast text unreadable.
  3. With an Anthropic API key and a goal, a short cognitive journey also runs and records a goal path. Without a key, the goal is not used, and the barrier findings and score are the same either way.
  4. You get an empathy score, the barriers, and fix guidance for each.

Test one persona per call for reliable results.


Parameters

Parameter Type Required Default Description
url string Yes - Page to audit
disabilities array No - The persona to test, e.g. ["cognitive-adhd"]. Disability personas get barrier detection; general personas such as first-timer are accepted and flagged. Pass one
goal string No - What the persona is trying to do. Used only with an API key, to drive a journey
wcagLevel string No AA WCAG level: A, AA, AAA
scope string No viewport viewport (above the fold) or full_page (scroll the whole page, all barriers)
device string No none mobile, tablet, desktop, or a device such as iPhone 15. See below
maxSteps number No 5 Journey steps, when a goal runs
maxTime number No 20 Seconds per persona, when a goal runs
includeScreenshots boolean No false Inline base64 screenshots. Off by default because they are large; a screenshotPath is returned instead

Device and page size

Without device, the page renders at the default 1920x1080 with no emulation, and the response says so: device is null and viewport is the size used. Before 20.0 the response said "desktop" when no device was set. With device, the response names the preset and its size. Touch targets and layout differ on a phone, so pass device: "mobile" for a mobile WCAG audit.


Disability Personas

motor-impairment-tremor

Simulates: Essential tremor, Parkinson's, cerebral palsy, repetitive strain injury.

How this persona behaves:

  • Mouse movement is imprecise with jitter
  • Small click targets fail repeatedly
  • Hover menus close before the cursor arrives
  • Double-clicks happen by accident
  • Keyboard navigation is strongly preferred

Common barriers found:

Barrier WCAG User Experience
Small click targets 2.5.5 8 attempts to click a 24px button
Hover-dependent menus 2.1.1 Menu closes before cursor reaches it
Time-limited forms 2.2.3 Session expired during slow typing
No keyboard shortcuts 2.1.1 Forced to use mouse for everything

low-vision-magnified

Simulates: Macular degeneration, glaucoma, cataracts, partial sight.

How this persona behaves:

  • Uses 200-400% browser zoom
  • Relies on high contrast
  • Loses page context when zoomed in
  • Cannot read small text or icons
  • Needs clear visual hierarchy

Common barriers found:

Barrier WCAG User Experience
Fixed-width containers 1.4.10 Content cut off at 200% zoom
Low contrast text 1.4.3 Cannot read gray-on-white body text
Icon-only buttons 1.1.1 No idea what the hamburger menu does
Tiny form labels 1.4.4 Cannot tell which field is which

cognitive-adhd

Simulates: ADHD, executive function challenges, attention difficulties.

How this persona behaves:

  • Scans rapidly without reading fully
  • Clicks impulsively, sometimes hitting wrong targets
  • Abandons long forms or multi-step flows
  • Gets distracted by movement and animation
  • Loses track of progress in multi-step flows

Common barriers found:

Barrier WCAG User Experience
Wall of text 3.1.5 Glazed over and missed key info
Auto-playing video 2.2.2 Could not focus on the form
No progress indicator 3.3.4 Did not know how many steps remained
Long forms 3.3.2 Abandoned at field 12 of 20

dyslexia

Simulates: Reading difficulties, letter reversal, word recognition challenges.

How this persona behaves:

  • Reads slowly
  • Misreads similar words (their/there, form/from)
  • Struggles with justified text
  • Benefits from icons next to text
  • Needs generous line spacing

Common barriers found:

Barrier WCAG User Experience
Justified text Best practice Letters swim, lost place
Dense paragraphs 1.4.12 Could not parse the content
Ambiguous labels 3.3.2 Confused "Email" for "E-mail" link
Poor font choice Best practice Letters hard to tell apart

deaf-user

Simulates: Deaf, hard of hearing, auditory processing disorder.

How this persona behaves:

  • Cannot hear audio content
  • Misses audio alerts and notifications
  • Depends entirely on visual information
  • Needs captions or transcripts
  • May need sign language

Common barriers found:

Barrier WCAG User Experience
Video without captions 1.2.2 Missed entire product demo
Audio-only alerts 1.4.2 Did not know an error occurred
Phone-only support Best practice No way to get help

color-blind-deuteranopia

Simulates: Protanopia, deuteranopia, tritanopia, and other color vision gaps.

How this persona behaves:

  • Cannot distinguish red from green (most common)
  • May confuse blue and yellow (less common)
  • Depends on patterns, labels, and position
  • Struggles with color-coded status indicators

Common barriers found:

Barrier WCAG User Experience
Red/green validation 1.4.1 Cannot tell which fields have errors
Color-only charts 1.4.1 Graphs are meaningless
Status indicators 1.4.1 All traffic lights look the same

Output

Field What it holds
url, goal, testedPersona What was audited
overallScore The empathy score, 0-100
scope, scopeNote What was scored
device, viewport How the page was rendered (device is null without emulation)
resultsSummary Per persona: empathyScore, noBlockingBarriers, scoreContext (how the score was reached), barrierCount, barrierTypes, wcagViolationCount, and the perceptual, cognitive-load and attention readings
allWcagViolations Every WCAG criterion that failed
topBarriers The worst barriers, with the element and fix guidance

When the viewport filter leaves barriers out, outOfViewportBarriersDropped says how many.


Use Cases

1. Pre-Launch Accessibility Review

Before launching a new feature, run empathy audits on all disability personas.

Run one call per persona:

{
  "url":
    "https://staging.example.com",
  "disabilities": [
    "low-vision-magnified"
  ],
  "scope": "full_page"
}

2. Prioritizing Accessibility Fixes

You have 100 WCAG violations. Which ones matter most?

{
  "url": "https://example.com",
  "disabilities": [
    "motor-impairment-tremor"
  ],
  "device": "mobile"
}

The score breakdown shows which barriers cost this persona the most. Fix those first.


3. Compliance Documentation

Need evidence for a VPAT or accessibility statement? Use this.

{
  "url": "https://example.com",
  "disabilities": ["cognitive-adhd"],
  "wcagLevel": "AA",
  "scope": "full_page"
}

This generates detailed barrier reports with WCAG mappings.


Perceptual Transport Analysis (v18.26.0)

The empathy audit now includes Wasserstein-based perceptual transport analysis. It is the first tool that measures how much visual information each persona loses.

How It Works

  1. Screenshot Capture -- Takes a screenshot during the audit.
  2. Persona Visual Filter -- Applies the persona's visual filter:
    • Low vision: Blur plus contrast reduction
    • Color blind: Color channel changes (simulates deuteranopia)
    • Elderly: Yellowing lens, mild blur, and contrast loss
  3. Wasserstein Distance -- Measures the gap between the original and filtered images.
  4. Metrics -- Reports information loss, motor cost, cognitive load, and attention mismatch.

Perceptual Metrics

Metric What It Measures Example
Information Loss Visual content the persona cannot see (0-100%) 1.1% on good sites. 15%+ on color-dependent ones.
Motor Cost How hard interactive elements are to reach (0-100%) 100% for motor-impaired (3x effort). 0% for cognitive.
Cognitive Load How overwhelming the visual layout is (0-100%) 70% for ADHD. 20% for color-blind.
Attention Mismatch How far focus strays from design intent (0-100%) 60% for ADHD (drawn to motion). 10% for deaf.
Transport Distance Raw Wasserstein distance: original vs. filtered Higher values = more visual information lost.

Why Scores Differ Per Persona

Each persona has different barrier severity multipliers. The same page produces different scores.

Barrier Type Motor ADHD Low Vision Color Blind Dyslexic Deaf Elderly
Touch targets 3.0x 0.5x 1.5x 0.5x 0.5x 0.5x 2.0x
Cognitive load 0.8x 3.0x 1.0x 0.8x 2.5x 0.8x 2.0x
Low contrast 0.5x 0.8x 3.0x 2.0x 1.5x 0.5x 2.5x
Color-only info 0.3x 0.5x 2.0x 3.0x 0.8x 0.5x 1.5x
Timing 2.0x 2.5x 1.5x 0.5x 1.5x 1.5x 2.0x
Missing labels 1.5x 1.5x 2.0x 1.0x 2.0x 1.0x 2.0x

The final score blends barrier-weighted scoring (70%) with perceptual transport analysis (30%).

Example Response

{
  "persona": "color-blind-deuteranopia",
  "empathyScore": 57,
  "empathyScoreBarrierOnly": 42,
  "perceptualTransport": {
    "informationLoss": 0.011,
    "attentionMismatch": 0.1,
    "motorCost": 0,
    "cognitiveLoad": 0.2,
    "perceptualScore": 93,
    "transportDistance": 0.0038,
    "computeTimeMs": 450
  }
}

Mathematical Foundation

This uses Sliced Wasserstein Distance from optimal transport theory. It measures the minimum cost of transforming one visual distribution into another.

A persona's visual filter re-renders the page β€” blur, colour attenuation, contrast reduction. The Wasserstein distance measures how far the filtered image sits from the original. That is a measure of how much the filter changed the page, not a measurement of what any person perceives. Use it to compare pages and to see which elements survive the filter.

Based on Agueh & Carlier (SIAM 2011) and Multiscale Sliced Wasserstein as Perceptual Color Difference (ECCV 2024).


Why This Is Different

WCAG Checker Empathy Audit Empathy Audit + Perceptual Transport
"Button has no accessible name" "Blind user could not proceed -- 'Next' button had no label" Same, plus: "persona loses 12% of visual info"
"Contrast ratio is 3.2:1" "Low-vision user at 200% zoom could not read the error" Same, plus: "Wasserstein distance 0.045"
"Target size is 32px" "Tremor user failed 8 click attempts, then quit" Same, plus: "motor cost 100% (3x effort)"
Counts violations Describes where a walkthrough got stuck Same, plus a friction score per layer
Compliance-focused Walkthrough-focused Both, plus visual-filter comparison

CLI

npx cbrowser empathy-audit \
  https://staging.example.com \
  --personas adhd,dyslexic-user \
  --device iphone-16 --html \
  --output accessibility-report.json

The CLI runs every persona in --personas (--disabilities is the older spelling) and takes --goal, --device, --scope, --wcag-level, --max-steps, --max-time, --output and --html. Without --goal it checks the page and needs no API key. An unknown --scope exits 1.



Last updated: v20.0.0

From the Blog