Test results

Pick a model to see how accessible its components are, with the accessibility skill off and on.

Claude Opus 5.5

Skill version 2.3

Totals for the whole run, across 3 generations of each of the 22 components
Measure	Skill off	Skill on
Failed acceptance criteria	32	1
of which WCAG	15	0
of which Best practice	17	1
Total cost (US dollars)	$7.63	$23.92
Input tokens	509,721	8.3 million
Output tokens	304,043	680,930

Link

Results, totals across all generations

Cost in USD

Failed acceptance criteria

Skill off

0 fails

WCAG: 0 fails
Best practice: 0 fails

Skill on

0 fails

WCAG: 0 fails
Best practice: 0 fails

Total cost

Skill off: $0.30
Skill on: $1.02

Efficiency, average per generation

Input tokens include cache reads.

Input tokens

Skill off: 5,984 tokens
Skill on: 125,277 tokens

Output tokens

Skill off: 4,015 tokens
Skill on: 9,165 tokens

Turns

Skill off: 2 turns
Skill on: 7 turns

Time

Skill off: 32 seconds
Skill on: 82 seconds

Cost

Skill off: $0.10
Skill on: $0.34

Prompt given to the model

Build link components in a single self-contained HTML file (inline CSS and JS, no build step, no external libraries). Include two things on the page: 1. A horizontal site navigation bar with four links: Home, Products, Pricing, and Contact. The current page is Products. 2. A short paragraph (two or three sentences) of marketing copy for a coffee subscription service, with one link inside the paragraph text that goes to the Pricing page. Output the complete code in one HTML code block.

Generated code

Skill off: Generation 1, skill off (opens in a new tab)
Generation 2, skill off (opens in a new tab)
Generation 3, skill off (opens in a new tab)
Skill on: Generation 1, skill on (opens in a new tab)
Generation 2, skill on (opens in a new tab)
Generation 3, skill on (opens in a new tab)

Showing 16 of 16 criteria

Labels and messaging2 criteria

The link informs users where it goes to (its purpose is clear from the link text in context).WCAG 2.4.4Judgement
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link informs users when it is for the current page or step.Best practiceAutomated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass

Semantic markup5 criteria

The link's role is included in the accessibility tree.WCAG 4.1.2Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link's accessible name is included in the accessibility tree.WCAG 4.1.2Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
When a link indicates the current page, that current state is included in the accessibility tree.WCAG 4.1.2Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link's accessible name contains the text of its visible label.WCAG 2.5.3Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link's accessible name matches its visible label exactly, or at least starts with the exact text of the visible label.Best practiceAutomated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass

Keyboard4 criteria

The link is focusable using a keyboard.WCAG 2.1.1Browser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link is activated by pressing the Enter key on the keyboard.Best practiceBrowser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link has a focus style when it receives focus using a keyboard.WCAG 2.4.7Browser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The keyboard focus style still renders in forced-colours mode (e.g. Windows High Contrast Mode).Best practiceBrowser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass

Visual design4 criteria

All text meets the minimum contrast ratio of 4.5:1 against the background colour, or 3:1 for large-scale text.WCAG 1.4.3Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link does not rely on colour alone to indicate it is a link (e.g. it is underlined, bold, or uses an icon).WCAG 1.4.1Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link does not look like plain text.Best practiceAutomated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
If the link uses a custom focus style, the focus indicator has a contrast ratio of at least 3:1 against its background colour.WCAG 1.4.11Browser
Skill off
1/3 passed
- Generation 1: Pass
- Generation 2: Not applicable
- Generation 3: Not applicable
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass

Adaptive UI1 criterion

The links can be viewed at smaller screen widths (320px) without loss of content or functionality, and without requiring horizontal scrolling.WCAG 1.4.10Browser
Skill off
0/3 passed
- Generation 1: Unmeasured
- Generation 2: Unmeasured
- Generation 3: Unmeasured
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass