A11y Audit

Audit WCAG 2.2 AA/AAA avec ratios de contraste mesurés et correctifs référencés par critère

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

Testé · Fonctionne ★ 8.4/10

A11y Audit — Audit WCAG 2.2 AA/AAA avec ratios de contraste mesurés et correctifs référencés par critère

Ce que fait

Audite une interface utilisateur ou un composant par rapport aux WCAG 2.2 AA/AAA et aux modèles WAI-ARIA, renvoyant un tableau de résultats indexé par des critères de succès spécifiques avec une sévérité P0/P1/P2 et des correctifs concrets. Se déclenche lorsque l'utilisateur demande une vérification d'accessibilité, une vérification de contraste, ou une révision clavier/lecteur d'écran. Il lit une liste de contrôle organisée selon POUR et une référence ARIA et mesure le contraste des couleurs avec un script intégré plutôt que d'estimer les ratios à l'œil.

Rapport de test

SKILL.md a été récupéré et 6 chemins référencés ont été vérifiés ponctuellement via raw fetch — tous HTTP 200 ; wcag-checklist.md et aria-patterns.md sont des références réelles substantielles (tableau de critères organisé selon POUR, cartes clavier ARIA APG). Exécution de scripts/contrast.py (pure python3, pas de dépendances) : #767676/#fff = 4.54:1 PASS, #999/#fff = 2.85:1 FAIL, codes de sortie corrects. Pour le test de sortie, j'ai écrit un card.html à 6 éléments et l'ai audité de deux manières : un audit visuel de base vs le corps de la compétence, qui exige l'exécution de contrast.py par paire. Les ratios mesurés ont inversé deux jugements visuels — le lien bleu #5b8def semble correct mais mesure 3.23:1 (FAIL 1.4.3) et le badge rouge #d32f2f semble faible mais mesure 4.98:1 (PASS) ; le titre #8a8a8a = 3.45:1 et le texte #a0a0a0 = 2.61:1 échouent tous les deux. Pas de failles de sécurité (pas de curl|sh, base64, eval). Friction : le répertoire de la compétence ne contient que SKILL.md et dépend de fichiers/scripts frères à la racine du dépôt, donc une copie autonome du répertoire de la compétence rompt ses étapes — une installation complète du package est nécessaire.

Testé le: 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).

Commandes et exemples de prompts

/a11y-auditAudit WCAG 2.2 AA/AAA avec ratios de contraste mesurés et correctifs référencés par critère

Les skills se déclenchent sur des demandes en langage courant — aucune commande à retenir. Après installation, des prompts comme ceux-ci l'activent (en anglais) :

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

Rapport complet →