Les composants de groupe de champs sont utilisés pour permettre à vos utilisateurs de saisir des informations liées de manière structurée, tout en facilitant la compréhension et la navigation dans des formulaires complexes.
✅ Usages corrects :
-
Regrouper des champs liés thématiquement
Ex : Prénom, Nom, Date de naissance regroupés sous un fieldset intitulé "Informations personnelles" - Utiliser un titre clair afin de comprendre immédiatement le type d’informations à fournir.
-
Utiliser le groupe de champs dans un long formulaire pour segmenter visuellement un formulaire long en sections compréhensibles.
🚫 Usage incorrect :
- Mettre un seul élément (champ de saisi, radio button etc). Il n’y a pas besoin de grouper si l’information est isolée.
- Emboîter plusieurs groupes de champs sans logique claire.
Localisation :
Un groupe de champs doit être placé directement en lien avec le contenu ou la tâche que l'utilisateur est en train d’accomplir, en respectant une progression logique de remplissage de champs.
Pour assurer une bonne lisibilité et structuration du formulaire, un espacement vertical minimum de 16px à 24px doit être appliqué entre deux groupes de champs consécutifs.
