Si vous voulez développer un site web, ou effectuer une refonte de site web, la première étape à suivre sera de construire un plan pour organiser vos pages web et définir vos différentes rubriques.

Construire l’arborescence d’un site web a plusieurs utilités, que nous allons voir dans cet article de blog, et elle doit être faite de manière méthodique.

Suite à votre lecture, vous connaîtrez les étapes de conception et de structuration d’arborescence de site.

Table des matières

Qu’est-ce qu’une arborescence site web ?

Avant toute chose, il me semble important de définir ce qu’est l’arborescence d’un site web, pour être sûr que nous soyons bien sur la même longueur d’onde :

L’arborescence d’un site web, aussi appelée plan de site internet, est un schéma sur lequel sont représentées les pages du site web ainsi que ses différents niveaux de navigation. L’arborescence est la première étape à suivre lors de la conception ou la refonte d’un site web.

Pour vous donner un exemple concret d’une arborescence de site web :

arborescence du site sortlist

Une arborescence de site web sert donc à construire le plan de votre site web ainsi que son maillage interne. C’est un guide qui permet d’y voir beaucoup plus clair dans votre réflexion avant de commencer sa conception et sa mise en ligne.

Mais au-delà de ça, il y a deux grandes raisons qui devraient vous pousser à construire une arborescence de site web :

  • L’élaboration d’une bonne expérience utilisateur.
  • L’optimisation de votre référencement.

Voyons chacun de ces deux points dans la suite de cet article de blog.

adimeo
ADIMEO
Paris, France
4.84 - 3 recommandations
Ergonomie (UX/UI)Stratégie DigitaleDéveloppement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
capture-decran-2021-02-19-a-18-07-30
Nemesis tech
Paris, France
4.5 - 10 recommandations
Développement webDéveloppement mobile & AppLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
capture-decran-2020-11-20-a-10-53-26
Accelerator Team
Paris, France
5 - 9 recommandations
Développement webDéveloppement mobile & AppLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
capture-decran-2020-10-23-a-12-33-16
Periscope
Paris , France
4,5 - 5 recommandations
SEOStratégie DigitaleDéveloppement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
capture-decran-2020-10-23-a-12-24-06
ITDM Group
Colmar , France
4,5 - 5 recommandations
Mobile & App DesignStratégie DigitaleDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebWeb & Software Development
Découvrir l’agencearrow_forward
capture-decran-2020-10-09-a-10-35-06
Aji Creative
Lognes, France
5 - 26 recommandations
SEOMobile & App DesignStratégie DigitaleDéveloppement webDéveloppement mobile & AppE-commerce Software
Découvrir l’agencearrow_forward
capture-decran-2020-06-26-a-12-05-06
Bfast-Développement
Vibraye, France
0 - 0 recommandation
Content MarketingStratégie DigitaleDéveloppement webDéveloppement mobile & AppWeb DesignLogiciels Création de Site Web
Découvrir l’agencearrow_forward
capture-decran-2020-06-26-a-10-28-35
Agence Paprika
Poisy, France
0 - 0 recommandation
BrandingStratégie DigitaleDéveloppement webWeb DesignDesign Graphique
Découvrir l’agencearrow_forward
anadore
Anadore
Paris, France
5/5 - 1 recommandation
Développement webWeb DesignLogiciels Création de Site WebDesign Graphique
Découvrir l’agencearrow_forward
clic
Let’s Clic
Paris, France
5/5 - 32 recommandations
Stratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
celu
CELUGA
Paris, France
5/5 - 5 recommandations
Mobile & App DesignStratégie DigitaleDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
split
SPLIT
Paris, France
5/5 - 6 recommandations
Mobile & App DesignStratégie DigitaleDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
pari
Imagine Communication
Paris, France
5/5 - 9 recommandations
Content MarketingBrandingEvenementielStratégie DigitaleDéveloppement webWeb DesignLogiciels Création de Site WebProduct DesignDesign GraphiqueE-commerce SoftwareMarketing
Découvrir l’agencearrow_forward
piment
L-Agence-Communication.fr
Villeneuve-d'Ascq, France
5/5 - 20 recommandations
BrandingStratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
fly
Flying Saucer Studio
Paris, France
5/5 - 11 recommandations
Content MarketingBrandingEmailingStratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueMarketing
Découvrir l’agencearrow_forward
toch
LesBonsTech
Lyon, France
5/5 - 5 recommandations
Content MarketingMobile & App DesignDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
hello
Hello Pomelo
Paris, France
5/5 - 22 recommandations
Mobile & App DesignRelations PubliquesStratégie DigitaleDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
impulse
D-IMPULSE
Bois-Guillaume, France
5/5 - 9 recommandations
Content MarketingStratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
sokeo
SOKEO
Marseille, France
5/5 - 11 recommandations
Content MarketingStratégie DigitaleDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
web-4
MDWeb
Villeneuve-d'Ascq, France
5/5 - 1 recommandation
Développement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
ajensi
ajensi
Paris, France
5/5 - 9 recommandations
Mobile & App DesignDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebProduct DesignDesign Graphique
Découvrir l’agencearrow_forward
spring1
Springbok
Paris, France
5/5 - 0 recommandation
Content MarketingBrandingStratégie DigitaleDéveloppement webDesign Graphique
Découvrir l’agencearrow_forward
elan
ÉLAN CRÉATIF
Échirolles, France
5/5 - 6 recommandations
Content MarketingEvenementielStratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
usts
USTS Innovative Agency
Paris, France
5/5 - 7 recommandations
Content MarketingBrandingEvenementielRelations PubliquesDéveloppement webMarketing
Découvrir l’agencearrow_forward
zol
ZOL
Lyon, France
5/5 - 9 recommandations
Stratégie DigitaleDéveloppement webDéveloppement mobile & AppLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
crea
Envision
Grenoble, France
5/5 - 5 recommandations
Stratégie DigitaleDéveloppement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
expe1
Andinasoft
Noyers-sur-Cher, France
5/5 - 5 recommandations
Mobile & App DesignStratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
simple3
SIMPLE CONCEPT
Lyon, France
5/5 - 6 recommandations
Mobile & App DesignEmailingStratégie DigitaleDéveloppement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
creat
Dynamic Creative
Aix-en-Provence, France
5/5 - 4 recommandations
BrandingEvenementielStratégie DigitaleDéveloppement webWeb DesignLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
wsi1
WSI-Kalizeo
Chevilly Larue, France
5/5 - 7 recommandations
Réseaux SociauxContent MarketingEmailingRelations PubliquesMobile MarketingStratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
simpl
SimplX
Lyon, France
5/5 - 3 recommandations
Mobile & App DesignDéveloppement webDéveloppement mobile & App
Découvrir l’agencearrow_forward
web
Web Studios
Paris, France
5/5 - 21 recommandations
Stratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
we1
HUGGGY
Ottignies-Louvain-la-Neuve, Belgium
5/5 - 4 recommandations
BrandingDéveloppement webLogiciels Création de Site WebDesign GraphiqueMarketing
Découvrir l’agencearrow_forward
mark1
Make it
Brussels, Belgium
5/5 - 5 recommandations
Réseaux SociauxContent MarketingBrandingStratégie DigitaleLogiciels Création de Site WebE-commerce SoftwareWeb & Software Development
Découvrir l’agencearrow_forward
sinapse
Sinapse
Watermael-Boitsfort, Belgium
5/5 - 1 recommandation
Content MarketingMobile & App DesignBrandingStratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign GraphiqueE-commerce Software
Découvrir l’agencearrow_forward
dev1
Devcom-Media
Forest, Belgium
5/5 - 6 recommandations
Content MarketingBrandingStratégie DigitaleDéveloppement webDesign Graphique
Découvrir l’agencearrow_forward
fish
Jellyfish creative studio
Liège, Belgium
5/5 - 1 recommandation
Stratégie DigitaleDéveloppement webLogiciels Création de Site WebDesign Graphique
Découvrir l’agencearrow_forward
sparkl
Sparkle
Mons, Belgium
5/5 - 4 recommandations
Mobile & App DesignDéveloppement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
sfd
Savoir Faire Digital
Blegny, Belgium
5/5 - 0 recommandation
Stratégie DigitaleDéveloppement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
blue1
Blue e-Motion
Lasne, Belgium
5/5 - 4 recommandations
Stratégie DigitaleDéveloppement webLogiciels Création de Site WebE-commerce Software
Découvrir l’agencearrow_forward
zee-group-illustration
Zee Group
Paris, France
4.5 - 15 recommandations
E-commerce SoftwareCreative & DesignWeb & Software Development
Découvrir l’agencearrow_forward
capital-panache-illustration
Capital Panache
Brussels, Belgique
5 - 7 recommandations
E-commerce SoftwareCreative & DesignWeb & Software Development
Découvrir l’agencearrow_forward

Une arborescence pour construire une bonne expérience utilisateur

Objectif et facilité de navigation

Votre site web aura un objectif bien précis. Il y a une raison pour laquelle vous souhaitez le mettre en ligne. Cela peut être vendre des produits, diffuser de l’information, ou encore capturer des leads.

C’est votre objectif qui doit guider la conception de votre site ou faire appel à un prestataire / une agence SEO à Paris.

Concrètement : l’arborescence de votre site web doit éliminer toutes les frictions qui peuvent exister entre vos visiteurs et l’objectif que vous cherchez à atteindre.

  • Si vous voulez vendre, acheter vos produits doit pouvoir se faire en quelques clics, avec un système de paiement ultra simplifié.
  • Si vous voulez diffuser de l’information, l’accès à celle-ci doit être très facile.
  • Et si vous voulez capturer des leads, votre formulaire doit être le plus court possible.
  • Etc.

En bref, l’arborescence de votre site web doit permettre à vos internautes de naviguer facilement sur votre site. C’est cette facilité de navigation qui leur donnera une bonne expérience utilisateur et qui leur donnera un bon souvenir de votre marque.

Trop souvent, dans la conception d’un site internet, on a tendance à placer son aspect visuel avant tout le reste. Oui, le design est important, mais sans une navigation efficace, votre site n’atteindra pas ses objectifs.

Construire l’arborescence de votre site permet justement d’avoir une bonne navigation.

Aussi joli soit-il, si un site n’offre pas une bonne navigation, ses visiteurs iront voir ailleurs. Gardez ça en tête lors de la construction de votre site web et son arborescence.

Comprendre le parcours de vos utilisateurs

Pour construire cette navigation, il importe de comprendre le parcours que vos visiteurs vont suivre et de savoir comment ils vont interagir avec votre site web.

Par exemple, si un utilisateur recherche des informations sur un produit, pourra-t-il facilement y accéder ?

Et une fois cette information consommée, pourra-t-il rapidement passer à l’achat et/ou vous demander des informations complémentaires pour en savoir plus ?

Je pense qu’il est aussi important de savoir d’où proviennent vos utilisateurs et de comprendre ce qu’ils cherchent à obtenir sur votre site Internet.

Par exemple, si vous faites de la publicité sur Facebook pour faire la promotion de vos produits, sur quelle page web de votre site Internet arrivent-ils après avoir cliqué sur votre pub ?

À contrario, s’ils arrivent sur votre blog après avoir fait une recherche bien précise sur Google, quelle est la page web que vous cherchez à mettre en avant ?

Cela implique de comprendre l’intention qui se cache derrière cette recherche :

  • Si l’intention d’achat est élevée, il sera plus important de mettre en avant une page de vente.
  • À contrario, si la recherche est plus informationnelle, c’est votre blog qui devrait apparaître, pour ensuite rediriger le visiteur vers vos pages de vente.

En bref, il y a trois points à garder en tête quand vous construisez une arborescence de site web pour faciliter la navigation de vos utilisateurs :

  • D’où viennent-ils ? De quel canal d’acquisition arrivent-ils ?
  • Que cherchent-ils à faire sur votre site web ?
  • Comment pouvez-vous les aider à y parvenir le plus facilement possible ?

 Une fois votre site internet en ligne, ces efforts de simplification doivent continuer. Essayez d’étudier le comportement de vos utilisateurs pour comprendre ce qu’ils font une fois arrivés sur votre site internet, pour ensuite améliorer l’expérience que vous leur proposez.

Vous pouvez recourir à des outils comme Google Analytics pour voir d’où viennent vos utilisateurs, voir le temps qu’ils passent sur votre site web, ou encore surveiller vos conversions.

D’autres outils comme Hotjar vous permettent de voir quelles sont les zones de votre site internet où les internautes passent le plus de temps.

En bref : choisissez les bons outils et améliorez constamment votre navigation.

N’hésitez pas à vous faire conseiller par une agence de Web Analytics pour mieux mesurer l’impact de votre site web.

Choisir votre dispositif de navigation

Pour mettre en place votre arborescence de site, et l’améliorer en permanence, vous pouvez utiliser plusieurs supports :

  • Un menu de navigation principal, qui se trouve en haut du site.
  • Un menu de navigation secondaire, qui vient approfondir le principal et qui apparaît au survol de la souris.
  • Le moteur de recherche interne, qui permet à vos visiteurs d’effectuer des recherches bien précises pour trouver l’information qu’ils veulent.
  • Un pied de page, qui présente des accès rapides aux grandes rubriques de votre site.

L’objectif est de pouvoir construire une arborescence de site web suffisamment bien pensée pour donner naissance à une navigation efficace, peu importe la situation et le besoin du visiteur.

L’arborescence pour optimiser votre référencement naturel

La profondeur de vos pages

La structure que vous allez donner à votre site web aura un impact sur votre référencement.

Google va analyser les liens qui existent entre les pages de votre site pour comprendre sa structure générale et son maillage interne. Cela va lui permettre de déterminer les pages qui ont le plus d’importance.

Ainsi, plus une page est « profonde », au moins elle sera prise en compte et au moins elle sera mise en avant.

Pour cette raison, il est recommandé de ne pas dépasser les trois niveaux de hiérarchie quand vous construirez une arborescence de site web.

arborescence du site de sortlist

Le maillage de vos pages

Mais au-delà de la profondeur de vos pages, que vous devez prendre en compte dans l’élaboration d’une arborescence, il faut aussi penser aux liens que vous allez construire entre vos pages.

Autrement dit, comment allez vous organiser votre contenu pour rapprocher les pages qui appartiennent aux mêmes sujets.

On parle alors de maillage interne et de construction en silo : toutes les pages reprises dans une catégorie parlent du même sujet et relèvent du même champ sémantique.

Pour que Google comprenne bien la structure de votre site, il importe de bien distinguer chacune des catégories d’une arborescence. En plus de regrouper les pages dans des catégories bien précises.

Ces questions de maillage interne constituent un sujet entier à elles seules, mais voici trois choses à garder à en tête :

  • Plus une page sera en surface de votre plan de site, au mieux elle sera référencée.
  • Plus une page est mise en avant, et reçoit des liens venant d’autres pages de votre site, au mieux elle sera référencée.
  • Au plus une page reçoit des liens de pages qui relèvent du même sujet, au mieux elle sera référencée.

arborescence du site de sortlist

Aussi, n’oubliez pas que tous les liens ne sont pas égaux. Un lien issu de votre menu principal aura plus de puissance qu’un lien issu de votre pied de page. 

On sait maintenant à quoi sert une arborescence :

  • Vous fournir un plan de site et une vision claire de la structure de votre site.
  • Optimiser la navigation de vos visiteurs et vous aider à atteindre vos objectifs.
  • Améliorer votre référencement et augmenter votre trafic.

Mais comment faire concrètement ? Au-delà de savoir à quoi ça sert, comment construire une arborescence ?

Comment construire l’arborescence de votre site web ?

Lister l’ensemble de vos contenus

La première étape, c’est de lister tous les éléments et tout le contenu que vous voulez mettre sur votre site web. Ce n’est pas encore le moment de raisonner en termes de pages, mais plutôt en termes d’idées, de sujets, et de contenu.

Soyez aussi exhaustif que possible, l’organisation de votre contenu suivra.

L’idée ici est de classer les grands sujets qui seront présentés sur votre site Internet, par exemple :

  • Vos produits et vos services : avantages, domaines d’expertises, solutions proposées, etc.
  • Votre blog et son contenu : rubriques, catégories, etc.
  • Votre histoire : à propos, coordonnées de contact, mentions légales, etc.

Première étape : faites l’inventaire de tout le contenu que vous voulez mettre en ligne. 

Comprendre vos concurrents

Inutile de chercher à ré-inventer la roue. Regardez ce que font vos concurrents, analysez les structures qu’ils ont donné à leurs sites web, le contenu qu’ils y publient, essayez de voir à quel point ces structures sont efficaces et faciles à naviguer, pour ensuite vous en inspirer.

Analyser vos concurrents vous permettra non seulement d’éviter certaines erreurs, et donc de gagner du temps, mais aussi de comprendre quels sont leurs points faibles pour construire une structure plus efficace.

Pour y parvenir, et faire ce reverse-engineering, vous pouvez bien évidemment vous rendre sur les sites web de vos concurrents et les découvrir à votre aise, mais vous pouvez aussi recourir à des outils comme Screaming Frog ou encore Ahrefs et SimilarWeb.

Ces outils permettent notamment de faire des analyses de contenu.

Deuxième étape : Reverse-Engineer vos concurrents qui ont du succès.

Organiser votre contenu

Vous avez fait la liste de vos différents contenus, vous avez analysé vos concurrents, il est maintenant temps de faire votre hiérarchie.

Pour y parvenir, organisez votre contenu en différents niveaux. Commencez par le niveau un, qui reprendra votre page d’accueil et vos principales rubriques, pour ensuite descendre vers le niveau trois.

Comme dit précédemment, tâchez d’organiser votre contenu en fonction de vos différents champs sémantiques (pour optimiser votre référencement), tout en gardant vos visiteurs à l’esprit (pour optimiser l’expérience utilisateur).

Concrètement : organisez votre contenu pour leur faciliter l’accès à celui-ci.

Troisième étape : organisez votre contenu.

Mettre votre arborescence sur papier

Il est temps de concrétiser votre arborescence et de la mettre en forme.

Deux possibilités :

  • La mettre sur papier.
  • Utiliser un logiciel (MindMeister et PowerPoint feront très bien l’affaire).

Peu importe l’option que vous choisirez, le principal étant que vous vous sentiez à l’aise avec celle-ci et qu’elle vous permette de bien visualiser la structure de votre site web.

Quatrième étape : mettez votre schéma d’arborescence de site sur papier.

Tester votre arborescence

Avant de vraiment construire votre site web, n’oubliez pas de tester votre arborescence en la confrontant à la réalité.

L’ enjeu est tester sa résilience, et voir si votre arborescence est vraiment efficace. Vous pouvez imaginer plusieurs scénarios et voir quelle serait la navigation qui se ferait sur votre site pour chacun d’entre eux. Quelle est l’arborescence du site qui propose la meilleure ergonomie ?

Plusieurs éléments doivent être pris en compte pour construire un scénario :

  • Profil du visiteur : Âge, sexe, etc.
  • Canal d’acquisition : D’où provient-il ?
  • Objectif : Pourquoi vient-il sur votre site ?
  • Landing Page : Sur quelle page arrive-t-il ? Et est-ce la bonne page pour l’aider à atteindre son objectif ?

Construisez plusieurs scénarios, et tâchez de voir le parcours que le visiteur suivrait en fonction de chaque scénario.

Mais comme nous l’avons vu, il ne faut pas uniquement construire une arborescence pour l’expérience utilisateur, il faut aussi prendre en compte votre référencement naturel.

Ainsi, avez-vous pris en compte la façon dont Google comprendra votre site web et sa mise en forme ?

Vos pages principales sont-elles bien au premier niveau de votre site internet ? Vos catégories, et les pages qu’elles reprennent, forment-elles des champs sémantiques logiques ?

Cette dernière phase est donc cruciale pour bien valider l’arborescence du site que vous avez construit, et ce avant de commencer à la concrétiser en mettant en ligne votre site web.

Voyez cette arborescence comme le plan d’une maison : il est très facile de modifier l’emplacement d’un interrupteur sur un plan, avant que la maison ne soit construite.

En revanche, une fois votre maison construite, déplacer un interrupteur parce que vous vous serez rendu compte qu’il n’est pas placé à un endroit optimal du plan vous coûtera beaucoup plus cher que si vous aviez bien pris le temps de ré-étudier votre plan avant la construction.

Dernière étape : testez votre arborescence avant de l’implémenter. 

Conclusion

Une fois votre arborescence validée, il sera ensuite nécessaire de la traduire et de créer votre site web ou de faire sa refonte.

Pour cela, je ne peux que vous conseiller de vous entourer et de collaborer avec une agence spécialisée en développement web.