Aller au guide d’utilisation
accessibility-reviewpar Anthropic

Accessibility Review Skill.

Un skill Claude Code et Codex pour la révision de design : audit WCAG 2.1 AA d'un design ou d'une page : contraste, clavier, zones tactiles.

  • Revue de conception et accessibilité
  • Rapport de revue
anthropics/knowledge-work-plugins · design/skills/accessibility-review/SKILL.mdSKILL.md
--- name: accessibility-review description: Run a WCAG 2.1 AA accessibility audit on a design or page. Trigger with "audit accessibility", "check a11y", "is this accessible?", or when reviewing a design for color contrast, keyboard navigation, touch target size, or screen reader behavior before handoff. --- ## Usage ## Testing Approach ## Output ## Accessibility Audit: [Design/Page Name] ## If Connectors Available ## Tips
En-tête et titres de section lus depuis le fichier source le 14 septembre 2026 · 4 248 caractères au total

01 Ce qu'il fait

Ce que le Skill accessibility-review fait dans Claude Code et Codex

Résumé, workflow et sorties, tous lus dans le SKILL.md du skill.

D'après le SKILL.mdLu le 14-09-2026 · pas une exécution enregistrée

Dans les termes du Skill

Une routine d'audit WCAG 2.1 AA pour un design ou une page, déclenchée par des formulations comme « audit accessibility » ou « check a11y » et prenant en argument une URL Figma, une URL ou une description.

Il embarque une référence rapide condensée de onze critères répartis entre Perceptible, Utilisable, Compréhensible et Robuste : contraste de 4,5:1 pour le texte normal, 3:1 pour le grand texte et les composants d'interface, accès au clavier, focus visible et zones tactiles de 44x44 pixels CSS, plus huit problèmes courants et une approche de test en cinq étapes qui commence par une analyse automatisée détectant environ 30 % des problèmes. Les constats aboutissent dans un rapport markdown à structure fixe, avec décompte des gravités, tableaux par principe, sections contraste, clavier et lecteurs d'écran, et corrections priorisées.

Ce qu'il produit

  • Un rapport d'audit d'accessibilité en markdown, en-têté du nom du design ou de la page et du standard WCAG 2.1 AA.
  • Une section de constats répartie en tableaux Perceptible, Utilisable, Compréhensible et Robuste : problème, critère, gravité et recommandation.
  • Des tableaux dédiés au contraste des couleurs, à la navigation au clavier et aux lecteurs d'écran, avec le nom annoncé pour chaque élément.
  • Une liste ordonnée de corrections prioritaires, séparant les corrections critiques qui bloquent les utilisateurs des améliorations majeures et des petits plus facultatifs.
Voir l'exemple de prompt ↗

Fonctionnement

  1. 01
    Indiquez l'élément à auditer

    La commande prend en argument une URL Figma, une URL de page ou une description écrite, et audite cette cible.

  2. 02
    Vérifiez les onze critères AA

    La référence rapide regroupe les critères sous Perceptible, Utilisable, Compréhensible et Robuste, chacun avec son numéro de critère de succès et son seuil.

  3. 03
    Effectuez les cinq passes de test

    Analyse automatisée, navigation au clavier uniquement, test avec lecteur d'écran, vérification du contraste et zoom à 200 %, dans cet ordre.

  4. 04
    Rédigez la structure de rapport fixe

    Un seul rapport markdown avec un résumé des gravités, un tableau de constats par principe, et des tableaux distincts pour le contraste, le clavier et les lecteurs d'écran.

  5. 05
    Utilisez les connecteurs lorsqu'ils sont disponibles

    Avec un outil de design connecté, il lit les valeurs de couleur, les tailles de police et les zones tactiles depuis Figma ; avec un outil de suivi de projet, il crée un ticket par constat.

02 Trouvez celui qui vous convient

Quand utiliser la skill accessibility-review

Utilisez la skill accessibility-review dans Claude Code ou Codex lorsque le travail est une revue de design de ce type. La pertinence et les limites ci-dessous sont tirées du propre fichier de la skill.

Bon choix

  • Vérifier un design pour le contraste des couleurs, la navigation au clavier, la taille des zones tactiles ou le comportement des lecteurs d'écran avant la transmission.
  • Auditer une page finalisée, à condition de pouvoir lui fournir une URL.
  • Lire les valeurs de couleur, les tailles de police et les zones tactiles directement dans un fichier Figma lorsqu'un outil de design est connecté.
  • Transformer l'audit en travail suivi, en créant un ticket par constat et en le reliant aux epics de remédiation existants.

Connaître les limites

  • Considérer l'audit comme une couverture complète : l'analyse automatisée passe à côté de la plupart des problèmes et de véritables tests avec des technologies d'assistance restent nécessaires.

Quoi fournir

  • La référence du design ou de la page elle-mêmeElle est injectée dans l'instruction d'audit comme premier argument.

03 Dans le skill

Les règles que le skill accessibility-review transmet à Claude Code et Codex

7 instructions concrètes, valeurs par défaut et limites que le SKILL.md fixe pour l'agent — la partie du fichier qui change le résultat.

  1. Imposer un rapport de 3:1 aux composants UI

    Un contraste non textuel d'au moins 3:1 est exigé pour les composants UI et les graphiques, au titre du critère 1.4.11.

  2. Imposer des zones tactiles de 44x44

    Les zones tactiles doivent mesurer au moins 44x44 pixels CSS, conformément au critère 2.5.5.

  3. Rendre tout atteignable au clavier

    Toutes les fonctionnalités doivent être accessibles au clavier (2.1.1) avec un indicateur de focus visible (2.4.7).

  4. Le zoom à 200 % comme critère de réussite ou d'échec

    La mise en page est testée à 200 % de zoom et signalée si elle se casse.

  5. Relier chaque constat à un critère

    Chaque ligne des tableaux de constats nomme le critère WCAG aux côtés du problème, de la sévérité et de la recommandation.

  6. Noter la sévérité : critique, majeure ou mineure

    Les constats sont étiquetés selon l'une de trois sévérités, affichées sous forme de marqueurs colorés dans la colonne de recommandation.

  7. Commencer par le contraste et le clavier

    Le skill commence par le contraste et le clavier, car ils permettent de détecter les problèmes les plus courants et les plus impactants.

04 Mettez-le en pratique

Installer accessibility-review dans Claude Code ou Codex

Une commande npx skills add, puis une première tâche dans votre agent et une checklist pour le résultat.

Ajouter accessibility-review à Claude Code, Codex ou votre agent

Exécutez-la dans votre projet ; l'installateur demande à quel agent l'ajouter.

Terminal
npx skills add https://github.com/anthropics/knowledge-work-plugins --skill accessibility-review

Forme générique de la CLI skills pour design/skills/accessibility-review/SKILL.md ; le dépôt peut documenter son propre chemin.

Donner au skill une première tâche de révision de conception

Rédigé dans les termes propres du skill ; remplacez les parties entre crochets par votre contenu.

Starter prompt
Audit accessibility for [Figma URL for the checkout flow] before we hand it to engineering. Start with contrast and keyboard access, and flag anything that would block a screen reader user as critical.

Source : rédigé à partir du SKILL.md, dans les termes propres du skill.

Vérifiez le premier résultat

Ce que le SKILL.md lui-même présente comme un résultat correct :

  • Parcourir l'ensemble au clavier seul.
  • Tester avec VoiceOver ou NVDA plutôt que de se fier à l'audit.
  • Vérifier les ratios de contraste réels par rapport aux valeurs exigées.
  • Traitez les correctifs prioritaires dans l'ordre, les problèmes bloquants avant les finitions.

Dans OpenDesign, importez accessibility-review depuis le lien de son SKILL.md : Plugins → Add → Skill → Import from link, puis sélectionnez-le dans la barre supérieure.

05 Open source, traçable

Source, licence et vérification

D'où proviennent les faits de cette page et quand ils ont été vérifiés pour la dernière fois.

Author
Anthropic
Fichier du skill
design/skills/accessibility-review/SKILL.md Somme de contrôle du contenu enregistrée lors de la vérification ; commit 8f877b6
License
Apache-2.0 D'après LICENSE.
Étoiles du dépôt
24 012 Instantané GitHub pris le 2026-09-14 pour l'ensemble du dépôt anthropics/knowledge-work-plugins, qui contient 7 skills dans ce catalogue. Il ne s'agit pas d'une note ni d'un compteur d'utilisation pour accessibility-review.
Vérifié par OpenDesign
2026-09-14 Le fichier source, le chemin, le texte de licence et le nombre d'étoiles ont été vérifiés. Non intégré dans OpenDesign main (vérifié le 2026-08-28) ; aucune exécution en conditions réelles n'a été enregistrée sur cette page.

Dans le SKILL.md

  1. UsageIndique la forme de la commande et comment l'argument est substitué dans l'audit.
  2. Référence rapide WCAG 2.1 AAOnze critères listés sous Perceptible, Utilisable, Compréhensible et Robuste, avec leurs seuils.
  3. Problèmes courantsHuit défaillances récurrentes, du contraste et des libellés de formulaire aux pièges de focus et aux limites de temps.
  4. Approche de testCinq passes : scan automatisé, clavier, lecteur d'écran, contraste, zoom à 200 %.
  5. RésultatLe modèle de rapport avec résumé de gravité, tableaux par principe, lignes de contraste et correctifs prioritaires.
  6. Si des connecteurs sont disponiblesCe qui change lorsqu'un outil de design ou un outil de suivi de projet est connecté.
  7. ConseilsCommencez par le contraste et le clavier, testez avec de vraies technologies d'assistance, priorisez selon l'impact.
Description du skill lui-même
« Effectue un audit d'accessibilité WCAG 2.1 AA sur un design ou une page. Déclenche avec "audit accessibility", "check a11y", "is this accessible?", ou lors de la révision d'un design pour le contraste des couleurs, la navigation au clavier, la taille des zones tactiles ou le comportement du lecteur d'écran avant la livraison. »

Description du front-matter extraite de SKILL.md. Le fichier complet fait environ 4 248 caractères. Lire le fichier complet sur GitHub.

Revue d'accessibilité

Exécuter accessibility-review sur une vraie tâche de revue de design.

Téléchargez OpenDesign, importez accessibility-review depuis son lien SKILL.md, collez la consigne ci-dessus et lisez le plan avant le résultat.

Terminal
npx skills add https://github.com/anthropics/knowledge-work-plugins --skill accessibility-review

OpenDesign Desktop

Un seul design system. Votre marque, cohérente partout

Dans le Vibe Design Workspace complet, appliquez les mêmes règles de marque aux sites, slides, prototypes interactifs, dashboards, images et vidéos HTML. Connectez Codex, Claude Code, Cursor et vos autres agents de code locaux, puis créez gratuitement.

  • Sites, slides, prototypes, dashboards, images et vidéos
  • Plus de 140 design systems et la bibliothèque complète de modèles et skills
  • Codex local et plus de 21 agents de code · Gratuit
Télécharger gratuitement

Disponible sur macOS et Windows