Communitygithub.com

alty-oss/dev-design

Utilisez cette compétence lors de l'examen de l'accessibilité du clavier, du focus, des noms accessibles, de la structure, du contraste et du comportement de mouvement dans l'interface utilisateur.

Qu'est-ce que dev-design ?

Cette compétence est conçue pour les développeurs et les testeurs d'accessibilité qui doivent auditer l'accessibilité d'une interface utilisateur web. Elle guide la vérification de nombreux critères d'accessibilité, notamment la sémantique des points de repère et des titres, l'association des libellés/entrées et des messages d'erreur, la visibilité et l'ordre du focus, l'activation au clavier et la gestion de la touche Échap, le contraste des couleurs, le zoom et le redimensionnement, ainsi que les comportements de mouvement réduit. La compétence insiste sur l'utilisation de tests manuels réels dans le navigateur plutôt que sur des scripts automatisés non fiables. Elle exige de calculer le contraste à partir des couleurs réelles calculées (y compris l'opacité et la composition) et d'effectuer une analyse par pixels pour les arrière-plans complexes. Les problèmes doivent être classés comme bloquants, majeurs ou mineurs, avec des preuves et des réparations. Les vérifications non effectuées sont marquées comme en attente. La compétence prévient que des analyses automatisées ou des vérifications manuelles limitées ne suffisent pas à établir la conformité complète aux WCAG.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/alty-oss/dev-design/tree/HEAD/skills/accessibility-review

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Révision d'accessibilité

Português (Brasil) Révisez le flux principal implémenté et les états de récupération pertinents en utilisant le contrat de validation du navigateur. Vérifiez les points de repère/titres sémantiques, les noms significatifs, les associations de libellés/saisies et d'erreurs, la visibilité du focus, l'ordre/la restauration du focus, l'activation au clavier et le comportement de la touche Échap, le contraste, le zoom/redimensionnement et le comportement de mouvement réduit. Calibrez les entrées clavier natives prises en charge avec les modifications observables du focus/de l'activation. Une API nommée press_key sans changement de comportement est insuffisante. Essayez une alternative native documentée lorsqu'elle est disponible, puis marquez comme non prise en charge si elle échoue ; dispatchEvent et le focus scripté ne sont pas des preuves fiables d'interaction clavier. Utilisez des actions réelles du navigateur pour les affirmations liées au clavier. Inspectez les superpositions et la validation. Une capture d'écran seule ne peut pas prouver l'ordre du focus ou le comportement des technologies d'assistance. Pour les arrière-plans unis, calculez le contraste à partir des couleurs réelles calculées de premier plan et d'arrière-plan, y compris l'opacité/l'héritage/la composition ; utilisez l'analyse par pixels lorsque des arrière-plans complexes l'exigent. Enregistrez la méthode, les couleurs, le rapport et la portée. Exécutez l'automatisation d'accessibilité existante lorsqu'elle est disponible ; enregistrez sa portée et son résultat. N'ajoutez pas une dépendance d'outil uniquement pour revendiquer une couverture. Classez les problèmes comme bloquants/majeurs/mineurs avec des preuves et des réparations ; retestez le comportement affecté après les corrections. Enregistrez les vérifications non prises en charge comme en attente. Les analyses automatisées et les vérifications manuelles limitées n'établissent pas une conformité complète aux WCAG. Ne déclarez pas de conformité globale sans la portée d'audit requise.

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

Skills associés