Message d'erreur

Les champs ou les éléments en erreur doivent être faciles à repérer. Un message d’erreur peut s’afficher dès qu’un champ ou un élément est hors focus, c’est-à-dire dès que l’utilisateur a terminé la saisie et a cliqué à l’extérieur de l’élément. Le message d’erreur peut également s’afficher au moment où l’utilisateur procède à son envoi. Consulter la fiche Gestion d’erreur pour connaître l’ensemble de ces orientations.

Anatomie

Cette section définit les règles et contraintes sur les types de contenus (textuels, graphiques, interactifs, etc.) acceptés par chaque élément du composant.

Indicateur visuel

L’utilisation de la couleur rouge permet de mettre en évidence les champs erronés et de les différencier des champs normaux.

Icône

L’icône à gauche du message textuel aide au repérage de l'erreur pour les utilisateurs ayant une anomalie de la vision affectant la perception des couleurs.

Il est possible de remplacer l’icône par une mention textuelle « erreur » précédant le message. Dans ce cas, il faut s’assurer de l’appliquer à tous les champs. Il ne peut y avoir à la fois des champs en erreur avec une icône et d’autres avec la mention « erreur » au sein d’un même formulaire ou site.

Le message doit être clair et concis. Il doit préciser la nature de l’erreur. Pour garantir la cohérence et la standardisation des messages, on peut utiliser la structure suivante, nécessitant seulement de changer le libellé du champ : «Le champ [libellé du champ] est obligatoire». Si le message concerne le format attendu d'un champ, il doit être formulé ainsi : « Le format du champ [libellé du champ] doit être [format souhaité] ».

Exemples :

• «Le champ date est obligatoire»
• «Le format du champ date doit être AAAA-MM-JJ»

Une autre formulation est possible, mais elle nécessite davantage de personnalisation. Il s'agit de supprimer le mot « champ » et de ne mentionner que l'objet du champ (le sujet). Cette structure peut toutefois nécessiter un ajustement du déterminant selon le contexte. Par exemple, «[Déterminant] [sujet] est obligatoire» devient : «La date est obligatoire», «Le prénom est obligatoire», etc. S’il s’agit d’indiquer le format attendu d’un champ, il faut écrire : «Le format [déterminant] [sujet] doit être [format souhaité]».

Les messages génériques tels que « Ce champ est erroné » ou « Format invalide » n’aident pas l’utilisateur à corriger le problème. Donner plus d’informations permet de corriger rapidement le problème et diminue les points de frictions.

À ne pas faire

À faire