Patterns UX
Formulaires
Tous les formulaires du portail (devis, candidature, contact, demande de personnel) suivent ces règles.
Structure recommandée
- 1. Titre + objectif clair (1 phrase).
- 2. Champs groupés par thème, label au-dessus.
- 3. Champs obligatoires marqués avec *.
- 4. Validation au blur, message d'erreur sous le champ.
- 5. Bouton principal en bas à droite, secondaire en ghost.
- 6. Écran de confirmation après succès.
Confirmation après envoi
Demande envoyée
Notre équipe commerciale vous recontacte sous 24 h ouvrées.
Règles
À faire
- • Sauvegarde automatique pour les formulaires longs (> 8 champs)
- • Indiquer l'avancement (étape 2/4) pour les formulaires multi-étapes
- • Aria-live sur les messages d'erreur
- • Bouton retour visible à toutes les étapes
À éviter
- • Reset complet du formulaire en cas d'erreur
- • Messages d'erreur génériques type "Champ invalide"
- • Validation uniquement à la soumission
- • Formulaire de plus d'une colonne sans raison