Dernière mise à jour : 30 octobre 2025
La liste de liens présente des ressources redirigeant vers des contenus complémentaires au sujet de la page.
- Guide d’utilisation
- Design
Utilisation
La liste de liens constitue un bloc de navigation secondaire regroupant des liens vers des contenus pertinents permettant d'approfondir le sujet ou d’explorer des thématiques connexes. Ces liens peuvent mener vers :
- d’autres pages informationnelles ;
- des fichiers à télécharger ;
- des sites externes.
Variants possibles
Les variants proposés s'adaptent à différents contextes et offrent la possibilité de catégoriser ou non les contenus complémentaires présentés.
1. Liste de liens
Le module de ce variant est introduit par le titre standardisé « Sujets pouvant vous intéresser » et permet l’ajout d’une description pour contextualiser la liste au besoin.
2. Description du module (optionnelle)
3. Liste de liens
Caractéristiques du module
Présente les liens sous forme d’une simple liste.
Se positionne sous le contenu principal, souvent dans les dernières sections de la page.
Peut inclure jusqu’à huit liens.
2. Liste de liens avec catégories
Ce variant permet d’organiser les liens en deux listes catégorisées. Le module est introduit par le titre standardisé « Sujets pouvant vous intéresser » et permet l’ajout d’une description, si le contenu du module nécessite une mise en contexte.
Chaque catégorie doit avoir un titre. La description est optionnelle. Toutefois, si une catégorie a une description, l’autre doit aussi en avoir une, par souci d'uniformité.
2. Description du module (optionnelle)
3. Titre de la catégorie
4. Description de la catégorie (optionnelle)
5. Liste de liens
Caractéristiques du module
Regroupe les liens en deux catégories selon des thématiques communes.
Se positionne sous le contenu principal, souvent dans les dernières sections de la page.
Présente un maximum de huit liens répartis dans les deux catégories.
Quand envisager autre chose
Il existe différentes options de maillage selon l’intention visée.
- Pour mettre de l’avant des pages informationnelles en lien avec le contenu, on utilise un variant de la tuile.
- Pour intégrer dans la page une proposition d’articles connexes, on opte pour la tuile article.
- Pour référer à un article directement dans le corps d’un texte, on privilégie l’hyperlien.
Rédaction UX
Titre du module
Le module d’une liste de liens est toujours introduit par le titre standardisé « Sujets pouvant vous intéresser ».
Si, pour répondre à un besoin précis, ce titre doit être modifié, il doit respecter une limite de 80 caractères, espaces incluses.
Description du module (optionnelle)
La description sert à contextualiser le contenu du module.
Limite de caractères : 140, espaces incluses.
Titre de la catégorie
Le variant Liste de liens avec catégories doit inclure un titre pour chacune des deux catégories.
Ce titre doit refléter la thématique qui regroupe les liens dans une même catégorie.
Il doit être compréhensible, même lorsqu’il est lu hors contexte.
Il est composé d’un à trois mots.
Il ne contient pas de signe de ponctuation.
Description de la catégorie (optionnelle)
La description permet d’ajouter, au besoin, des précisions concernant la catégorie.
Si elle est utilisée, chaque catégorie doit en avoir une.
Limite de caractères : 80, espaces incluses.
Libellé d’un lien
Le libellé d’un lien reprend le titre du contenu vers lequel il redirige.
Si le titre est très long, il est possible d’en rédiger une version raccourcie qui reprend les principaux mots-clés pour bien guider le parcours utilisateur. Consulter les conseils pour la rédaction d’un titre.
Se référer aux règles de rédaction de l’hyperlien, pour en apprendre davantage sur la façon de libeller un lien qu’il redirige vers une page informationnelle, un fichier à télécharger ou un site externe.
Couleurs et styles
La liste de liens a toujours un fond de couleur gris-bleu-10 et s’utilise uniquement sur un arrière-plan de section blanc.
Personnalisation de la liste de liens
1. Liste de liens
Ce variant présente des liens sous forme de simple liste.
2. Liste de liens avec catégories
Deux catégories sont permises avec ce variant permettant de regrouper des liens sous des thématiques communes.
Grille
Le module s’adapte en fonction de la largeur de la grille.
Grilles – Petite (mobile) et moyenne (tablette)
Les éléments du module se positionnent l'un en dessous de l’autre.
Grilles – Large et x-large (ordinateur)
Le contenu du module est organisé en deux régions pour maximiser l’utilisation de l’espace.
États interactifs
Pour connaître les états interactifs de la liste de liens, se référer au composant Hyperlien.