Étiquettes: Système de conception de Canada.ca
- Dernière modification : 2021-02-08
Les étiquettes sont des indicateurs visuels qui attribuent une étiquette à des items comme des événements, des produits, des programmes ou des services.
Sur cette page
Quand utiliser cette configuration
Utilisez des étiquettes dans les cas suivants :
- Signaler qu'un item appartient à une catégorie (par exemple, pour montrer que certains programmes sont ouverts, que d'autres sont fermés, et que d'autres seront bientôt disponibles).
- Étiqueter ou étamper des items avec des renseignements supplémentaires, comme la date de la dernière mise à jour, ou la fermeture d'une zone.
- Indiquer les différents stades d'avancement dans une liste d'items (par exemple, pour montrer quels vaccins sont en cours d'examen et lesquels sont approuvés).
Dans votre conception, assurez-vous que l'étiquette soit très proche de l'item auquel elle s'applique.
Quoi éviter
- N'utilisez pas de longues étiquettes ou de phrases complètes - soyez bref.
- N'utilisez pas d'étiquettes dont la signification se chevauche entre elles.
- N'utilisez pas d'étiquettes pour ajouter un style à du texte.
Comment mettre en oeuvre
Utilisez le bon type d'étiquette :
1. Étiquette par défaut
Quand l'utiliser : pour donner des renseignements supplémentaires sur un item, commme ajouter des dates à une liste d'items.
Code
<a href="#">Évaluation du programme de citoyenneté</a> <span class="label label-default">Juillet 2020</span>
2. Étiquette primaire
Quand l'utiliser : pour transmettre une information importante sur un item, comme lorsqu'un nouveau programme n'est pas encore ouvert mais qu'il le sera bientôt.
Prestation canadienne de la relance économique (PCRE) Ouvre le 12 octobre
Code
<h3 class="h5"><a href="#">Prestation canadienne de la relance économique (PCRE)</a> <span class="label label-primary">Ouvre le 12 octobre</span></h3>
3. Étiquette de succès
Quand l'utiliser : pour signaler qu'un item est ouvert, disponible ou approuvé.
Protection de l’eau douce au Canada Ouverte – Avis acceptés
Code
<p><a href="#">Protection de l’eau douce au Canada</a> <span class="label label-success">Ouverte – Avis acceptés</span></p>
4. Étiquette d'information
Quand l'utiliser : pour étiquetter un item avec une catégorie, comme pour identifier un nouvel article de blogue. Les étiquettes indiquant qu'un item est nouveau devraient être temporaires.
Code
<h3 class="h5"><a href="#">Étude sur les étiquettes : quels mots fonctionnent le mieux</a> <span class="label label-info">Nouveau</span></h3>
5. Étiquette d'avertissement
Quand l'utiliser : lorsque vous voulez attirer l'attention sur un élément pour avertir les gens d'un changement, comme lorsqu'un programme se termine bientôt.
Prestation canadienne d’urgence (PCU) Bientôt fermée
Code
<h3 class="h5"><a href="#">Prestation canadienne d’urgence (PCU)</a> <span class="label label-warning">Bientôt fermée</span></h3>
6. Étiquette de danger
Quand l'utiliser : lorsqu'un item n'est plus disponible, comme lorsqu'un programme est terminé ou qu'une zone est fermée.
Code
<h3 class="h5"><a href="#">Prestation canadienne d’urgence (PCU)</a> <span class="label label-danger">Fermée</span></h3>
Recherche et blogue
Nous avons testé avec succès l'utilisation des étiquettes pendant la période de transition entre la Prestation canadienne d'urgence et les nouvelles prestations qui l'ont remplacée. L'ajout d'étiquettes aux différents programmes sur la page de thème a permis aux gens de comprendre plus facilement ce qui leur était offert.
Derniers changements
- Ajout de la documentation pour les étiquettes dans le système de conception
Détails de la page
- Date de modification :