Dernière mise à jour : 10 février 2026
L’avis général communique un message urgent d’intérêt public qui a un impact majeur sur l’expérience utilisateur.
- Guide d'utilisation
- Design
- Accessibilité
Utilisation
L’avis général est positionné directement sous la barre de navigation de l’en-tête du site Web, permettant à l’utilisateur ou l’utilisatrice d’accéder rapidement à l’information prioritaire communiquée, sans devoir la chercher. Utilisé comme un bandeau, il occupe toute la largeur de l’écran.
Puisque c’est un message de haute importance qui concerne l’ensemble des utilisateurs et utilisatrices du site, il est publié sur toutes les pages. Jamais il ne peut se trouver uniquement sur la page d’accueil du site. Toutefois, si son contenu s’adresse à des groupes précis, l’avis général peut s’afficher sur une section ciblée.
2. Sujet de l’avis (en gras) et message
3. Bouton Fermer (optionnel)
Principales règles
L’avis général concerne uniquement une situation ponctuelle.
Il est retiré dès que cette situation est rétablie.
Son message explique l’impact de la situation et communique les mesures à prendre.
Il est rédigé dans un langage simple pour être compris par tout le monde.
Un seul avis général est permis par page.
Choisir le bon type d’avis général
Il existe trois types d’avis général dont le choix est déterminé en fonction de la gravité du message à communiquer. Ils se distinguent visuellement les uns des autres par leur icône.
Informationnel
Communique un message important concernant un service, le site Web ou un changement qui doit être signalé.
Avertissement
Annonce l’état d’un service, un changement majeur ou une modification importante susceptible d’avoir un impact sur l’expérience utilisateur et qui peut nécessiter une action à effectuer.
Alerte critique
Indique les mesures à prendre pour minimiser les risques ou éviter un danger dont l’impact sur l’expérience utilisateur est majeur.
Placement
Par défaut, l’avis général apparaît sur toutes les pages du site Web. En aucun cas, il ne peut se trouver uniquement sur la page d’accueil du site.
Il peut aussi s’afficher sur une section précise ou seulement sur certaines pages choisies stratégiquement en fonction des publics cibles à qui s’adresse le message. Le cas échéant, les URL des pages concernées doivent être fournies à l'équipe d’intégration.
Interactivité
Hyperlien
Afin que l’avis général reste bref, un hyperlien peut être intégré dans le message pour rediriger vers une page qui communique plus de détails sur la situation.
Fermeture du message
Pour un message informationnel dont la nature n’est pas urgente ou critique, il est possible d’ajouter un bouton pour le fermer et de le faire disparaître pour une durée déterminée.
Cette option est à éviter si le message doit absolument être lu.
Quand envisager autre chose
- Pour afficher un message d’alerte ou un avis précis concernant une page ou une section de page ou en réponse à une action de l’utilisateur ou de l’utilisatrice, opter pour l’avis.
- Pour communiquer les erreurs identifiées dans un formulaire, on utilise, selon le contexte, le message d'erreur général ou les messages d’erreur spécifiques aux champs.
- Pour inviter l’utilisateur ou l’utilisatrice à valider l’action en cours et l’aviser des conséquences possibles avant de passer à la prochaine étape (exemple : perte des données saisies), choisir la modale.
Rédaction UX
L’avis général explique en quelques mots l’impact de la situation sur l’utilisateur ou l’utilisatrice et l’action requise.
Puisqu’il s’adresse au grand public, il doit être rédigé de façon simple et concise afin d’être compris par tout le monde avec un minimum d’efforts.
Sujet de l’avis
Le sujet de l’avis est mis en gras et séparé du message par une barre verticale ou un deux-points. Il précise clairement la nature de l’alerte.
Nombre de caractères maximal
L’avis général, comprenant le sujet, le message et, s’il y a lieu, l’hyperlien, est limité à 120 caractères, espaces incluses.
Couleurs et styles
Chaque type d’avis général est associé à une combinaison de couleur pour l’arrière-plan, l’icône et le texte.
Personnalisation de l’avis général
La seule option possible pour l’avis général est d’ajouter un bouton permettant de fermer le message. Toutefois, si le niveau d’alerte retenu est l’alerte critique, cette option est à éviter.
Grille
Voici comment se positionne l’avis général selon les différentes tailles d’écran.
Spécifications
Voici les spécifications en pixels des espacements qui délimitent les différents éléments de l’avis général.
États interactifs
Si l’avis général contient un hyperlien, les états interactifs de ce composant s’appliquent au niveau du lien seulement. Consulter les états interactifs de l’hyperlien.
Principes d'accessibilité
L’avis général est toujours accompagné d’une icône ayant un texte de remplacement pour annoncer la nature du message. La combinaison de couleurs utilisée pour l’icône et l’arrière-plan offre également une indication visuelle supplémentaire sur la nature du message.
Ce composant peut inclure deux éléments interactifs, soit l’hyperlien et le bouton Fermer, qui prend la forme d’un X.
Textes de remplacement
Icône de l’avis général
Un texte de remplacement annonçant la nature du message accompagne toujours l’icône d’un avis général. Toutefois, si le sujet de l’avis inclut le texte de remplacement, ce dernier n’est pas requis.
Les textes de remplacement sont prédéfinis.
Bouton Fermer
Représenté par un X, le bouton Fermer a aussi un texte de remplacement annonçant le résultat de l’action si un clic est effectué dessus.
Ce texte est prédéfini.
(close notice, en anglais).
Interactions au clavier
- Touche Tab. : pour déplacer le repère visuel sur les éléments interactifs présents dans l’avis général, selon cet ordre : hyperlien et bouton Fermer (X), pour fermer l’avis général.
- La combinaison des touches Majuscule et Tab. permet de faire le chemin inverse.
- Chaque élément atteint par le focus du clavier doit avoir un état interactif prévu pour afficher un repère visuel du focus.
- Touche Entrée ou barre d’espacement, correspondant à un clic de souris : pour activer un élément.
Interactions au lecteur d'écran
Si l’avis contient un hyperlien, ce dernier doit être annoncé comme un lien par le lecteur d’écran.