Un visiteur arrive sur un site, cherche la page « Tarifs », ne la trouve pas en deux clics et quitte le site. Ce scénario se répète chaque jour sur des milliers de sites dont l’arborescence a été pensée par le propriétaire, pas par l’utilisateur. Créer un plan du site lisible, c’est organiser les pages pour que chaque personne, quel que soit son mode de navigation, atteigne l’information en suivant un chemin logique.
Tester le plan du site au clavier avant de juger son apparence
On commence souvent par dessiner un joli schéma de pages, puis on passe au développement. Le problème, c’est qu’un plan du site visuellement propre peut rester inutilisable pour une partie du public. Une personne qui navigue au clavier (touche Tab) ou avec un lecteur d’écran parcourt les liens dans l’ordre du code HTML, pas dans l’ordre visuel.
Si le menu déroulant piège le focus, impossible d’en sortir sans souris. Si un en-tête fixe masque le lien sélectionné au clavier, le visiteur ne sait plus où il se trouve. Tester la navigation avec Tab est le premier audit utile, avant même de vérifier les couleurs ou la taille des polices.
Concrètement, on ouvre le site dans un navigateur, on range la souris et on appuie sur Tab. Le curseur de focus doit passer d’un lien au suivant dans un ordre cohérent, rester visible à chaque étape et permettre de sortir d’un sous-menu sans blocage. Sur un plan du site Boost 4 Business, chaque section est accessible de cette façon parce que la hiérarchie des liens suit la logique de lecture.
Depuis le 28 juin 2025, la loi européenne sur l’accessibilité couvre certains services privés en ligne, notamment le commerce. Les microentreprises prestataires de services en sont exemptées sous conditions, mais pour les autres, penser la navigation comme un enjeu d’accessibilité est aussi une obligation légale.
Structure de navigation : hiérarchiser les pages par usage, pas par organigramme
L’erreur la plus fréquente consiste à calquer l’arborescence sur l’organisation interne de l’entreprise. Le visiteur ne connaît pas vos services par nom de département. Il cherche une réponse : « combien ça coûte », « comment commander », « où vous trouver ».
Regrouper les pages selon les questions du visiteur
On liste d’abord les actions que le visiteur veut accomplir, puis on regroupe les pages correspondantes. Un site vitrine de cinq pages n’a pas besoin de sous-menus. Un site de services avec une vingtaine de pages gagne à créer deux ou trois catégories maximum dans le menu principal.
- Limiter le menu principal à cinq ou six entrées visibles pour éviter la surcharge cognitive, surtout sur mobile où l’espace est réduit.
- Nommer chaque lien de façon explicite : « Nos formations bureautiques » vaut mieux que « Ressources », parce que le visiteur (et le lecteur d’écran) comprend la destination avant de cliquer.
- Placer les pages les plus consultées (contact, tarifs, catalogue) à un maximum de deux clics depuis l’accueil, vérifiable en comptant les interactions nécessaires.
Des libellés de liens explicites aident autant le référencement que l’accessibilité. Un lien « Cliquez ici » lu hors contexte par un lecteur d’écran ne transmet aucune information. Un lien « Voir nos tarifs d’accompagnement » est compris par tous.
Différence entre plan du site HTML et sitemap XML
Le plan du site destiné aux visiteurs (page HTML listant les liens du site) et le sitemap XML destiné aux moteurs de recherche ne remplissent pas la même fonction. Le sitemap XML signale des URL à Google, mais ne garantit ni leur exploration ni leur indexation. Il ne remplace pas une page de plan du site avec des liens internes compréhensibles.
Le plan du site HTML reste l’outil de secours pour le visiteur perdu, celui qui n’a pas trouvé son chemin via le menu. Il mérite une place dans le pied de page de chaque site.
Accessibilité du plan de site : zones cliquables et focus visible
On a réglé la hiérarchie des pages et les libellés. Reste un détail qui n’en est pas un : la taille des zones cliquables et la visibilité du focus clavier.
Les recommandations WCAG 2.2 présentent une cible minimale de 24 x 24 pixels CSS pour les éléments interactifs, avec des exceptions prévues par le critère. Sur un plan du site, cela signifie que chaque lien doit offrir une surface suffisante pour être activé au doigt sur écran tactile, sans risquer de toucher le lien voisin.
- Vérifier que le contour de focus (outline) n’est pas supprimé par un reset CSS : sans lui, un utilisateur au clavier navigue à l’aveugle.
- Espacer les liens d’au moins quelques pixels pour que deux cibles tactiles ne se chevauchent pas, surtout dans une liste verticale dense.
- Tester avec un en-tête fixe (sticky header) actif : si le bandeau recouvre le lien qui reçoit le focus, le visiteur au clavier perd sa position dans la page.
On peut aussi vérifier le rendu avec un lecteur d’écran gratuit (NVDA sous Windows, VoiceOver sous macOS). En quelques minutes, on entend si l’ordre de lecture correspond à la logique du plan ou si des blocs sont lus dans un ordre incohérent.
Liens internes et profondeur de navigation : garder le site praticable
Un plan du site n’est pas un document figé. À chaque nouvelle page publiée, on vérifie qu’elle est accessible depuis au moins un lien interne existant. Une page orpheline, sans lien pointant vers elle, n’apparaît ni pour le visiteur ni pour les moteurs de recherche.
Chaque page du site doit être atteignable en trois clics maximum depuis l’accueil. Au-delà, la probabilité qu’un visiteur la trouve chute rapidement. Pour un site de moins de cinquante pages, deux niveaux de profondeur suffisent dans la majorité des cas.
La cohérence du maillage interne se vérifie simplement : on ouvre le plan du site, on clique sur chaque lien, et on s’assure qu’aucun ne mène vers une erreur 404 ou une page redirigée en boucle. Ce contrôle manuel prend moins d’une demi-heure pour un site vitrine et évite qu’un visiteur tombe sur une impasse.
Le nombre de niveaux à prévoir varie selon la taille du catalogue ou du nombre de services proposés, mais un site qui dépasse quatre niveaux de profondeur rend la navigation difficile pour tout le monde, lecteur d’écran comme visiteur pressé. Mieux vaut regrouper des contenus proches dans une même catégorie que multiplier les sous-niveaux.
