Alertes contextuelles: Système de conception de Canada.ca

  • Dernière modification : 2022-08-24

Les alertes sont des avis brefs et bien visibles destinés à attirer l'attention sur un message ou un changement important. Elles sont souvent sensibles au facteur temps. L'étiquette, la couleur et l'icône indiquent le type de message et son urgence.

En-tête de l'alerte

Description de l'alerte

Sur cette page

Quand l'utiliser

Utilisez les alertes contextuelles pour :

  • attirer l’attention sur un changement important au niveau de la page ou de la sous-section, comme une interruption de service ou une panne de site;
  • attirer l'attention sur les modifications, récentes ou à venir, apportées à un processus ou à un service;
  • fournir le résultat d'une action de l'utilisateur, par exemple, confirmer le succès ou aviser une personne d'une erreur
  • avertir une personne d'une conséquence d'une action ou d'une inaction liée à sa tâche

Pour utiliser des alertes contextuelles lors de perturbations urgentes du service, suivez ces lignes directrices :

Quoi éviter

Ne pas utiliser les alertes contextuelles :

  • pour fournir des renseignements à propos d’une étape normale d’un processus ou d’une tâche
  • simplement pour insister sur un élément de contenu
  • dans les cas où un avertissement n’est ni à risque élevé ni fréquent
  • pour créer des étiquettes, utilisez plutôt ce composant:

Comment mettre en œuvre

Rédiger le texte de l'alerte pour un auditoire ayant un niveau de scolarité secondaire (pointage de 100 et moins dans Scolarius).

Garder le texte d'alerte très bref. Fournir des détails supplémentaires dans la section ou la page appropriée.

Supprimer le texte de l'alerte une fois que le problème est résolu ou qu'il s'est écoulé suffisamment de temps pour que les informations fournies ne soient plus nouvelles.

Limiter strictement le nombre d'alertes sur la page pour éviter la lassitude.

Situer l’alerte dans le contexte approprié :

Vise l'ensemble du site
Placer-la en haut de la page, au-dessus de l’en-tête principal.
Vise la page
Placez-la en dessous de l’en-tête de la page.

Dans certains cas, lorsque la preuve indique qu’une alerte a été manquée, reprenez une partie de l’alerte dans la section pertinente du contenu Web.
Vise une sous-section de la page
Placer-la à l’endroit qui convient le mieux à l’intérieur de cette sous-section, généralement sous l’en-tête de la sous-section ou entre deux paragraphes.

Utiliser le type d'alerte approprié :

  1. Alerte de danger
  2. Alerte d'avertissement
  3. Alerte d’information
  4. Alerte de succès

1. Alerte de danger

Utilisation : Utilisez l’alerte de danger pour attirer l’attention sur une situation qui pourrait mettre une personne en danger, comme un avertissement de ne pas voyager. Vous pouvez aussi l'utiliser pour aviser une personne d’un problème technique qui pourrait l’empêcher d’accomplir sa tâche, comme une soumission de données invalide dans un formulaire.

Si vous êtes enceinte ou envisagez de concevoir un enfant – Avis concernant les deux partenaires

Évitez de voyager au Costa Rica si vous êtes enceinte ou prévoyez concevoir un enfant au cours des trois prochains mois.

Code
<section class="alert alert-danger">
  <h3>Si vous êtes enceinte ou envisagez de concevoir un enfant – Avis concernant les deux partenaires</h3>
  <p>Évitez de voyager au Costa Rica si vous êtes enceinte ou prévoyez concevoir un enfant au cours des trois prochains mois.</p>
</section>

2. Alerte d’avertissement

Utilisation : Utilisez l’alerte d’avertissement pour :

  • attirer l’attention sur une conséquence possible d’une action ou d’une inaction, comme une sanction légale qui pourrait s’appliquer;
  • la date d’un changement à venir à une politique ou à un processus qui touchera un nombre important de personnes, comme un changement aux exigences de voyage.

Modifications aux lois sur la conduite avec facultés affaiblies et la criminalité liée au cannabis

Les nouvelles peines pour conduite avec facultés affaiblies et infractions liées au cannabis pourraient avoir une incidence sur votre statut d’immigrant au Canada. Si vous commettez l’un de ces crimes, vous ne pourrez peut-être pas venir au Canada ou y rester.

Nouvelles peines et comment vous pourriez être affectés

Code
<section class="alert alert-warning">
 <h3>Modifications aux lois sur la conduite avec facultés affaiblies et la criminalité liée au cannabis</h3>
 <p>Les nouvelles peines pour conduite avec facultés affaiblies et infractions liées au cannabis pourraient avoir une incidence sur votre statut d’immigrant au Canada. Si vous commettez l’un de ces crimes, vous ne pourrez peut-être pas venir au Canada ou y rester.</p>
 <p><a href="https://www.canada.ca/fr/immigration-refugies-citoyennete/nouvelles/avis/peines-conduite-affaiblies-cannabis-incidence-statut-immigrant.html">Nouvelles peines et comment vous pourriez être affectés </a></p>
</section>

À compter du 1er avril 2022, les tests préalables à l’entrée ne seront plus exigés pour les voyageurs entièrement vaccinés qui entrent au Canada par voie terrestre, aérienne ou maritime. Entre-temps, veuillez respecter les exigences relatives aux tests de dépistage avant l’entrée.

Communiqué de presse

Code
<section class="alert alert-warning">

			<p><strong>À compter du 1er avril 2022,</strong> les tests préalables à l’entrée ne seront plus exigés pour les voyageurs entièrement vaccinés qui entrent au Canada par voie terrestre, aérienne ou maritime. Entre-temps, veuillez respecter les exigences relatives aux tests de dépistage avant l’entrée.</p>
			<p><a href="https://www.canada.ca/fr/sante-publique/nouvelles/2022/03/le-gouvernement-du-canada-retirera-lexigence-relative-au-depistage-prealable-a-lentree-pour-les-voyageurs-entierement-vaccines-le-1e-avril.html">Communiqué de presse</a></p>
			</section>

3. Alerte d’information

Utilisation : Utilisez l’alerte d’information pour attirer l’attention sur une précision concernant le contenu environnant, comme le nombre de semaines pour recevoir un remboursement quand une demande est effectuée par courrier ou par téléphone.

État actuel de l’appel de candidatures : Fermé

Nous vous remercions de votre intérêt à l’égard du programme Emplois d’été Canada. L’appel de candidatures est maintenant fermé.

Code
<section class="alert alert-info">
  <h3>État actuel de l’appel de candidatures : Fermé</h3>
  <p>Nous vous remercions de votre intérêt à l’égard du programme Emplois d’été Canada. L’appel de candidatures est maintenant fermé.</p>
</section>

4. Alerte de succès

Utilisation : Utilisez l’alerte de succès pour attirer l’attention sur une action fructueuse, comme la validation du formulaire ou l'accomplissement d'une tâche.

Votre demande de données accessibles au public à partir de la liste des organismes de bienfaisance a été acceptée.

Le délai de traitement de votre demande peut prendre jusqu’à quatre (4) semaines. Nous communiquerons avec vous si nous avons besoin de plus amples renseignements.

Code
<section class="alert alert-success">
  <h3>Votre demande de données accessibles au public à partir de la liste des organismes de bienfaisance a été acceptée.</h3>
	<p>Le délai de traitement de votre demande peut prendre jusqu’à quatre (4) semaines. Nous communiquerons avec vous si nous avons besoin de plus amples renseignements.</p>
</section>

Recherche et blogue

Ce style d'alerte a été utilisé avec succès dans le cadre d'un projet visant à améliorer le contenu des conseils aux voyageurs :

Derniers changements

Ajout d’un exemple d’avertissement supplémentaire qui comprend une date.

Ajout d'un lien vers un article de blogue sur la « fatigue d’alerte ».

Définition et conseils de mise en œuvre ajustés.
Promotion du modèle d'alerte bêta au modèle d'alerte stable.

Discussion

Discuter de la composante sur la page des problèmes techniques de Github

Avez-vous trouvé ce que vous cherchiez?

Qu’est-ce qui n’allait pas?

Vous ne recevrez aucune réponse. Les numéros de téléphone et les adresses électroniques seront supprimés.
Maximum de 300 caractères

Merci de vos commentaires

Date de modification :