Documentation de QA Proof

Tout ce dont vous avez besoin pour installer QA Proof sur votre site, lancer votre premier test et lire les résultats. La voie la plus rapide est le plugin WordPress — la plupart des utilisateurs n'ont jamais besoin de toucher directement à l'API.

Qu'est-ce que QA Proof ?

QA Proof est un service hébergé qui utilise l'IA pour vérifier votre site web en direct à la recherche de problèmes visuels, de mise en page et d'accessibilité. Vous lancez des tests à la demande ou planifiez un moniteur qui vérifie les pages de façon récurrente et vous envoie un e-mail lorsqu'un changement survient.

Le plugin WordPress vous permet de tout gérer depuis votre interface d'administration WP : lancer des tests, afficher des captures d'écran côte à côte, planifier des moniteurs et télécharger des rapports PDF.

Démarrage rapide

Trois étapes pour votre premier test :

1. Inscrivez-vous et choisissez un forfait

Créez un compte sur qaproof.io/signup. Le forfait Gratuit vous offre 10 générations IA en tant qu'essai unique à vie et 1 moniteur — suffisant pour évaluer le produit. Une fois les 10 utilisées, vous devez passer à un forfait supérieur.

2. Obtenez votre clé API

Ouvrez qaproof.io/app/api-keys et copiez la clé qui y est affichée. Elle ressemble à qap_live_sk_…. Traitez-la comme un mot de passe — toute personne disposant de cette clé peut lancer des tests sur le quota de votre compte.

3. Installez le plugin WordPress

Téléchargez le plugin, importez-le via Extensions → Ajouter → Téléverser une extension dans votre interface d'administration WP, puis activez-le. Ouvrez QAProof → Réglages, collez votre clé API dans le champ Configuration de l'API et cliquez sur Enregistrer les modifications. La carte sous le champ affichera l'e-mail de votre compte, le forfait et l'utilisation des générations IA — c'est le signe que la connexion fonctionne.

À partir d'ici, vous pouvez lancer un test ponctuel (ci-dessous) ou configurer un moniteur récurrent (ci-dessous).

Plugin : Installer et connecter

1. Importez le .zip de QAProof via Extensions → Ajouter → Téléverser une extension, puis cliquez sur Activer. Un nouveau menu QAProof apparaît dans la barre latérale de WP.
2. Ouvrez QAProof → Réglages, collez votre clé API et cliquez sur Enregistrer les modifications.
3. Cliquez sur Tester la connexion — vous devriez voir « Connecté ! Statut de l'API : ok ».

Plugin : Lancer un test

Ouvrez QAProof → Tests, puis :

1. Choisissez un type de test — Fidélité du Design, Responsive, Régression Visuelle, Accessibilité ou Audit de Design. Consultez Types de Test pour savoir ce que chacun vérifie.
2. Saisissez l'URL de la page que vous souhaitez vérifier.
3. Pour la Fidélité du Design, collez également une URL Figma ou importez une image.
4. Cliquez sur Lancer le test. Durée totale d'exécution : 30 à 90 secondes.

Une fois terminé, vous verrez le score, un résumé, tous les problèmes détectés avec des étiquettes de gravité et une vue des captures d'écran côte à côte. Chaque résultat est enregistré automatiquement dans l'Historique des Tests.

Plugin : Configurer un moniteur

Un moniteur lance un test de Régression Visuelle par rapport à une baseline enregistrée selon une planification (quotidienne, hebdomadaire ou mensuelle) et vous envoie un e-mail si la page diverge.

1. Ouvrez QAProof → Moniteurs → cliquez sur Ajouter un moniteur.
2. Saisissez l'URL de la page, la planification et l'e-mail de notification.
3. Cliquez sur Créer — le plugin capture la première capture d'écran comme baseline.
4. Désormais, chaque exécution planifiée compare la page en direct à cette baseline. Si le score passe sous votre seuil, vous recevez un e-mail avec un bouton Télécharger le rapport complet.

Plugin : Historique des tests et rapports PDF

Chaque test que vous lancez — manuel ou planifié — est enregistré dans QAProof → Tests → Historique des Tests. À partir de là, vous pouvez :

• Rouvrir un résultat et examiner les captures d'écran, les différences et les recommandations.
• Télécharger un rapport PDF avec l'analyse complète — le même format que le fichier lié dans les e-mails de notification.

Fidélité du Design

Compare votre page en direct à une maquette Figma (ou à une image importée) et indique où l'implémentation s'est écartée du design. Renvoie un score de 0 à 100 et décompose l'écart en Mise en page, Couleurs, Typographie, Espacement et Composants.

À utiliser quand : un développeur vient de publier une nouvelle page et vous voulez confirmer qu'elle correspond au design approuvé avant d'annoncer le lancement.

Responsive

Capture la même page à trois viewports — ordinateur (1440×900), tablette (768×1024) et mobile (375×812) — et signale les problèmes de mise en page propres à chacun, comme le défilement horizontal sur mobile, le chevauchement de texte ou les CTA masqués.

À utiliser quand : vous avez apporté des modifications au CSS ou à la mise en page et vous voulez vérifier rapidement si le mobile/la tablette fonctionnent toujours.

Régression Visuelle

Compare la page actuelle à une capture d'écran précédemment approuvée (la baseline) et signale toute différence de pixel/texte/style. Score 100 = rien n'a changé ; scores inférieurs = différences réelles détectées.

Utilisé à la fois comme test ponctuel et comme moteur derrière les moniteurs.

À utiliser quand : vous voulez détecter des changements non intentionnels — un déploiement qui a accidentellement cassé une section, une mise à jour du CMS qui a modifié la page d'accueil ou des images manquantes.

Accessibilité

Audite votre page par rapport aux WCAG 2.1 (niveau configurable : A, AA ou AAA). Signale les obstacles réels : contraste de couleur insuffisant, texte alternatif manquant, hiérarchie des titres rompue, cibles tactiles trop petites, étiquettes de formulaire manquantes, indicateurs de focus qui disparaissent au survol, etc.

À utiliser quand : vous devez vérifier l'accessibilité avant la publication ou rendre compte de la conformité à une partie prenante.

Audit de Design

Inspecte votre design system au niveau de la page : combien de couleurs, polices, styles de bouton et valeurs d'espacement distincts sont réellement utilisés. Identifie les couleurs quasi dupliquées, les valeurs codées en dur qui devraient être des variables CSS et les composants incohérents. Produit un Design Debt Score.

À utiliser quand : votre base de code a grandi de façon organique et vous voulez une lecture quantifiée de la dérive du design system.

Forfaits et limites

Les forfaits payants (Pro / Business / Scale) ont des plafonds mensuels de générations IA qui se réinitialisent à chaque cycle de facturation. Le forfait Gratuit est un essai unique à vie — 10 générations au total, jamais réinitialisées. Consultez Tarifs pour tous les détails sur ce qu'inclut chaque forfait.

Dépannage : « Échec de la capture de la baseline »

Si la création de la baseline échoue, certaines images de votre page ne se sont pas chargées pendant la capture d'écran. Cela se produit généralement lorsque le site limite temporairement nos requêtes. Patientez 1 à 2 minutes et réessayez.

Dépannage : « La capture semble instable »

Si vous voyez un score de 100 avec le message « La capture semble instable », cela signifie que la page comporte des éléments dynamiques (comme des carrousels d'images ou des animations) qui se sont affichés différemment d'une capture à l'autre. Relancez simplement le test — cela fonctionne généralement au deuxième essai.

Dépannage : « Vous avez atteint la limite de votre essai gratuit »

Les utilisateurs du forfait Gratuit voient ce message une fois leurs 10 générations de l'essai à vie utilisées. Le forfait Gratuit ne se réinitialise pas mensuellement — passez à un forfait supérieur dans Facturation pour continuer à lancer des tests. Les forfaits payants ne sont pas bloqués — le dépassement est facturé en fin de période.

Dépannage : le plugin WP affiche le mauvais forfait

Si le forfait affiché dans le plugin ne correspond pas à celui que vous voyez sur qaproof.io, la clé API du plugin appartient probablement à un compte différent de celui avec lequel vous êtes connecté sur le site. Vérifiez l'adresse e-mail affichée sous le champ Clé API dans le plugin — c'est le compte auquel la clé appartient.

Besoin d'aide ?

• Parcourez le Centre d'Aide pour des guides pas à pas avec captures d'écran.
• Envoyez un e-mail à support@qaproof.io — les forfaits payants bénéficient d'une réponse prioritaire.