Web Accessibility Testing MCP

Web Accessibility Testing MCP

Ronan Takizawa · Programmation

Web Accessibility Testing MCP est un serveur open source du Model Context Protocol qui donne à un client d'IA la capacité de vérifier des pages web à la recherche de problèmes d'accessibilité. Il associe le moteur Axe-core de Deque à Puppeteer, si bien qu'un assistant comme Claude Desktop ou Cursor peut tester une URL en direct ou un extrait HTML brut et renvoyer un rapport sur la conformité WCAG 2.0, 2.1 et 2.2. Vous lui donnez une page. Il vous donne une liste de ce qui ne va pas et de l'endroit.

Aperçu de l'interface de Web Accessibility Testing MCP

À propos de Web Accessibility Testing MCP

Qu'est-ce que Web Accessibility Testing MCP

Web Accessibility Testing MCP, souvent abrégé en a11y MCP, est un petit serveur MCP de test d'accessibilité qui relie un assistant de développement doté d'IA au moteur que beaucoup d'équipes d'audit professionnelles utilisent déjà. Il encapsule la bibliothèque Axe-core de Deque Labs et pilote un vrai navigateur headless via Puppeteer, si bien que les vérifications portent sur des pages rendues et non sur du balisage statique.

Tout est une question d'emplacement. Pas de tableau de bord séparé. Pas de copier-coller de résultats entre onglets. À la place, vous demandez à votre assistant d'examiner une URL, et les résultats reviennent comme une réponse de chat ordinaire. Cela compte quand vous livrez un composant et voulez une passe rapide de conformité WCAG avant une pull request.

Les limites les plus importantes méritent d'être dites franchement. C'est un projet communautaire, pas un produit officiel de Deque. Le support vient du dépôt GitHub, pas d'un service d'aide d'un éditeur. Il ne teste aussi que ce qu'Axe-core sait détecter automatiquement, ce qui couvre beaucoup de vrais problèmes, mais n'attrape jamais tout ce qu'un relecteur humain verrait.

Pour commencer

  1. Vérifiez que Node.js 18 ou plus récent est installé sur votre machine et choisissez un client compatible MCP, comme Claude Desktop, Claude Code, VS Code ou Cursor.
  2. Ouvrez le fichier de configuration MCP de votre client, qui se trouve à un emplacement différent sous macOS, Windows et Linux.
  3. Ajoutez une entrée nommée a11y-accessibility dans mcpServers avec la commande npx et l'argument -y a11y-mcp-server.
  4. Redémarrez la session du client pour que les nouveaux outils s'enregistrent, puis confirmez que le serveur apparaît dans votre liste d'outils.
  5. Demandez à l'assistant de tester une URL contre une balise comme wcag2aa, et définissez éventuellement la largeur et la hauteur du viewport pour un contrôle mobile ou bureau.

Informations sur le produit

Aperçu des tarifs, des plateformes compatibles et des performances de Web Accessibility Testing MCP.

Offre gratuiteOui
Offres payantes$0
PlateformeNode.js 18+ with MCP clients (Claude Desktop, Claude Code, VS Code, Cursor, Windsurf)
DéveloppeurRonan Takizawa
CatégorieProgrammation
Date de lancementMar 2025
Dernière mise à jourSep 2025
Visites du site649.3M
Classement mondial du site50
Disponibilité de l’APIOui

Idéal pour

Les utilisateurs, tâches et cas d'usage où cet outil convient le mieux.

Utilisateurs

  • Développeurs front-end
  • Testeurs QA et accessibilité
  • Petites équipes sans auditeur dédié

Tâches

  • Tester une page en direct
  • Tester un extrait HTML
  • Analyse de contraste des couleurs
  • Validation ARIA

Cas d'usage

  • Vérifications avant commit
  • Revue responsive
  • Suivi des régressions

Fonctionnalités clés

Tests d'URL et d'extraits HTML

Le serveur teste n'importe quelle URL publique ou une chaîne HTML brute. Cela couvre à la fois une page en direct que vous ne pouvez pas inspecter facilement à la main et un fragment encore présent dans votre éditeur. Chaque exécution renvoie un rapport structuré. Pas de captures d'écran. L'assistant peut résumer les violations directement.

Intégration d'Axe-core et de Puppeteer

Les vérifications passent par le moteur Axe-core de Deque dans un vrai navigateur headless piloté par Puppeteer. Ce sont des vérifications d'accessibilité Axe-core, du type que lance une équipe d'audit professionnelle. Comme la page est entièrement rendue, les résultats reflètent ce que les utilisateurs chargent réellement, pas seulement le HTML source. C'est la même logique de détection sur laquelle s'appuient beaucoup d'outils professionnels.

Tests de conformité WCAG 2.0, 2.1 et 2.2

Vous choisissez les normes à tester avec des balises comme wcag2aa. Le serveur vérifie le contenu par rapport aux règles 2.0, 2.1 et 2.2, si bien que vous pouvez cibler le niveau que votre projet vise réellement au lieu de tout lancer.

Dimensions de viewport personnalisables

La largeur et la hauteur sont configurables, avec des valeurs par défaut de 1280 sur 800. Définir un viewport de taille téléphone fait ressortir des problèmes qui n'apparaissent que sur petits écrans. Des cibles tactiles serrées, par exemple. Ou du contenu qui casse en largeur étroite.

Vérifications de contraste des couleurs et ARIA

Deux zones de défaillance courantes ont leurs propres outils. Un analyseur de contraste des couleurs valide les associations texte et fond, tandis que la validation ARIA regarde si les attributs sont utilisés correctement et complètement. Les deux attrapent des problèmes pénibles à vérifier à l'œil.

Exploration des règles

Un outil d'exploration des règles explique quelles règles d'accessibilité existent et ce qu'elles signifient. C'est utile quand un rapport signale quelque chose que vous ne reconnaissez pas et que vous voulez du contexte avant de décider s'il s'agit d'un vrai problème.

Détection du verrouillage d'orientation

Le serveur signale le contenu qui impose une orientation d'écran précise. Cela compte pour les utilisateurs sur tablette ou avec des troubles moteurs, où une orientation verrouillée peut rendre une page inutilisable.

Avantages et inconvénients

Avantages

  • Fonctionne dans votre client d'IA existant, donc pas de tableau de bord ni de compte séparé à gérer.
  • Gratuit et open source, avec tout le code disponible sur GitHub.
  • Bâti sur Axe-core, un moteur de règles d'accessibilité largement reconnu.
  • Teste à la fois des URL en direct et du HTML brut, couvrant les débuts et les fins d'un développement.
  • Des balises WCAG et des tailles de viewport configurables donnent la main sur la portée du test.

Inconvénients

  • Les vérifications automatiques ratent les problèmes qui demandent un jugement humain, donc elles ne remplacent pas un audit manuel.
  • Nécessite Node.js 18+ et un client compatible MCP, ce qui exclut les utilisateurs non techniques occasionnels.
  • C'est un projet communautaire et non un produit officiel de Deque, donc pas de ligne de support éditeur.

Questions fréquentes

C'est un outil de test d'accessibilité par IA qui relie un assistant d'IA au moteur Axe-core de Deque, si bien que l'assistant peut tester des pages web et des extraits HTML à la recherche de problèmes d'accessibilité et de conformité WCAG. Cela le rend pratique pour les tests d'accessibilité pour développeurs qui préfèrent ne pas quitter leur éditeur. Vous posez la question, et il renvoie une liste structurée des violations.