Mettez les informations importantes dans le bon contexte.
Progression de la vérification
Comparer les informations et la présentation dans le contexte d'utilisation.
Essayez l'opération, modifiez le statut et continuez à travailler.
La progression est enregistrée automatiquement dans ce navigateur.
GUIDE
Effectuez l’action recommandée, puis revenez à l’écran. La bannière doit être mise à jour ou disparaître lorsque le problème est résolu ; Ne laissez pas les anciennes informations continuer à inquiéter les utilisateurs.
EXEMPLES
La bannière « Informations complètes pour continuer » comporte un bouton pour accéder à la bonne section manquante ; Après ajout, la bannière n'apparaît plus.
Séparez les informations, les avertissements, les erreurs et les réussites avec des étiquettes ou des icônes de la même couleur.
Lisez la bannière lors de la suppression de la couleur ; Les utilisateurs comprennent toujours s’ils doivent y prêter attention ou simplement en savoir plus.
Exemple « Paiement incomplet » comporte une icône d'avertissement et une action de vérification.
Mettez ce qui vient de se passer en premier, puis indiquez l'impact et de brèves étapes de traitement.
Essayez des messages longs et des métriques dynamiques ; Évitez de masquer des actions importantes sur mobile.
Exemple "La session est sur le point d'expirer. Enregistrez un brouillon avant de vous reconnecter. "
Donnez la priorité à l'action correcte de gestion des événements, ajoutez peut-être une option de fermeture si le message n'est pas requis.
Cliquez sur action puis revenez ; Il n'y a plus de bannière d'erreur si le problème est résolu.
Exemple Le bouton « Reconnecter » dans la notification de perte de connexion ne mène pas à la page d'accueil.
Gardez le message suffisamment visible pour être remarqué, mais sans enlever au contenu principal de la page.
Placez la bannière sur un fond et un thème sombres ; Le texte, les liens et les boutons doivent être lisibles.
Exemple Bannière d'avertissement avec bordure et icône ; La description utilise toujours une taille de police facile à lire.
Utilisez des icônes pour représenter le type de message et conservez les étiquettes de texte comme principale source d’informations.
Cachez l'icône et relisez ; Le message doit être autonome et ne pas perdre son sens.
Exemple L'icône de verrouillage est accompagnée de la phrase "Vous n'avez pas encore de droits d'édition".
Placez la notification à proximité de la zone concernée ; Les annonces à l’échelle de la session peuvent être trouvées en haut de la page.
Faites défiler la page et ouvrez le clavier ; La bannière ne doit pas recouvrir le bouton de traitement dans la zone concernée.
Exemple Les erreurs de filtre se trouvent à côté des résultats ; La maintenance du service est au top.
