Lien en vedette: Système de conception de Canada.ca

Sur cette page

• Quand l’utiliser
• Quoi éviter
• Contenu et conception
• Comment procéder à la mise en œuvre
• Recherche et justification
• Derniers changements

Quand l’utiliser

Utilisez la configuration de conception d’un lien en vedette afin de promouvoir des éléments importants de nature temporaire, tels qu’une déclaration sur le jour du Souvenir.

Utilisez cette configuration de conception uniquement sur les pages d'accueil.

Vous pouvez gérer plusieurs liens dans l’emplacement du lien en vedette en les rendant aléatoires à chaque visite de la page.

Quoi éviter

N’utilisez pas cette configuration de conception lorsque vous souhaitez que les gens restent sur la page et accomplissent leur tâche.

N’incluez pas d’images dans cette section.

N’incluez pas plus d’un lien dans la configuration de conception.

N’incluez pas plus d’une section de lien en vedette sur une page.

Contenu et conception

Trouvez des spécifications de contenu et de conception et des exemples visuels.

Spécifications de contenu

Dans cette configuration de conception, alignez le texte à gauche.

Utilisez du texte de lien descriptif pour que l’utilisateur sache clairement où il ira s’il clique sur le lien.

Spécifications de conception

• Texte :
  • Couleur : #FFF
  • Type de la police : Lato Sans
  • Taille de la police : 20 px
• Arrière-plan :
  • Couleur par défaut : #355688
  • Opacité : 0.9
  • Marges intérieures (padding) :
    • Bas : 15 px
    • Haut : 15 px

Vous pouvez changer la couleur de fond pour l’adapter à vos besoins.

Accessibilité

Le titre « En vedette » doit avoir la classe wb-inv; ainsi, il ne sera pas visible, mais sera tout de même présent pour le plan sémantique et les lecteurs d’écran.

Si vous changez la couleur de fond, veillez à ce que le rapport de contraste soit d’au moins 4,5:1.

Exemples visuels

Description de l’image : lien en vedette - grand écran

Un lien en vedette est affiché dans une bande bleue qui s’étend sur toute la longueur de l’écran. Au-dessus du lien en vedette figure le nom du ministère (Ressources naturelles Canada), suivi d’une brève description du ministère.

Comment procéder à la mise en œuvre

Trouvez des exemples pratiques et de code pour mettre en œuvre le lien en vedette, y compris la fonctionnalité d’affichage aléatoire.

GCWeb

• Lien en vedette - GCWeb

Affichage aléatoire dans la BOEW

• Aléatoire- exemples pratiques et code
• Guide de mise en œuvre rapide – thème GCWeb

Mises en oeuvre

Déterminez ce qui convient le mieux au type de page que vous créez.

Recherche et justification

Constatations découlant de la recherche

Le lien en vedette est un moyen contrôlé d’offrir un espace promotionnel « au-dessus du pli » sur les pages d’accueil.

Justification stratégique

Cette configuration de conception est facultative pour les modèles obligatoires suivants :

• Page d’accueil institutionnelle
• Page d’accueil de Canada.ca

Derniers changements

2024-04-03

Mise à jour de l’orientation pour y inclure les spécifications de contenu et de conception, des exemples visuels et une orientation sur la mise en œuvre.