Navigation de style métro: Conception de Canada.ca
- Bêta
- Dernière modification : 2024-08-01
Diviser du contenu long et complexe en pages qui se concentrent chacune sur une étape ou une réponse spécifique dont les gens ont besoin avant de passer à l'étape ou à la section suivante. Idéal pour présenter un service ou un processus.
Sur cette page
Quand utiliser cette configuration
Utilisez cette configuration pour regrouper des pages de tâches connexes et assurer la navigation entre ces pages.
Gardez le nombre de pages liées ensemble à un nombre raisonnable (idéalement 6 ou moins, maximum 8).
Quoi éviter
N'utilisez pas de chiffres lorsque vous utilisez ce modèle pour des étapes séquentielles. Des tests ont montré que les Canadiens ont moins de chances d'arriver à la section dont ils ont besoin si les éléments sont numérotés.
Comment mettre en oeuvre
Cette configuration de conception est toujours en version bêta, et le code est toujours en cours de révision. Utilisez-la avec parcimonue, puisqu'elle peut encore faire l'objet de modifications.
Page d'index
Quand utiliser cette variante : Utilisez comme page d'accueil pour un ensemble de pages connexes qui utilisent la navigation de style métro.

Description longue de la page d’index :
Un bloc d’introduction suivi d’une liste verticale d’étapes de navigation disposées en ordre séquentiel.
- Le titre H1 est [Nom du service] et est suivi d’un court paragraphe composé de texte fictif.
- Juste en dessous se trouve un titre intitulé « Sections ».
- En dessous se trouve une liste de six étapes, chacune étant jumelée à une icône circulaire. Les icônes circulaires sont connectées par une ligne verticale.
- Chaque étape comprend un hyperlien composé de texte fictif allant de [Nom de l’étape ou de la section 1] à [Nom de l’étape ou de la section 6] et est suivie d’une description d’une seule ligne composée de texte fictif.
Page d'étape
Quand utiliser cette variante : Utilisez sur chaque page liée par la navigation de style métro.

Description longue de la page d’étape :
Un titre H1 suivi d’un contenu de page fictif dans la partie gauche de la page, la partie droite comprenant des éléments de navigation sous la forme d’une liste verticale.
- Le titre H1 est un titre à deux parties superposées. La première ligne est [Nom du service], et la deuxième ligne est [Page 1].
- Sous le titre H1 se trouvent deux paragraphes de texte fictif.
- À droite du titre H1 et du texte fictif se trouve la navigation. La navigation comprend un titre intitulé « Sections ».
- Sous le titre se trouvent six étapes (six sections) disposées verticalement. Chaque étape est jumelée à une icône circulaire. Les icônes circulaires sont connectées par une ligne verticale pour représenter une séquence d’étapes. Chaque étape comprend un hyperlien composé de texte fictif allant de [Page 1] jusqu’à [Page 6].
Référence pour la mise en œuvre du thème GCWeb (BOEW)
La référence à l’implémentation explique la façon de configurer chaque élément de la page GC Métro.
Recherche et blogue
Cette configuration a été développée avec l'ARC dans le cadre d'un projet d'optimisation de la Prestation canadienne pour enfants. Elle fonctionne bien sur les appareils mobiles et elle est un façon efficace de montrer la relation entre des pages liées.
Derniers changements
- La page sur le modèle de navigation de style métro a été mise à jour afin de supprimer la phrase où l’on déconseille l’utilisation de sous-étapes. Il est vrai que, dans le cas de certains processus plus complexes, l’utilisation de sous-étapes peut s’avérer judicieuse.
- Clarification que la page d'index est requise
- Remplacement du mot « sections » par « pages » dans l'introduction
- Lancement du modèle de navigation de style métro en version bêta
- Date de modification :