Skip to main content

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
MeasureSkill offSkill on
Failed acceptance criteria321
of which WCAG150
of which Best practice171
Total cost (US dollars)$7.63$23.92
Input tokens509,7218.3 million
Output tokens304,043680,930

Checkbox group

Results, totals across all generations

Cost in USD

Failed acceptance criteria

Skill off
1 fail
WCAG
1 fail
Best practice
0 fails
Skill on
0 fails
WCAG
0 fails
Best practice
0 fails

Total cost

Skill off
$0.31
Skill on
$0.94

Efficiency, average per generation

Input tokens include cache reads.

Input tokens

Skill off
7,568 tokens
Skill on
105,901 tokens

Output tokens

Skill off
4,102 tokens
Skill on
9,020 tokens

Turns

Skill off
2 turns
Skill on
7 turns

Time

Skill off
32 seconds
Skill on
80 seconds

Cost

Skill off
$0.10
Skill on
$0.31
Prompt given to the model
Build a set of checkboxes in a single self-contained HTML file (inline CSS and JS, no build step, no external libraries). Present a "Pizza toppings" question where the user can choose any number of these options: Mushrooms, Pepperoni, and Extra cheese. At least one topping must be chosen. None is selected yet, so the question is in error: show the validation message "Choose at least one topping." for the pizza toppings question. Output the complete code in one HTML code block.

Generated code

Show

Showing 16 of 16 criteria

Labels and messaging2 criteria

  • The checkbox has a visible label.WCAG 3.3.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 checkbox group has a visible label.WCAG 3.3.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

Semantic markup7 criteria

  • The checkbox'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
  • Each checkbox has an accessible name 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 checkboxes are grouped programmatically, and the group role is included in the accessibility tree.WCAG 1.3.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 checkbox group has an accessible name 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 checkbox's checked and not-checked 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 group's required state is included in the accessibility tree.WCAG 1.3.1Automated
    Skill off

    1/3 failed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Fail
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • The error message is programmatically associated with the group and is included in the accessibility tree.WCAG 1.3.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

Keyboard4 criteria

  • The checkboxes are 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
  • Each checkbox can be checked and unchecked 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 checkbox 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 design3 criteria

  • The error state does not use colour as the only method to indicate an error.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
  • 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
  • If the checkbox 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

    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

Back to top