LogicielsCréation de site internetTendancesArborescence de site web : définition, exemple et méthode

Arborescence de site web : définition, exemple et méthode

Sophie Martin
Sophie Martin
17 min

L’arborescence d’un site web permet d’avoir une vision globale du site et des parcours de navigation avant de réaliser les maquettes des pages principales. C’est un travail préalable indispensable pour créer un site internet. Réaliser le plan de son site web est souvent un exercice très difficile. Il n’est jamais évident d’organiser du contenu, souvent plus hétérogène qu’on l’imagine au départ. Surtout, faire un plan, c’est hiérarchiser, faire des choix, ce qui peut prendre du temps et créer des discussions dans une équipe. C’est un exercice difficile, mais ô combien important. Sans une navigation bien pensée, un site web, aussi joli soit-il, a peu de chances d’atteindre ses objectifs. Cet article vous donne toutes les clés pour comprendre les enjeux et réaliser concrètement l’arborescence de votre site web.

L’arborescence d’un site web, c’est quoi ?

L’arborescence (ou plan de site) est le schéma qui organise toutes les pages d’un site web en rubriques et sous-rubriques, en partant de la page d’accueil. Elle définit les niveaux de navigation et la hiérarchie des contenus. En pratique, on recommande de limiter la profondeur à 3 niveaux et de garder un menu principal de 5 à 7 entrées : c’est la base d’une navigation claire pour les visiteurs et d’un bon référencement naturel.

Schéma d'une arborescence de site web sur 3 niveaux : page d'accueil, rubriques principales, sous-pages

L’arborescence d’un site web est une étape fondamentale dans la création de votre site internet

De l’arborescence au wireframe

L’arborescence de site web, ou plan de site, se présente généralement sous la forme d’un schéma qui organise les pages du site en rubriques et définit les différents niveaux de navigation. C’est généralement la première étape lors de la conception d’un site web. Une fois que l’arborescence du site internet a été validée, toute l’équipe dispose d’une vision d’ensemble sur le site, et on peut descendre d’un niveau pour s’intéresser aux pages en vue de la réalisation des maquettes. L’étape suivante est de réaliser les zonings des pages, c’est-à-dire découper les pages principales en zones : par exemple, un rectangle horizontal pour le logo et le menu principal, un rectangle vertical à gauche pour le menu secondaire, etc. Ensuite, on passe des zonings aux wireframes, où l’on rajoute les principaux textes et les composants graphiques, puis enfin des wireframes aux maquettes graphiques du site web.

Soigner son arborescence de façon claire pour guider les visiteurs

C’est naturellement l’enjeu premier. La fameuse « règle des 3 clics » veut qu’une page importante soit accessible en 3 clics maximum depuis la page d’accueil. Elle n’a rien de scientifique, mais elle reste un bon garde-fou : quand on doit organiser une grande quantité d’informations, c’est souvent très difficile. Il n’y a pas de recette miracle, il faut mettre en place un dispositif de navigation initial, observer les parcours et améliorer le dispositif petit à petit. Un dispositif de navigation peut s’appuyer sur différents supports, en intégrant les principes d’accessibilité numérique et d’optimisation mobile, désormais essentiels dans la conception d’arborescences.

Quelques exemples :

  • Menu de navigation principal, avec éventuellement un menu secondaire qui apparaît au survol du menu principal
  • Menu de navigation secondaire : il peut s’agir du menu enfant de l’élément sélectionné dans le menu principal, mais il peut également s’agir d’un menu complètement différent
  • Moteur de recherche interne, avec un ou plusieurs axes de recherche
  • Barre latérale, où l’on peut favoriser la navigation horizontale via des suggestions de produits ou d’articles
  • Pied de page, avec un accès aux principales catégories du site ou à des pages clés

Si l’arborescence de votre site web est bien pensée, vous pourrez mettre en place un dispositif de navigation efficace pour toutes les situations. Quand on conçoit une arborescence, il ne s’agit pas uniquement de classer du contenu en catégories et sous-catégories, il s’agit d’anticiper des parcours. Si un visiteur arrive sur une page via une campagne publicitaire et qu’il s’intéresse à un produit précis, accèdera-t-il facilement à la page cible ? Difficile d’anticiper tous les parcours, mais prendre trois profils de visiteurs, chacun arrivant via un canal différent, avec un besoin différent, sur une landing page différente, peut être très utile pour affiner son arborescence et lui donner vie.

Travailler son arborescence pour améliorer son référencement naturel

L’arborescence de votre site internet aura un impact considérable sur son référencement naturel, que ce soit au niveau global ou dans la hiérarchie des pages de votre site. Les moteurs de recherche analysent les liens entre les pages de votre site pour en comprendre la structure générale et déterminer quelles sont les pages clés. Plus une page est « profonde », moins elle sera prise en compte. Concrètement, une catégorie de 3ème ou 4ème niveau sera référencée, mais les moteurs de recherche lui accorderont peu d’importance par rapport à une catégorie de premier ou de second niveau. Des techniques existent, comme l’utilisation d’une page annexe, très bien expliquée par Alexandra Martin avec l’exemple de la Fnac, mais il est généralement recommandé d’avoir au maximum trois niveaux de hiérarchie.

La profondeur des pages est loin d’être le seul enjeu SEO à intégrer dans votre réflexion sur le plan du site internet. Le plus important peut-être est d’organiser le contenu de son site pour rapprocher au maximum les pages liées à un même champ sémantique. Dans le jargon SEO, on parle d’architecture en silo quand toutes les pages d’une catégorie appartiennent à un même champ sémantique ; certains référenceurs prolongent cette logique avec la notion de « cocon sémantique », qui organise en plus le maillage interne du silo autour des pages à fort enjeu. Dans ce type d’architecture, les silos, c’est-à-dire les différents champs sémantiques du site, doivent être assez indépendants, et on peut utiliser des liens dans le contenu des pages pour mettre en avant certaines pages particulières du silo. Si le sujet vous dépasse, une agence SEO peut vous accompagner sur cette partie.

Arborescence web en silo

Le maillage interne est un sujet vaste et passionnant. Pour avoir les idées claires quand vous travaillez sur votre arborescence, voici les trois règles essentielles :

  • Plus une page est haute dans la hiérarchie de votre plan, meilleur sera son référencement,
  • Plus une page reçoit de liens d’autres pages de votre site, meilleur sera son référencement,
  • Plus une page reçoit (et envoie) des liens de pages proches au niveau sémantique, meilleur sera son référencement.

Dernière chose : tous les liens internes ne se valent pas. Un lien depuis le menu principal sera davantage valorisé qu’un lien dans le pied de page, et un lien dans le contenu sera plus valorisé qu’un lien en sidebar.

Réaliser l’arborescence de son site web en 5 étapes

Étape 1 : lister tous les contenus du site

Avant toute chose, il faut lister l’ensemble des éléments que vous voulez faire figurer sur votre site web. Dans un premier temps, inutile de raisonner en pages, cela peut vous ralentir : raisonnez plutôt en idées ou objets, en étant le plus exhaustif possible. Vous verrez un peu plus tard comment organiser vos idées et vos objets en pages.

Naturellement, identifier dès le départ les principaux types de contenu de votre site web peut être très utile. Pour une entreprise industrielle qui cherche à faire la promotion de ses activités sur Internet, les contenus pourraient par exemple être listés comme suit :

  • Offres & services : activité générale, domaine d’expertise 1, domaine d’expertise 2, points forts
  • Catalogue : gamme 1 (3 produits), gamme 2 (8 produits), gamme 3 (2 produits)
  • À propos : contact, bureaux, qui sommes-nous, mentions légales

Étape 2 : analyser l’arborescence de vos concurrents

L’arborescence de vos concurrents est souvent une mine d’informations utiles. Concrètement, le premier intérêt est de s’assurer que vous n’avez pas oublié une idée ou une dimension importante dans votre secteur d’activité quand vous avez listé les contenus. Le deuxième objectif de l’étude de l’arborescence de vos concurrents est de vous donner des idées pour l’organisation du contenu. Chacun de vos concurrents a probablement défini une typologie de produits ou de services qui lui est propre : à vous de les analyser pour voir dans quelle mesure cela peut vous inspirer.

Pour analyser l’arborescence d’un site existant (le vôtre ou celui d’un concurrent), le plus efficace est d’utiliser un crawler. La référence reste Screaming Frog SEO Spider : sa version gratuite permet de crawler jusqu’à 500 URLs, et la licence complète coûte 199 £ par an. Le crawler parcourt le site comme le ferait un moteur de recherche et vous restitue la liste des pages, leur profondeur et la structure des liens. Les suites SEO généralistes comme Semrush, Ahrefs ou Sitebulb proposent aussi des modules d’audit de structure, avec des visualisations souvent plus lisibles pour un non-technicien.

Étape 3 : organiser & hiérarchiser le contenu

C’est le moment de donner vie à votre liste de contenus. Deux grands modes de raisonnement sont possibles.

L’approche bottom-up consiste à s’intéresser dans un premier temps à chaque type de contenu identifié dans la première étape, puis dans un second temps à agréger les mini-arborescences pour raisonner globalement. Dans certains cas, cette approche n’est pas adaptée, parce que les types de contenu ne sont pas structurants, ou parce que la difficulté principale est d’organiser le contenu d’un même type.

L’approche top-down consiste à définir en premier lieu le premier niveau de hiérarchie, puis à descendre petit à petit, en gardant toujours une vision globale.

Les deux approches ne sont pas incompatibles, bien au contraire : elles sont très complémentaires. Nous vous conseillons fortement de raisonner dans les deux sens, et de confronter les arborescences et les typologies auxquelles vous aboutissez. Dernier conseil : le bon sens doit être votre principe premier dans toutes vos réflexions. Cela peut paraître évident, mais dans les faits, cela ne l’est pas toujours, surtout quand on a la tête dans le guidon. Concrètement, cela signifie qu’il faut être cohérent et ne pas mélanger les poules et les œufs. Un atelier de tri de cartes (card sorting) avec quelques utilisateurs cibles est aussi un excellent moyen de confronter votre classement à celui de vos futurs visiteurs.

Étape 4 : formaliser l’arborescence sur papier ou avec un outil dédié

Évidemment, il est tout à fait possible de formaliser l’arborescence de votre site web sur papier. Cela permet généralement d’aller plus vite que sur un logiciel, et il est préférable de passer 2 h à faire 3 versions de l’arborescence sur papier que d’en faire une seule très jolie sur un logiciel. Une arborescence réalisée sur un logiciel sera en revanche plus facile à modifier et à partager. En pratique, c’est souvent un peu des deux : les premières réflexions se font sur papier ou sur un tableau blanc, puis, une fois la structure générale du plan de site arrêtée, la formalisation se fait sur un outil adapté. Quel outil, me direz-vous ?

  • GlooMaps : le plus simple pour démarrer. Gratuit, sans création de compte, il permet de construire une arborescence en quelques clics et de l’exporter en PDF, PNG ou XML. Seule limite : le lien de partage expire au bout de 14 jours sans visite.
  • Octopus.do : un « sitemap builder » visuel très agréable, qui permet d’esquisser en plus le contenu de chaque page (blocs lo-fi). Version gratuite limitée à 1 projet, plans payants à partir de 16 $/mois.
  • FigJam (inclus dans les abonnements Figma) ou Miro (version gratuite limitée à 3 tableaux) : des tableaux blancs collaboratifs parfaits pour co-construire l’arborescence en atelier, avec des modèles de sitemap prêts à l’emploi.
  • Les logiciels de mindmapping comme XMind ou MindMeister restent d’une aide précieuse pour organiser vos idées au départ, et les outils de diagrammes comme Lucidchart conviennent bien aux arborescences complexes.

Interface de GlooMaps, outil gratuit de création d'arborescence de site web

Une fois l’arborescence validée, vous passerez aux maquettes : découvrez notre sélection de logiciels de maquettage web et d’outils de wireframe pour cette étape.

Interface d'Octopus.do, outil visuel de création de sitemap et d'arborescence

Étape 5 : scénariser, penser SEO et recommencer !

Ce n’est pas fini ! Une fois que votre arborescence de site web est formalisée, il faut l’éprouver, la confronter à la réalité, c’est-à-dire à vos visiteurs. C’est un exercice très utile pour améliorer par petites touches le plan du site et identifier les liens entre les pages hors relations de parenté, ce qui sera très utile quand vous travaillerez sur le zoning de vos pages. Concrètement, le plus simple pour tester votre arborescence est de définir des scénarios et d’identifier pour chacun la navigation effectuée sur le site. Un scénario peut se définir comme suit :

  • Profil du visiteur : âge, CSP, maturité web
  • Objectif & sensibilité à votre offre : besoin fort pour un produit, intérêt flou pour le domaine, etc.
  • Canal d’acquisition : comment est-il arrivé sur votre site internet ? Référencement naturel ? Campagne presse ?
  • Page d’atterrissage : sur quelle page est arrivé le visiteur ? Fiche produit ? Blog ? N’oubliez pas que sur un site bien référencé, une grande partie des visiteurs arrive sur des pages d’atterrissage (ou landing pages) différentes de la page d’accueil.

Pour chaque scénario que vous définissez, imaginez le parcours que fera le visiteur sur votre site web. L’arborescence de votre site permet-elle à chaque fois d’arriver rapidement sur la page cible ? Une fois votre raisonnement centré sur les visiteurs, étape suivante : il faut maintenant penser aux robots ! Comme nous l’avons vu plus haut, l’arborescence est très importante pour le référencement naturel de votre site internet. Il faut s’assurer que vous avez bien respecté les règles de base. Vos pages clés sont-elles bien dans le premier ou le deuxième niveau de hiérarchie ? Vos catégories forment-elles des champs sémantiques cohérents ?

Durant cette phase, n’hésitez surtout pas à tout recommencer. L’arborescence d’un site web, c’est le squelette du site internet : il faut vraiment prendre le temps de réaliser un plan de site performant, que ce soit pour amener les visiteurs d’une landing page à une page cible, ou pour permettre aux moteurs de recherche d’appréhender facilement l’ensemble du contenu de votre site web. Elle devra apparaître clairement dans votre cahier des charges de site web.

Pour aller plus loin :

Si le sujet de la création de site internet vous intéresse, je vous invite fortement à parcourir ces articles :

Questions fréquentes

Comment éviter que l’arborescence du site ne devienne trop complexe à gérer en interne ?

L’arborescence a tendance à enfler dès qu’on laisse trop de liberté ou qu’on ne pose pas de cadre dès le départ : chaque équipe veut sa rubrique, et on finit avec un menu tentaculaire où personne ne sait où publier quoi. La bonne pratique, c’est d’imposer dès le début une règle simple : toute nouvelle page doit s’intégrer dans une logique existante, et le menu principal ne doit pas dépasser 6 à 7 entrées. Les ateliers de tri de cartes (card sorting) aident vraiment à prioriser les contenus et à rationaliser la structure.

Quels sont les écueils fréquents lors de la construction de l’arborescence et comment les anticiper ?

Le piège classique est le « copier-coller » de l’organigramme interne : chaque service veut sa page, ce qui ne colle pas avec la logique de navigation de l’utilisateur, qui cherche par besoins ou par solutions, pas par départements. Pour anticiper cet écueil, impliquez des utilisateurs dès les premiers ateliers, avec des tests de parcours ou des interviews rapides. Cela évite de reproduire une vision trop centrée sur l’entreprise au détriment de l’expérience utilisateur. La validation de l’arborescence par des tests utilisateurs, même rapides, est une valeur sûre.

Faut-il impliquer tous les départements dans la définition de l’arborescence ou limiter les interlocuteurs ?

Multiplier les décideurs ralentit le projet et dilue la vision : quand chaque département fait passer ses propres priorités, on aboutit à une arborescence lourde et peu cohérente. La stratégie qui marche le mieux consiste à restreindre le nombre de décideurs, tout en organisant des ateliers collaboratifs pour recueillir les besoins. Privilégiez une équipe projet resserrée, et sollicitez les autres départements lors des phases clés, comme la validation de la structure ou les tests de navigation. Cette approche hybride fait gagner du temps tout en rassurant les parties prenantes.

Comment mesurer si l’arborescence imaginée fonctionne réellement pour les utilisateurs ?

Ce n’est pas l’équipe projet qui a le dernier mot, mais les utilisateurs : une arborescence jugée logique en interne peut très bien perdre de vrais visiteurs. La méthode la plus efficace est le test de navigation (tree testing) : on donne des scénarios de recherche à des personnes externes au projet, et on observe si elles trouvent l’information sans aide. Si une part significative des testeurs échoue à localiser une page clé (le formulaire de contact, une fiche produit), c’est le signal qu’il faut revoir la structure. Ce type de test, réalisé avant la mise en ligne, évite des refontes coûteuses après coup. Une fois le site en ligne, les données de navigation (parcours, recherches internes) prennent le relais.

Notez cet article

5.0 / 5 — 1 vote

Partager cet article

Recherche globale

Recherchez parmi les agences, logiciels et articles de La Fabrique du Net.