Bloc d’introduction: Système de conception de Canada.ca
Dernière mise à jour : 2024-04-03
La configuration de conception du bloc d’introduction introduit le contenu d’une page de renvoi.
Sur cette page
Quand l’utiliser
La configuration de conception du bloc d’introduction est un élément obligatoire pour les pages d’accueil institutionnelles et les pages de sujet. Elle est facultative pour les autres pages de renvoi.
Quoi éviter
Ne l’utilisez pas sur les pages de destination lorsque les gens tentent d’accomplir une tâche.
Contenu et conception
Trouvez des spécifications de contenu et de conception et des exemples visuels.
Spécifications de contenu
La configuration de conception du bloc d’introduction consiste en ce qui suit :
Elle peut également inclure ces éléments :
Titre
Le titre de la page doit être descriptif et unique, mais bref.
N’utilisez pas d’acronymes ou d’abréviations dans le titre.
Description courte
Le texte doit être court et concis, idéalement sur une ou deux lignes.
- Environ 145 caractères avec les espaces
Rédigez dans un langage clair et simple.
Image
N’utilisez que des images décoratives, car l’image est cachée sur les petits écrans.
N’appliquez pas de lien à l’image; utilisez plutôt la configuration de conception d’un lien en vedette.
Limitez l’usage du texte dans les images.
- Consultez le Guide de rédaction du contenu du site Canada.ca pour obtenir d’autres conseils sur les images.
Bouton de super-tâche
N’incluez un bouton de super-tâche que s’il y a une tâche précise qui représente au moins le tiers du taux de clics provenant de la page.
Découvrez comment utiliser un bouton de super-tâche :
Spécifications de conception
-
Titre et description courte
- Le titre utilise la classe H1, et la description courte utilise le texte du corps.
- Utilisez les styles typographiques standards.
-
Image
- 1200 px sur 726 px
- Rapport de l’image : 1,65:1
- Visible sur les grands écrans, mais caché sur les moyens et les petits écrans
- Traité comme une image d’arrière-plan et positionné à droite
- Bouton de super-tâche
Accessibilité
- Si vous superposez du texte à une image, veillez à ce que le rapport de contraste soit d’au moins 4,5:1.
Exemples visuels
Description de l’image : bloc d’introduction - grand écran
Le bloc d’introduction apparaît sous l’en-tête général et le fil d’Ariane de Canada.ca. Il se compose d’un titre h1 pour le nom de l’institution et d’une description courte du mandat de l’institution. Cet exemple visuel ne comprend pas l’image optionnelle, ni le bouton de super tâche.
Description de l’image : bloc d’introduction - petit écran
Le bloc d’introduction apparaît sous l’en-tête général et le fil d’Ariane de Canada.ca. Il se compose d’un titre h1 pour le nom de l’institution et d’une description courte du mandat de l’institution. Cet exemple visuel ne comprend pas l’image optionnelle, ni le bouton de super tâche.
Comment procéder à la mise en œuvre
Trouvez des exemples pratiques et du code pour mettre en œuvre la configuration de conception du bloc d’introduction.
Référence pour la mise en œuvre du thème GCWeb (BOEW)
La référence à l’implémentation comprend la façon de configurer les éléments du système de conception.
Mises en œuvre
Déterminez ce qui convient le mieux au type de page que vous créez.
GC-AEM
Pour Adobe Experience Manager (AEM) du gouvernement du Canada (GC) :
Recherche et justification
Consultez les conclusions de la recherche et la justification de la politique.
Constatations découlant de la recherche
Résumé de recherche : Communiquer avec l’ARC
L’Agence du revenu du Canada (ARC) et le Bureau de la transformation numérique ont élaboré le bloc d’introduction dans le cadre du projet d’optimisation des contacts avec l’ARC.
Nous avons constaté que la configuration de conception du bloc d’introduction était utile sur les pages d’accueil institutionnelles, en particulier dans les situations où un bouton de super-tâche est nécessaire. Consultez le résumé de recherche pour en savoir plus sur d’autres aspects du projet.
Justification stratégique
La configuration de conception du bloc d’introduction est requise dans les modèles obligatoires suivants :
Derniers changements
- 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.
Détails de la page
- Date de modification :