Vibe coding

Intègre l'accessibilité en un prompt

Tu codes avec une IA ? Copie l'un de ces prompts et colle-le dans ton assistant. Il installe le garde-fou d'accessibilité Conformly, corrige ton code RGAA/WCAG, ou branche l'API — sans quitter ton éditeur.

Copie un prompt, colle-le dans ton assistant IA (Cursor, Claude Code, Windsurf, GitHub Copilot), et remplace les valeurs entre chevrons < >.

Installer le CLI (garde-fou CI)

Ajoute un garde-fou d'accessibilité gratuit à ton projet : une commande npm, aucune clé API. Le build échoue si le score RGAA passe sous ton seuil.

Ajoute un garde-fou d'accessibilité à mon projet avec le CLI Conformly (paquet npm public « conformly », gratuit, sans clé API).

1. Ajoute un script npm "a11y" dans package.json : "npx conformly scan <URL_DE_MON_SITE> --threshold 90" (remplace <URL_DE_MON_SITE> par l'URL de préproduction ou de production).
2. Crée un workflow GitHub Actions dans .github/workflows/accessibilite.yml qui, à chaque push, installe Node 18+ et lance "npx conformly scan <URL_DE_MON_SITE> --threshold 90" — le job échoue si le score RGAA passe sous 90.
3. Explique-moi en deux lignes comment lire le résultat (score RGAA sur 100 + nombre d'anomalies).

Le CLI n'a besoin d'aucune authentification : il appelle l'API de scan gratuite de Conformly.
Corriger l'accessibilité (RGAA/WCAG)

Fais auditer et corriger ton code par ton IA selon le RGAA 4.1 et WCAG 2.1 AA, sans toucher au design.

Agis comme un expert en accessibilité RGAA 4.1 / WCAG 2.1 niveau AA. Audite le code de ce projet et corrige les problèmes d'accessibilité les plus courants, sans changer le design :

- Images : attribut alt pertinent (alt vide si l'image est décorative).
- Formulaires : chaque champ associé à un <label>, erreurs annoncées (aria-describedby, aria-invalid).
- Contrastes : texte ≥ 4.5:1 (≥ 3:1 pour le grand texte) — signale ceux à corriger.
- Clavier : focus visible, ordre de tabulation logique, pas de piège au clavier, lien d'évitement vers le contenu.
- Structure : un seul <h1>, hiérarchie de titres cohérente, repères (header/nav/main/footer), attribut lang sur <html>.
- Composants interactifs : rôles et états ARIA corrects, cibles tactiles d'au moins 24px.

Procède fichier par fichier, explique chaque correction, et liste à part ce qui demande une décision humaine. Ensuite je vérifierai avec un scan Conformly : npx conformly scan <URL_DE_MON_SITE> --threshold 90
Afficher le badge de score

Affiche un badge de conformité live sur ton site, qui renvoie vers le rapport public de ton scan.

Ajoute un badge de score d'accessibilité Conformly sur mon site.

- Conformly expose un badge SVG live à l'URL https://conformly.online/api/free-badge/<ID_DU_SCAN> (l'ID est renvoyé après un scan gratuit sur conformly.online). Pour un site surveillé, le badge est https://conformly.online/api/badge/<ID_DU_SITE>.
- Insère dans le pied de page une image affichant ce badge, cliquable, qui renvoie vers le rapport public correspondant.
- Rends l'image accessible : attribut alt décrivant le score (ex. « Score d'accessibilité RGAA : 92/100 »), et laisse le badge se mettre à jour tout seul.

Demande-moi l'ID si tu ne le trouves pas ; je l'obtiens après un scan ou dans mon tableau de bord Conformly.
Brancher l'API REST

Déclenche des scans depuis ton application via l'API REST authentifiée (clé cfy_ générée dans le tableau de bord).

Intègre l'API REST Conformly dans mon application pour déclencher des scans d'accessibilité par programmation.

- Authentification : en-tête « Authorization: Bearer cfy_... » (clé site-scopée générée dans le tableau de bord Conformly). Garde-la dans une variable d'environnement, jamais en dur.
- Déclencher un scan : POST https://conformly.online/api/v1/scans avec le corps JSON {"threshold": 90} → réponse 202 { id, status, statusUrl }.
- Suivre le scan : GET https://conformly.online/api/v1/scans/<ID> jusqu'à status = "done" → { status, score, threshold, pass, scanId, violationsUrl }.
- Respecte le quota : 60 requêtes/minute et par clé, en-têtes X-RateLimit-*, code 429 + Retry-After au-delà.

Écris un petit module réutilisable dans le langage de mon projet : déclenchement, polling avec backoff, gestion des erreurs et des 429.

Pas encore de score ?

Teste une page gratuitement, sans compte — puis colle le prompt de correction.

Scan gratuitGuide CI/CD