Outil gratuit

Analysez l'accessibilité de vos maquettes avant développement

Détectez les problèmes de contraste, taille des cibles tactiles et texte dans les images. Corrigez vos designs avant qu'ils ne deviennent du code.

Analyse visuelle uniquement : 5 vérifications visuelles

Check Design vérifie sur vos maquettes 4 critères RGAA visuels (3.2, 3.3, 10.12 et 1.8) ainsi que la taille des cibles tactiles (recommandation WCAG 2.5.5, hors RGAA). Une conformité RGAA complète nécessite un audit du code après développement couvrant les 106 critères.

En savoir plus sur l'audit complet

5 vérifications visuelles

4 critères RGAA visuels + la taille des cibles tactiles (recommandation WCAG, hors RGAA)

RGAA 3.24,5:1 / 3:1

Contraste du texte

Le texte doit avoir un ratio de contraste suffisant (4,5:1 ou 3:1 pour texte large)

Contraste des composants d'interface

Les composants d'interface et les éléments graphiques porteurs d'informations doivent être suffisamment contrastés

WCAG 2.5.5AAA / hors RGAA44×44px

Taille des cibles tactiles

Les zones cliquables doivent avoir une taille minimale de 44x44 pixels. Recommandation WCAG 2.5.5 (niveau AAA), au-delà du RGAA.

RGAA 10.121,5× interligne

Espacement du texte

Un interlignage et un espacement suffisamment généreux évitent un texte tassé. Sur une maquette, c'est un indice de compatibilité avec les surcharges d'espacement ; le test RGAA complet se vérifie sur le rendu vivant.

RGAA 1.8Aucun texte

Texte dans les images

Une image texte porteuse d'information doit, si possible, être remplacée par du texte stylé

Découvrez ce que vous obtiendrez

Cliquez sur les problèmes pour voir les détails et solutions

Exemple de résultat

Exemple de résultat d'analyse

Bon début - Quelques ajustements

Votre design est globalement accessible avec quelques points d'attention à corriger.

3 problèmes détectés

2 critiques1 avertissement
RGAA 3.2

Contraste du texte

1 problème détecté

Pourquoi c'est un problème

Le ratio de contraste entre le texte gris (#888) et le fond blanc (#FFF) est de 3.5:1, inférieur au minimum requis de 4.5:1 pour le texte normal.

Comment corriger

Assombrissez le texte à #666 minimum ou utilisez un texte noir #333 pour un ratio de 7:1.

Niveau de confiance :CertainRGAA 3.2
WCAG 2.5.5

Taille des cibles tactiles

1 problème détecté

Pourquoi c'est un problème

L'icône de fermeture mesure 24×24px, en dessous du minimum recommandé de 44×44px pour les cibles tactiles.

Comment corriger

Augmentez la zone cliquable à 44×44px minimum, en gardant l'icône centrée.

Niveau de confiance :AttentionWCAG 2.5.5AAA / hors RGAA
RGAA 1.8

Texte dans les images

1 problème détecté

Pourquoi c'est un problème

Le logo contient du texte 'ACME Corp' qui pourrait ne pas être accessible aux lecteurs d'écran.

Comment corriger

Assurez-vous que le texte alternatif de l'image inclut le texte visible du logo.

Niveau de confiance :OKRGAA 1.8

Connectez-vous pour commencer

Comment ça fonctionne

1

Uploadez votre maquette

Screenshot Figma, Sketch, Adobe XD ou toute image de votre design

2

L'IA analyse votre design

Notre IA réalise les 5 vérifications visuelles en quelques secondes

3

Corrigez avant le dev

Recevez des recommandations concrètes pour améliorer votre design

Questions fréquentes

Allez plus loin dans l'accessibilité

Votre site respecte-t-il les 106 critères du RGAA ? Lancez un audit complet gratuit pour découvrir les problèmes d'accessibilité et comment les corriger.

Scanner mon site gratuitement