A11y Audit

WCAG 2.2 AA/AAA-revision med uppmätta kontrastförhållanden och kriterierefererade korrigeringar

av plugin87 · plugin87/ux-ui-agent-skills

Testad · Fungerar ★ 8.4/10

A11y Audit — WCAG 2.2 AA/AAA-revision med uppmätta kontrastförhållanden och kriterierefererade korrigeringar

Vad den gör

Granskar ett UI eller en komponent mot WCAG 2.2 AA/AAA och WAI-ARIA-mönster, och returnerar en fyndtabell kopplad till specifika framgångskriterier med P0/P1/P2-allvarlighetsgrad och konkreta korrigeringar. Utlöses när användaren ber om en tillgänglighetskontroll, kontrastverifiering eller granskning av tangentbord/skärmläsare. Den läser en POUR-organiserad checklista och ARIA-referens och mäter färgkontrast med ett medföljande skript snarare än att ögonmåtta förhållanden.

Testrapport

Hämtade SKILL.md och punktkontrollerade 6 refererade sökvägar via rå hämtning — alla HTTP 200; wcag-checklist.md och aria-patterns.md är betydande verkliga referenser (POUR-organiserad kriterietabell, ARIA APG tangentbordskartor). Körde scripts/contrast.py (ren python3, inga beroenden): #767676/#fff = 4.54:1 PASS, #999/#fff = 2.85:1 FAIL, exitkoder korrekta. För utdatatestet skrev jag en 6-elements card.html och granskade den på två sätt: en baslinjeögonmåttsgranskning kontra färdighetstexten, som kräver att contrast.py körs per par. Uppmätta förhållanden vände två ögonmåttsbedömningar — den blå länken #5b8def ser bra ut men mäter 3.23:1 (FAIL 1.4.3) och det röda märket #d32f2f ser svagt ut men mäter 4.98:1 (PASS); #8a8a8a rubrik = 3.45:1 och #a0a0a0 text = 2.61:1 båda FAIL. Inga säkerhetsbrister (ingen curl|sh, base64, eval). Friktion: färdighetskatalogen innehåller endast SKILL.md och är beroende av syskonfiler/skript i repots rot, så en fristående kopia av färdighetskatalogen bryter dess steg — fullständig paketinstallation behövs.

Testad: 2026-07-21 · Claude Code 2.x (agent harness)

Installation

git clone --depth 1 https://github.com/plugin87/ux-ui-agent-skills.git /tmp/a11y-audit-src
mkdir -p ~/.claude/skills
cp -R /tmp/a11y-audit-src/.claude/skills/a11y-audit ~/.claude/skills/a11y-audit
# IMPORTANT: the skill dir holds only SKILL.md. Its steps read repo-root sibling files
#   accessibility/wcag-checklist.md, accessibility/aria-patterns.md, taste/motion-choreography.md
#   and run scripts/contrast.py, scripts/measure_render.mjs, scripts/verify_states.mjs
# — all relative to the repo root, NOT bundled with the skill. For full function, install the
# whole package into your project: npx ux-ui-agent-skills  (installs accessibility/ + scripts/ too).
# scripts/contrast.py = pure python3, no deps. measure_render.mjs/verify_states.mjs need:
#   npm i -D playwright   (without it they SKIP with exit 0, they do not error).

Kommandon och exempelprompter

/a11y-auditWCAG 2.2 AA/AAA-revision med uppmätta kontrastförhållanden och kriterierefererade korrigeringar

Skills triggas av vanliga förfrågningar — inga kommandon att memorera. Efter installationen aktiverar prompter som dessa skillen (på engelska):

Audit this page for WCAG 2.2 AA compliance
Check the contrast ratios on this design
Review this component for screen-reader support

Läs hela rapporten →