Toast — Should It Be a Modal ?

Définition

Un toast est un message court et temporaire qui confirme qu’une action a eu lieu, puis disparaît de lui-même.

Problème résolu

Un toast referme la boucle sur une action déjà effectuée par l’utilisateur, sans rien lui demander. Il ne crée aucune interruption et n’attend aucune réponse — il sert à être remarqué, pas à être traité.

Quand l’utiliser

Confirmations d’enregistrement
Confirmation de copie
Actions d’arrière-plan terminées

Quand ne pas l’utiliser

L’information est critique ou longue
L’utilisateur doit décider avant de continuer

Exemple

Modifications enregistrées
Lien copié
Export terminé

Voir l’exemple technique

<div role="status" aria-live="polite" aria-atomic="true">
  Changes saved.
</div>

Contre-exemple

Annoncer un échec de paiement critique dans un toast qui disparaît après trois secondes est une erreur fréquente. Un message persistant placé directement dans le contexte du paiement convient mieux : il reste visible avec une action claire pour corriger le problème ou réessayer, plutôt qu’une modale — à réserver aux cas où une décision bloquante immédiate est réellement nécessaire.

Questions à se poser

L’action qui intéresse l’utilisateur est-elle déjà terminée ?
N’y a-t-il vraiment plus rien à décider pour l’utilisateur ?
Manquer ce message laisserait-il l’utilisateur bloqué ou perdu ?
L’information est-elle assez courte pour se lire en quelques secondes ?

Patterns liés