Conseils
Les formulaires servent à collecter les données des utilisateurs et à permettre les transactions.
Ils sont composés d’un ensemble de champs de saisie contenus dans un conteneur de formulaire <form>
. Les
ensembles de champs <fieldset>
peuvent être utilisés pour diviser les formulaires
qui présentent beaucoup de contenu. Ils permettent de regrouper les éléments dans des sections
logiques qui ont un sens pour l’utilisateur, comme « Coordonnées » ou « Informations de paiement ».
Les formulaires doivent être clairs et faciles à comprendre et à utiliser. Le système de conception du GNB propose une vaste série de composants de formulaire. Ils sont tous conçus dans un objectif précis et tiennent compte des besoins des utilisateurs. Dans l’ensemble, il existe deux principaux types de saisies :
- Saisies libres : Les champs de texte et les zones de texte permettent la saisie libre des données. Les champs de texte sont utilisés pour saisir du texte court, sur une seule ligne. Les zones de texte sont utilisées pour saisir des informations sur plusieurs lignes, comme des messages ou des commentaires.
- Saisies de sélection : Ce type de saisie permet à l’utilisateur de choisir parmi des options prédéfinies. Pour les sélections uniques, utilisez des boutons radio, des listes de sélection ou des listes à saisie semi-automatique. Pour les sélections multiples, utilisez des cases à cocher.
À faire
- Indiquez les champs obligatoires.
- Utilisez les types de boîtes de saisie appropriés pour le texte, le courriel et le mot de passe.
- Divisez les longs formulaires et groupez les champs connexes sous des titres de section (comme « Coordonnées »).
- Utilisez
for="id-de-l'entrée"
pour associer chaque étiquette à son entrée correspondante. - Collectez uniquement les renseignements nécessaires à la prestation du programme ou du service.
- Rédigez des messages d’erreur utiles qui guident les utilisateurs en cas d’erreur.
- Permettez aux utilisateurs de vérifier leurs données avant de les soumettre.
À ne pas faire
- N’utilisez pas tabindex.
- Ne créez pas d’étiquettes en MAJUSCULES.
- Ne créez pas d’étiquette avec le texte d’espace réservé.
- Ne tentez pas de reproduire la mise en page d’un formulaire papier.
- Ne masquez pas le texte d’aide.
- N’utilisez pas de ponctuation dans les étiquettes.
- Ne fixez pas de limite de temps.
- N’exigez pas de salutations genrées comme Monsieur, Mademoiselle et Madame.
Composants du formulaire et conseils
Composants d'entrée de formulaire
Tous les composants dont vous avez besoin pour construire n'importe quelle forme.
Disposition des formulaires
Meilleures pratiques pour créer des formulaires bien conçus.
Messages d'erreur
Meilleures pratiques pour rédiger de bons messages d'erreur.