--- title: "Arborescence d’un site web : la méthode, avec des exemples" description: "Arborescence d’un site web : organisez vos pages à partir des questions de vos clients, en trois niveaux au plus. La méthode, avec trois exemples commentés." canonical_url: "https://studiofogg.fr/journal/arborescence-site-web-methode-et-exemples" --- > Index of every page on this site: [llms.txt](https://studiofogg.fr/llms.txt) L’arborescence d’un site web est le plan hiérarchique de ses pages : celles qui existent, leur regroupement en rubriques et le chemin qui mène de l’accueil à chacune. Pour la construire, partez des questions de vos clients, prévoyez une page par besoin, regroupez ces pages en quelques rubriques aux intitulés explicites et ne dépassez pas trois niveaux. Donnez à chaque page une adresse lisible et stable, puis testez l’ensemble avant de dessiner la moindre maquette. Ce guide prolonge [nos conseils d’UX pour des pages comprises du premier coup](https://studiofogg.fr/journal/rubrique/ux-contenus-accessibilite). ## Arborescence, menu, plan du site : de quoi parle-t-on ? L’arborescence est un document de travail, décidé avant la conception des pages. Les autres termes la traduisent pour les visiteurs ou pour les moteurs de recherche.
Terme Ce que c’est Pour qui
Arborescence La liste hiérarchisée de toutes les pages, en arbre ou en liste indentée L’équipe du projet
Menu Les rubriques principales, affichées sur chaque page Les visiteurs
Fil d’Ariane Le chemin de l’accueil à la page consultée : Accueil › Création de jardins › Terrasses et allées Les visiteurs et les moteurs de recherche
Plan du site Une page qui liste les pages du site, rangées comme dans l’arborescence Les visiteurs, en complément du menu
Sitemap XML Un fichier technique qui liste les adresses à faire explorer Les robots des moteurs de recherche
Le menu ne montre donc qu’une partie de l’arborescence. Quant au sitemap XML, il ne remplace pas une structure claire. Selon Google, il n’est pas indispensable à un site d’environ 500 pages ou moins si toutes ses pages importantes sont accessibles par des liens depuis l’accueil et s’il a peu de vidéos, d’images ou d’actualités à faire indexer ([présentation des sitemaps par Google](https://developers.google.com/search/docs/crawling-indexing/sitemaps/overview?hl=fr)). ## Partir des questions de vos clients Vos visiteurs ne connaissent ni votre organisation ni votre jargon : ils arrivent avec une question. Listez ces questions, puis l’action que vous attendez d’eux une fois la réponse trouvée. Pour retrouver leurs mots exacts, appliquez [notre méthode pour écrire avec les mots de vos clients](https://studiofogg.fr/journal/rediger-les-textes-de-son-site-internet). Prenons un paysagiste imaginaire installé à Vertou, au sud de Nantes. Son inventaire commence ainsi :
Question du visiteur Page qui y répond Action attendue
« Faites-vous les terrasses en bois ? » Terrasses et allées Demander un devis
« Pouvez-vous tailler ma haie cet automne ? » Entretien de jardins Demander un devis
« Combien coûte un entretien à l’année ? » Entretien de jardins Demander un devis
« Intervenez-vous jusqu’à Clisson ? » Zone d’intervention Appeler
« Avez-vous déjà fait un jardin comme le mien ? » Réalisations Voir un chantier proche
Deux questions mènent à la même page : elles relèvent du même besoin. La dernière colonne compte autant que les autres : une page sans action attendue est souvent une page dont on peut se passer. ## Une page par besoin Chaque page répond à une question principale et propose une action. Cette règle évite deux écueils opposés : - **la page fourre-tout**, comme « Nos prestations », qui résume en dix lignes la création, l’entretien et l’élagage : elle ne répond précisément à aucune question ; - **les pages en double**, comme « Qui sommes-nous » et « Nos valeurs », qui racontent la même histoire : le visiteur ne sait pas laquelle lire, ni le moteur de recherche laquelle proposer. Pour trancher, demandez-vous si la page a un public et une action qui lui sont propres, et si quelqu’un pourrait la chercher sur Google avec ses propres mots. Si la réponse est non aux deux, fusionnez-la avec sa voisine. Si vous avez rempli la ligne « Pages indispensables » de [notre modèle de cahier des charges en une page](https://studiofogg.fr/journal/cahier-des-charges-site-internet-en-une-page), vous tenez déjà un premier jet. Ajoutez-y les pages que personne ne cherche mais que chacun doit pouvoir trouver, comme les mentions légales : leur place est dans le pied de page, pas dans le menu. ## Trois niveaux au plus : profondeur, menu et fil d’Ariane Chaque niveau ajoute un clic, et un choix, entre le visiteur et sa réponse. Sous l’accueil, trois niveaux suffisent à la plupart des sites : les rubriques, les pages, et un niveau de détail pour les catalogues. ### La profondeur : combien de clics depuis l’accueil ? Visez trois clics au plus entre l’accueil et chaque page importante. C’est un garde-fou plutôt qu’une loi : un clic de plus gêne peu s’il rapproche visiblement du but. Mais Google indique qu’il peut tenir compte du nombre de liens à suivre pour atteindre une page, et du nombre de liens qui y mènent, pour estimer son importance relative ([guide de Google sur la structure d’un site e-commerce](https://developers.google.com/search/docs/specialty/ecommerce/help-google-understand-your-ecommerce-site-structure?hl=fr)). Le menu n’est pas le seul chemin : les liens placés dans les textes, qui forment avec lui le [maillage interne du site](https://studiofogg.fr/glossaire#maillage-interne), rapprochent des pages de branches différentes. Pour mesurer la profondeur d’un site existant, un logiciel d’exploration comme [Screaming Frog SEO Spider](https://www.screamingfrog.co.uk/seo-spider/), gratuit jusqu’à 500 adresses, indique pour chaque page le nombre de clics depuis l’accueil. ### Le menu : peu d’entrées, des mots clairs Le menu montre le premier niveau, parfois le deuxième. Sur notre site, il compte cinq entrées et un bouton de contact ; les services y sont rangés en trois familles, dans un sous-menu. Quelques règles le gardent lisible : - des intitulés courts, avec les mots de vos clients : « Entretien de jardins » plutôt que « Nos solutions vertes » ; - un seul niveau de sous-menu : des tiroirs successifs se manient mal au doigt comme au clavier ; - l’action principale, devis ou réservation, mise à part sous forme de bouton ; - de vrais liens : en règle générale, Google n’explore que les liens écrits avec un élément HTML `` muni d’un attribut `href` ([liens explorables selon Google](https://developers.google.com/search/docs/crawling-indexing/links-crawlable?hl=fr)). ### Le fil d’Ariane et le plan du site : savoir où l’on est Le fil d’Ariane affiche le chemin de la page consultée et permet de remonter en un clic à chaque niveau supérieur. Google recommande qu’il représente un chemin classique de visiteur plutôt que de dupliquer la structure de l’URL ([documentation du fil d’Ariane](https://developers.google.com/search/docs/appearance/structured-data/breadcrumb?hl=fr)) ; depuis janvier 2025, Google ne l’affiche plus dans ses résultats sur mobile, seulement sur ordinateur. Le plan du site offre un second chemin à qui ne trouve pas une page par le menu. Le RGAA 4.1.2, le référentiel français d’accessibilité numérique, demande au moins deux systèmes de navigation parmi le menu, le plan du site et un moteur de recherche interne, sauf pour un site de très peu de pages. Ses critères exigent aussi un menu toujours à la même place et un plan du site représentatif de l’architecture générale du site ([critères de la thématique Navigation](https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#12)). [Le plan du site de notre studio](https://studiofogg.fr/plan-du-site), accessible depuis le pied de chaque page, reprend toutes les pages publiées. ## Trois exemples d’arborescence commentés Voici trois arborescences types pour des entreprises imaginaires, avec l’adresse de chaque page. Chacune illustre un choix différent. ### Un site vitrine : le paysagiste de Vertou - Accueil — `/` - Création de jardins — `/creation-de-jardins` - Terrasses et allées — `/creation-de-jardins/terrasses-et-allees` - Plantations et massifs — `/creation-de-jardins/plantations` - Entretien de jardins — `/entretien-de-jardins` - Réalisations — `/realisations` - Une page par chantier — `/realisations/jardin-sec-a-vertou` - Zone d’intervention — `/zone-intervention` - L’entreprise — `/entreprise` - Demander un devis — `/devis` La création a des sous-pages, car chaque prestation répond à une recherche distincte, comme « terrasse en bois Vertou » ; l’entretien reste une seule page tant que ses questions relèvent du même besoin. Une page unique décrit la zone d’intervention, plutôt qu’une page par commune, et aucune page n’est à plus de deux clics de l’accueil. Par rapport à l’exemple rempli de notre modèle de cahier des charges, « Contact » devient « Demander un devis », l’action attendue, et « L’entreprise » rassure ceux qui comparent plusieurs paysagistes. ### Un site de services : une entreprise de nettoyage nantaise - Accueil — `/` - Particuliers — `/particuliers` - Ménage à domicile — `/particuliers/menage-a-domicile` - Nettoyage de vitres — `/nettoyage-de-vitres` - Professionnels — `/professionnels` - Entretien de bureaux — `/professionnels/entretien-de-bureaux` - Fin de chantier — `/professionnels/fin-de-chantier` - Nettoyage de vitres — `/nettoyage-de-vitres` (la même page) - Tarifs — `/tarifs` - Demander un devis — `/devis` Particuliers et professionnels ne posent pas les mêmes questions : le premier niveau les sépare. La prestation commune garde une seule page, citée par les deux branches, plutôt que deux pages presque identiques. Entrer par le profil ou par la prestation ? Le tri de cartes, présenté plus bas, permet de trancher. ### Une boutique en ligne : une torréfaction nantaise - Accueil — `/` - Cafés — `/cafes` - Pure origine — `/cafes/pure-origine` - Éthiopie Sidamo — `/produits/ethiopie-sidamo` - Assemblages — `/cafes/assemblages` - Thés et infusions — `/thes-et-infusions` - Matériel — `/materiel` - Coffrets cadeaux — `/coffrets` - Abonnement — `/abonnement` Trois choix structurent cette boutique : - **la mouture est une variante** choisie sur la fiche produit, pas une rubrique : en grains ou moulu, c’est le même café ; - **l’adresse du produit ne contient pas sa catégorie** : le même café peut apparaître dans « Pure origine » et dans une sélection de Noël sans changer d’adresse ; - **les filtres ne sont pas des rubriques** : chaque combinaison d’origine, d’intensité ou de prix crée le plus souvent une adresse. Google met en garde contre ces « espaces d’URL infinis » et conseille, si vous n’en avez pas besoin dans les résultats, d’en empêcher l’exploration en laissant explorables les fiches produits et une liste sans filtre ([gérer la navigation à facettes](https://developers.google.com/crawling/docs/faceted-navigation?hl=fr)). Le guide e-commerce de Google conseille de relier le menu aux catégories, les catégories aux sous-catégories, puis à toutes les fiches produits, car son robot n’utilise en général pas le moteur de recherche interne. À défaut de lien, déclarez le produit dans un sitemap ou un flux Google Merchant Center. ## Des URL lisibles et stables Chaque page reçoit une adresse. Elle se lit dans un e-mail, sur un devis ou sous un QR code, et doit durer : - **des mots plutôt que des numéros** : `/entretien-de-jardins` plutôt que `/page.php?id=12`, avec des tirets entre les mots, comme le recommande Google ([structure des URL](https://developers.google.com/search/docs/crawling-indexing/url-structure?hl=fr)) ; - **des minuscules, sans accents** : Google distingue `/Contact` de `/contact`, et un « é » devient souvent « %C3%A9 » une fois l’adresse copiée ; - **un ou deux segments suffisent** : selon son guide e-commerce, Google ne tient en général pas compte de la structure des URL pour déterminer l’architecture d’un site, mais des liens entre les pages ; - **rien qui changera** : ni extension comme `.php`, ni mention « nouveau », ni catégorie susceptible de bouger. Tim Berners-Lee, l’inventeur du web, le résumait dès 1998 dans [un texte publié sur le site du W3C](https://www.w3.org/Provider/Style/URI) : « Cool URIs don’t change », une bonne adresse ne change pas. Sur notre site, l’adresse d’un article ne contient pas sa rubrique : celle de ce guide, `/journal/arborescence-site-web-methode-et-exemples`, ne bougera pas s’il change de rubrique. Si une adresse doit tout de même changer, une redirection 301 doit mener de l’ancienne à la nouvelle, comme l’explique notre [checklist pour refondre un site sans perdre son référencement](https://studiofogg.fr/journal/refonte-site-sans-perdre-son-referencement). ## Tester l’arborescence avant les maquettes Une arborescence se teste sans graphisme : les intitulés suffisent. La Commission européenne décrit deux méthodes complémentaires dans son guide de conception de sites web. ### Le tri de cartes : comment vos clients rangent-ils vos pages ? Chaque page ou contenu est écrit sur une carte, en papier ou dans un outil en ligne. Dans le tri ouvert, les participants regroupent les cartes à leur façon et nomment chaque groupe : vous découvrez leur logique. Dans le tri fermé, ils les rangent dans vos rubriques : vous vérifiez la vôtre. Pour ses propres sites, la Commission conseille de 30 à 50 cartes, toujours moins de 100, et 25 participants par profil d’utilisateur ([méthode du tri de cartes, en anglais](https://commission.europa.eu/resources/europa-web-guide/planning-your-web-presence/architecture-and-navigation/architecture-building-and-testing-methods/card-sorting-method_en)). ### Le test d’arborescence : trouve-t-on la bonne page ? On présente l’arborescence sous forme de menu en texte seul, puis on confie aux participants des tâches concrètes : « Votre haie déborde sur le trottoir : où cliquez-vous ? » On mesure le taux de réussite, la part de réussites du premier coup et le temps passé. La Commission recommande jusqu’à 50 participants pour un test en ligne sans animateur, et 10 tâches au plus par personne ([méthode du test d’arborescence, en anglais](https://commission.europa.eu/resources/europa-web-guide/planning-your-web-presence/architecture-and-navigation/architecture-building-and-testing-methods/tree-testing-method_en)). Pour un site vitrine, une version légère suffit souvent : quelques personnes proches de vos clients, accompagnées et invitées à penser à voix haute. Les chiffres sont moins solides, mais vous comprenez pourquoi elles se trompent. Rédigez les tâches avec les mots de vos clients, jamais avec ceux du menu. Si la consigne parle d’« entretien », tout le monde cliquera sur « Entretien », et le test ne prouvera rien. Une fois l’arborescence validée vient le zoning, qui répartit les contenus sur chaque page : c’est là que commence [notre guide des étapes du webdesign, du zoning au prototype](https://studiofogg.fr/journal/maquette-prototype-design-system-etapes-du-webdesign). Dans [nos missions de webdesign UX/UI](https://studiofogg.fr/services/webdesign-ux-ui-nantes), arborescence et parcours prioritaires sont ainsi validés avec vous avant tout travail graphique. ## Cinq erreurs d’arborescence à éviter - **Recopier l’organigramme** : un menu « Pôle travaux / Pôle services » décrit votre organisation, pas les besoins de vos clients. - **Créer une rubrique « Divers »** : elle trahit une page sans public ou une rubrique manquante. - **Multiplier les pages presque identiques**, une par commune ou par mot-clé : Google les range parmi les abus de pages satellites lorsqu’elles ressemblent plus à des résultats de recherche qu’à une arborescence claire ([règles de Google contre le spam](https://developers.google.com/search/docs/essentials/spam-policies?hl=fr)). - **Laisser des pages orphelines** : une page qu’aucun lien interne ne rejoint échappe aux visiteurs, et les robots ne la trouvent que par le sitemap ou un lien externe. - **Figer l’arborescence** : une offre arrêtée laisse une page obsolète, un nouveau service se greffe n’importe où. Revoyez-la chaque année et à chaque nouvelle offre. Phileas Fogg partait avec un itinéraire calculé au jour près ; un site gagne à tracer le sien avant la première maquette. Pour un site vitrine, l’arborescence se construit avec vous pendant l’atelier de cadrage, première étape de [nos projets de création de site vitrine à Nantes](https://studiofogg.fr/services/creation-site-vitrine-nantes). ## Sitemap See the full [sitemap](https://studiofogg.fr/sitemap.md) for all pages.