A11y Audit

Audit WCAG 2.2 AA/AAA s měřenými kontrastními poměry a opravami odkazujícími na kritéria

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

Otestováno · Funguje ★ 8.4/10

A11y Audit — Audit WCAG 2.2 AA/AAA s měřenými kontrastními poměry a opravami odkazujícími na kritéria

Co umí

Audituje UI nebo komponentu proti WCAG 2.2 AA/AAA a vzorům WAI-ARIA, vrací tabulku nálezů klíčovanou na specifická kritéria úspěšnosti s závažností P0/P1/P2 a konkrétními opravami. Spouští se, když uživatel požádá o kontrolu přístupnosti, ověření kontrastu nebo kontrolu klávesnice/čtečky obrazovky. Čte kontrolní seznam organizovaný podle POUR a referenci ARIA a měří barevný kontrast pomocí přiloženého skriptu namísto vizuálního odhadování poměrů.

Testovací report

Načten SKILL.md a namátkově zkontrolováno 6 odkazovaných cest přes raw fetch — všechny HTTP 200; wcag-checklist.md a aria-patterns.md jsou podstatné skutečné reference (tabulka kritérií organizovaná podle POUR, mapy klávesnice ARIA APG). Spuštěn scripts/contrast.py (čistý python3, bez závislostí): #767676/#fff = 4.54:1 PASS, #999/#fff = 2.85:1 FAIL, kódy ukončení správné. Pro výstupní test jsem napsal 6prvkový card.html a auditoval jej dvěma způsoby: základní vizuální audit vs. tělo dovednosti, které vyžaduje spuštění contrast.py pro každý pár. Měřené poměry změnily dva vizuální úsudky — modrý odkaz #5b8def vypadá dobře, ale měří 3.23:1 (FAIL 1.4.3) a červený odznak #d32f2f vypadá slabě, ale měří 4.98:1 (PASS); nadpis #8a8a8a = 3.45:1 a text #a0a0a0 = 2.61:1 oba FAIL. Žádné bezpečnostní problémy (žádné curl|sh, base64, eval). Tření: adresář dovednosti obsahuje pouze SKILL.md a závisí na sourozeneckých souborech/skriptech v kořeni repozitáře, takže samostatná kopie adresáře dovednosti narušuje její kroky — je nutná plná instalace balíčku.

Testováno: 2026-07-21 · Claude Code 2.x (agent harness)

Instalace

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).

Příkazy a ukázkové prompty

  • /a11y-auditAudit WCAG 2.2 AA/AAA s měřenými kontrastními poměry a opravami odkazujícími na kritéria

Skilly se spouštějí běžnými požadavky — žádné příkazy k zapamatování. Po instalaci ho aktivují prompty jako tyto (anglicky):

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