Skip to main content

🧪 Tests & Vérifications

Checklist Responsive​

1. Breakpoints à tester​

Tailles d'écran prioritaires :

  • 🔴 Mobile : 375px, 414px (iPhone)
  • 🟡 Tablet : 768px, 1024px (iPad)
  • 🟢 Desktop : 1200px, 1440px, 1920px

2. Tests sur différents appareils​

Outils de test :

  • Chrome DevTools (F12)
  • Firefox Responsive Design Mode

Checklist responsive :

□ Navigation mobile fonctionne
□ Textes lisibles sur tous les écrans
□ Images s'adaptent correctement
□ Boutons ont une taille tactile suffisante (44px min)
□ Formulaires utilisables sur mobile
□ Pas de scroll horizontal
□ Espacement cohérent
□ Performance acceptable sur mobile

3. Tests d'accessibilité​

Outils de test :

  • Wave Web Accessibility Evaluator
  • Axe DevTools
  • Lighthouse (Chrome)
  • Contrast Checker

Checklist accessibilité :

□ Contraste des couleurs suffisant (4.5:1 min)
□ Navigation au clavier possible
□ Balises alt sur les images
□ Structure HTML sémantique (h1, h2, h3...)
□ Focus visible sur les éléments interactifs
□ Textes des liens explicites
□ Formulaires avec labels appropriés
□ Pas de clignotement/flash

4. Tests fonctionnels​

Checklist formulaires :

□ Tous les champs s'affichent correctement
□ Validation en temps réel
□ Messages d'erreur clairs
□ Confirmation d'envoi
□ Redirection après succès
□ Envoi d'email fonctionne

Avant mise en ligne :

□ Aucune erreur 404 sur les ressources
□ Toutes les images s'affichent
□ Fonts se chargent correctement
□ Aucune erreur JavaScript
□ Aucune erreur PHP
□ Performance acceptable
□ SEO de base (titre, meta description)
□ Formulaires fonctionnels
□ Liens internes/externes valides
□ Responsive sur tous les écrans
□ Compatibilité navigateurs
□ Accessibilité de base
□ Tests avec contenu réel