Accessibility Compliance
Examen WCAG 2.2 AA de pages web : texte alternatif, calcul de contraste, modèles de graphiques et de formulaires
Testé · Fonctionne
Ce que fait
Transforme une requête d'accessibilité en une vérification WCAG 2.2 AA du balisage : une liste de contrôle POUR, un arbre de décision WHO/WHAT/WHERE pour le texte alternatif, un modèle de graphique accessible avec une table de données liée, des champs de formulaire avec aria-describedby et role="alert", la gestion de prefers-reduced-motion, et une fonction de rapport de contraste exécutable. Se déclenche lorsque vous demandez d'auditer un site ou un modèle pour la conformité WCAG, d'écrire du texte alternatif pour des images, de rendre une visualisation de données ou un formulaire utilisable par un lecteur d'écran, ou de vérifier le contraste des couleurs. Inclut des listes de contrôle pour les légendes et les descriptions audio, des palettes Paul Tol sans danger pour les daltoniens, une recette d'audit axe-core épinglée plus Playwright, et les délais légaux actuels aux États-Unis et dans l'UE.
Rapport de test
Cloné dans un HOME temporaire (export HOME=$(mktemp -d)) et copié le répertoire de la compétence ; SKILL.md a atterri dans ~/.claude/skills/accessibility-compliance/SKILL.md, le frontmatter contient name+description, et le corps ne référence aucun fichier de dépôt (les trois "Related skills" existent tous dans l'arborescence ; SKILL.md, dev-toolkit/README.md et plugin.json ont tous renvoyé HTTP 200). Tâche : examiner un fragment HTML d'article de presse de 30 lignes (mauvais texte alternatif, graphique en PNG, champ d'e-mail non étiqueté, div-comme-bouton de 20x20px, vidéo en lecture automatique, a:focus{outline:none}, trois couleurs à faible contraste) et produire une version corrigée. La base de référence (2,6 Ko, /private/tmp/claude-501/-Users-afin-Desktop-Skill-Agregator/94648f54-e301-46fc-afd8-b98858a51ecf/scratchpad/a11y_baseline.md) a obtenu la sémantique, les étiquettes et un vrai bouton mais a écrit "contrast looks too light, should be checked" et "only 20x20px, hard to hit" ; l'exécution de la compétence (8,8 Ko, a11y_skill.md) a cité WCAG 2.2 SC 2.5.8 avec le seuil de 24x24 CSS-px, et j'ai réellement exécuté la fonction validate_contrast() de la compétence pour obtenir 2.79:1 / 3.14:1 / 3.12:1 ÉCHEC et 6.29:1 / 6.54:1 RÉUSSITE pour les remplacements. La version de la compétence a également ajouté la table de données <details> plus aria-labelledby/describedby pour le graphique (la base de référence n'avait écrit qu'un alt d'une ligne), un bloc prefers-reduced-motion et une porte JS que la base de référence avait entièrement manqués, des éléments <track> de légende/description, et :focus-visible au lieu du :focus brutal de la base de référence. Analyse de sécurité propre : pas de curl|sh, pas de base64, pas de secrets, dépendance npm épinglée à une version exacte que j'ai confirmée exister et être la dernière actuelle sur le registre npm, et le fichier vous indique explicitement de charger axe depuis les node_modules locaux plutôt que depuis un CDN. La documentation a perdu un point : la description est encadrée par le journalisme et se qualifie d'"essentielle", et le data-journalism dans "Related skills" est livré dans un plugin différent de celui-ci.
Testé le: 2026-07-31 · Claude Code 2.x (agent harness)
Installation
git clone --depth 1 https://github.com/jamditis/claude-skills-journalism.git /tmp/accessibility-compliance-src mkdir -p ~/.claude/skills cp -R /tmp/accessibility-compliance-src/dev-toolkit/skills/accessibility-compliance ~/.claude/skills/accessibility-compliance # Single self-contained SKILL.md (20KB), no bundled scripts or reference files. # No dependencies needed for the review/markup guidance itself. # Optional, only for the automated-audit section of the skill: # npm install --save-dev --save-exact axe-core@4.12.1 && npm ci # pip install playwright && playwright install chromium # Plugin-marketplace alternative: the repo ships .claude-plugin/marketplace.json and the # skill lives in the "dev-toolkit" plugin, which also bundles 9 other dev skills.
Commandes et exemples de prompts
/accessibility-complianceExamen WCAG 2.2 AA de pages web : texte alternatif, calcul de contraste, modèles de graphiques et de formulaires
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 news site for WCAG complianceWrite alt text for these news imagesBuild an accessible data visualization for readers