Conception sites web

Comment créer une arborescence de site Web : le guide complet

14 juin 2023 Maxence Pezzetta
|arborescence site web|arborescence site web|impact arborescence site web sur seo|arborescence site web sitelink|fil d'ariane site web|menu secondaire site web|sous menu boutique en ligne|arborescence site web|exemple menu prinicpal boutique en ligne|URL et arborescence|maillage interne site web|structure site web|mots-clés arborescence site web

De nombreux critères doivent être remplis lors de la refonte ou lors de la conception de votre site web. L’un de ces critères est l’arborescence. Cet élément est prépondérant, car il détermine à la fois la structure, mais également le côté visuel du site.

L’arborescence est donc un aspect non négligeable de votre plateforme, mais encore faut-il savoir comment la créer.

Dans cet article, les professionnels de notre agence Web My Little Big Web vous présentent l’importance de l’arborescence d’un site Web ainsi que les différents éléments à intégrer dans cette structure.

Sommaire

1. Définition : qu’est-ce que l’arborescence d’un site ?

L'arborescence est la colonne vertébrale de votre site Web. Elle représente sa structure et la façon dont les informations sont distribuées sur différentes pages. Pour être facilement détectée par les moteurs de recherche et augmenter vos chances d'être bien référencé, cette structure doit suivre certaines bonnes pratiques.

Une arborescence bien conçue rend la navigation plus intuitive pour les utilisateurs, leur permettant de trouver rapidement ce qu'ils cherchent. De plus, elle facilite l'analyse de votre site par les moteurs de recherche, ce qui permet une indexation adéquate des pages et peut améliorer le référencement naturel (SEO) de votre site.

Voilà un exemple typique d’arborescence pour un site Web de restaurant :

arborescence site web

2. Pourquoi l’arborescence de votre site Web est importante ?

2.1. L’impact de l’arborescence de votre site Web sur l’expérience utilisateur

L’arborescence d’un site Web a un large impact sur l’expérience utilisateur. Personne n'aime naviguer sur un site Web sans aucune structure et avoir du mal à trouver les informations souhaitées.

Que vous proposiez des milliers de produits ou que vous ayez un site vitrine avec seulement 4 sections différentes, vous devez avoir une structure claire et concise. Idéalement, une arborescence optimisée devrait être définie dès la conception de votre site Web (mais pas obligatoire).

L'objectif de votre arborescence doit être de faciliter la navigation des utilisateurs, en leur proposant un parcours intuitif et rapide pour accéder aux informations. Une navigation difficile peut nuire à votre SEO.

2.2. L’impact de l’arborescence de votre site Web sur le SEO

De nombreuses statistiques SEO soulignent l'importance de ne pas négliger l'arborescence de votre site, car elle a un impact majeur sur la performance du SEO. Une bonne structure peut améliorer votre positionnement sur les moteurs de recherche.

Pour que votre site soit attrayant pour Google, sa structure doit être logique, de sorte que les utilisateurs puissent trouver facilement les informations qu'ils cherchent. Une arborescence claire peut réduire le taux de rebond et augmenter le temps de visite, contribuant ainsi à améliorer votre positionnement.

impact arborescence site web sur seo

2.2.1. L’indexation de vos pages

Les robots des moteurs de recherche parcourent la structure de votre site pour indexer vos pages. Une arborescence claire et logique facilite la compréhension de votre contenu par les moteurs de recherche, améliorant ainsi son indexation.

Tout cela se passera lors du crawl. Google va venir analyser chacune de vos pages afin de les indexer, c’est-à-dire de les référencer.

Une arborescence claire aide Google à crawler plus facilement vos pages Web, ce qui permet de les indexer. Notez que seules les pages indexées peuvent apparaître dans les résultats de recherche.

Créer une bonne arborescence peut également aider à générer des "sitelinks". Ces liens, qui apparaissent sur la page de résultats du moteur de recherche, peuvent augmenter votre visibilité et améliorer votre taux de clics. Ainsi, grâce aux sitelinks, votre site gagne en visibilité dans les résultats de recherche.

arborescence site web sitelink

3. Comment définir l'arborescence d'un site Web?

3.1. Les pages principales d’une arborescence

Dans l’arborescence de votre site Web, vous allez intégrer vos pages principales, c’est-à-dire, les pages les plus importantes qui vont permettre au visiteur de se convertir en client. L’idée va être d’exposer vos produits ou vos services de manière à ce que l’internaute et les moteurs de recherche comprennent facilement ce que vous offrez.

Si vous êtes le propriétaire d’un site de e-commerce, par exemple, voici, une suggestion des pages que vous pourriez mettre dans cette arborescence.

Gardez en tête qu'un site e-commerce a pour but de vendre des produits ou services en ligne. L'arborescence de ces sites est généralement plus complexe, en raison du nombre plus élevé de pages (pour chaque produit) et de la nécessité d'inclure des fonctionnalités telles que le panier, le compte utilisateur, etc.

L'arborescence pourrait ressembler à ceci :

  • Accueil
  • Catégories de produits
    • Sous-catégorie 1
      • Produit 1
      • Produit 2
    • Sous-catégorie 2
      • Produit 3
      • Produit 4
  • À propos
  • Blog
    • Article 1
    • Article 2
  • Contact
  • Mon compte
  • Panier

Ici, les sections sont orientées vers la présentation de produits et la facilitation des transactions en ligne.

exemple menu prinicpal boutique en ligne

Si vous êtes propriétaire d’un site de services, rappelez vous que le site vitrine a pour principal objectif de présenter une entreprise, ses produits ou ses services, sans nécessairement proposer une fonctionnalité d'achat en ligne. Voici une suggestion des pages qui pourraient apparaître dans votre arborescence :

  • Accueil
  • À propos
  • Nos services
    • Service 1
    • Service 2
  • Nos réalisations
    • Réalisation 1
    • Réalisation 2
  • Blog
    • Article 1
    • Article 2
  • Contact
arborescence site web

Il n’y a pas d’arborescence par excellence, mais c’est sûr que ces deux exemples-là sont des modèles utilisés par le plus grand nombre.

3.2. Les niveaux de votre arborescence

L’arborescence d’un menu peut se faire sur plusieurs niveaux. C’est-à-dire, que vous pouvez intégrer des sous-menus. Cela va apporter davantage de détails à votre arborescence et donc de permettre à la fois aux internautes et aux moteurs de recherche de comprendre encore plus précisément quels sont les services ou les produits que vous proposez.

Si nous reprenons l’exemple du site de vêtements, voici les pages qui pourraient apparaître dans le sous-menu de « vêtements femme » :

  • Pulls,
  • Pantalons,
  • Robes,
  • Accessoires, etc.
sous menu boutique en ligne

Pour un site de e-commerce, vous allez aussi devoir faire apparaître le panier du client dans votre menu principal ou votre sous-menu.

Toujours dans le cas d'un site marchand, il est conseiller d'intégrer dans votre menu principal ou secondaire votre page de contact et votre page « à propos ». Cela prouve à vos visiteurs que vous êtes un site sérieux qu'on peut contacter en cas de problème.

Sur certains sites, vous pouvez distinguer un menu principal et un menu secondaire, à ne pas confondre avec un sous-menu.

Vous allez intégrer vos informations les plus importantes dans le menu principal, car celui-ci est toujours visible sur votre page Web, même quand l’utilisateur visualise le bas de la page. C’est ce qu’on appelle un « sticky menu ». Par exemple, pour un site e-commerce, vous allez faire apparaître les différentes catégories de produits que vous proposez.

Tandis que le menu secondaire est visible seulement quand l’internaute visualise le haut de la page. Dans ce menu, vous pouvez intégrer des pages qui sont moins importantes comme votre page carrière, par exemple.

menu secondaire site web

Sachez que ce n’est pas parce que le menu secondaire se différencie du menu principal par sa visibilité, qu’il va être moins accessible par les moteurs de recherche.

Google accède à une page en cliquant sur un lien, à partir du moment où vos pages du menu secondaire sont accessibles pour l’internaute, elles seront accessibles pour les moteurs de recherche également.

C’est d’ailleurs l’objectif de ce menu secondaire, vous voulez que Google parcoure ces pages, mais vous ne voulez pas forcément le faire apparaître en tout temps pour ne pas submerger le visiteur d’informations.

3.4. Le fil d’ariane de votre site Web

Le fil d’ariane de votre site Web est lui aussi un élément important. Ce dernier correspond au chemin de navigation.

fil d'ariane site web

Le fil d’ariane permet aux internautes de retourner sur les pages précédentes ou sur la catégorie initiale en un seul clic. Le fil d’ariane est directement relié à l’arborescence du site Web. Si cette dernière n’est pas claire, votre fil d'ariane ne le sera pas non plus et l'internaute risque de se perdre.

Le fil d'ariane est très utile quand votre contenu est très profond c'est-à-dire qu'il faut plusieurs clics pour y accéder. Plus un contenu nécessite de clics pour être consulté, plus il sera profond. Le fil d'ariane permet de savoir où on se situe et surtout, comment revenir à l'étape précédente.

4. Les étapes de création d’une arborescence optimisée SEO

agence seo consultation

4.1. La recherche de mots-clés

La première étape de la création de votre arborescence consiste à recenser les mots-clés reliés à votre entreprise. Le vocabulaire choisi pour votre arborescence doit être très simple, mais doit correspondre exactement aux services que vous proposez, tout en étant favorable pour votre SEO.

Vos mots-clés doivent avoir du sens et ils doivent être choisis de manière stratégique. N'hésitez pas à faire cette recherche de mots clés au début du processus de création de site Web et même avant de choisir votre nom de domaine. Qui sait? Ça pourrait vous inspirer. Mais pas de panique si votre mot clé visé n'apparait pas dans votre nom de domaine, l'impact SEO est très négligeable.

4.2. Lister le contenu de votre site Web et les pages les plus importantes selon vous

4.2.1 Posez-vous les bonnes questions

Lors de la réalisation de la structure du site, votre réflexion doit d’abord porter sur 2 questions:

  • À qui le contenu s’adresse-t-il ?

Vous devez identifier clairement qui seront vos utilisateurs et quelles seront leurs caractéristiques. Pour ce faire, il est conseillé de réaliser des fiches représentant un ou plusieurs utilisateurs types censés refléter la grande majorité des utilisateurs, des Buyer Personas. Ces fiches récapitulent un certain nombre d’informations telles que le sexe, l’âge, la situation professionnelle, géographique, etc.

Ces fiches sont supposées vous permettre de mieux déterminer la structure générale du site en fonction des personnes que vous souhaitez atteindre.

  • À quels besoins répondent mes produits/services ?

Il est nécessaire d’identifier clairement les problèmes ou questions auxquels pourraient être confrontés les utilisateurs. Cela permet, par la suite, de hiérarchiser le contenu en fonction de son importance et de le proposer de manière à offrir l’expérience utilisateur la plus complète.

L’analyse doit porter essentiellement sur les offres, les catégories, le catalogue et les « À Propos » (Conditions Générales de Vente, Foire aux Questions etc.).

4.2.2. Hiérarchisez votre contenu

Une erreur souvent commise est de s’intéresser à l’arborescence après avoir créé le site. Il est pourtant nécessaire d’étudier la manière dont votre site va être organisé au préalable. Pour ce faire, il vous est possible d’utiliser des logiciels tableurs comme Excel, mais également des logiciels graphiques comme Photoshop.

Peu importe le support tant que la hiérarchisation est faite de manière logique, précise et concise.

La hiérarchie est, la plupart du temps, organisée selon le modèle suivant ;

structure site web

(crédit photo: moz.com)

Ce type de hiérarchie ne s’applique pas à tous les sites dont certains appliquent le modèle horizontal. L’architecture que vous réalisez dépend à la fois de vos goûts, mais également de la taille et du nombre de pages de votre site.

4.3. Étudiez la concurrence

Il est aussi intéressant de se renseigner sur la manière dont vos concurrents ont organisé leur site internet. Cela permet d’avoir une idée de cohérence entre le type d’offre/service proposé et la manière dont le site est agencé.

Si vous proposez les mêmes services que vos concurrents, identifiez clairement leur arborescence. Cela vous permettra d’avoir une vision globale sur leur stratégie.

5. Sur quoi porter votre attention lors de la conception de l’arborescence ?

5.1. Le maillage interne

Le maillage interne représente la manière dont sont liées les pages entre elles. Deux éléments importants sont à retenir:

  • lier toutes les pages entre elles pour permettre d’accéder à n’importe quelle page depuis n’importe quelle page.
  • ne pas enfermer les utilisateurs: ce qu’on appelle les « culs-de-sac » ou, autrement dit, des pages sans possibilité de retour direct ou d’accès à certaines pages font augmenter le taux de rebond et donnent une image négative de votre site considéré comme non fonctionnel par les utilisateurs.

En vous concentrant sur un maillage interne solide, vous permettez aux internautes d’avoir une expérience de navigation agréable. Et mentionnons le encore, une expérience utilisateur agréable améliora votre SEO.

maillage interne site web

5.2. La profondeur des pages

Comme nous l'avons déjà évoqué, la profondeur d’une page Web correspond au nombre de clics nécessaire pour arriver d’une page à la page d’accueil. Plus il y a de clics, plus votre site Web est considéré comme profond. Et c’est bien là le problème.

Si votre site Web est trop profond, c’est qu’il y a un problème dans l’architecture de votre site Web, il a donc trop de pages et l’arborescence n’a pas été optimisée. En ayant un site Web trop profond, les internautes vont se perdre sur votre site Web et rappelons-le encore une dernière fois : une bonne arborescence entraine une expérience utilisateur agréable ce qui améliora votre SEO.

5.3. Les URLS

Lors de la création de votre site et de sa structure, il est indispensable de faire attention à la manière dont vos URLs vont être définies. La cohérence entre ces dernières a un impact à la fois sur la navigation, mais également sur le référencement naturel (SEO) des pages.

Certains choisiront d’avoir des URLS retraçant le chemin de navigation, d’autres resteront dans la simplicité en utilisant des URLS directs.

Par exemple, une URL peut suivre le menu d’un site Web reprenons l’exemple des sites de prêt-à-porter, une URL comme cela pourrait être choisie :

NOMDELAMARQUE.com/vetements-femmes/jupes/jupes-fleurs/

URL et arborescence

Ou la simplicité pourrait être choisie avec l’URL suivante :

NOMDELAMARQUE.com/jupes-fleurs/

Peu importe que vous choisissiez la simplicité ou non, vos URLS doivent être optimisées.

6. Quels logiciels utiliser pour créer une arborescence de site Web ?

Lorsqu'il s'agit de choisir les bons outils pour créer votre arborescence, il est important de prendre en compte vos besoins spécifiques et vos préférences personnelles. Voici quelques logiciels couramment utilisés qui peuvent vous être utiles :

6.1. LucidChart

Lucidchart est un outil de création de diagrammes en ligne qui peut être utilisé pour concevoir et visualiser l'arborescence de votre site. Avec Lucidchart, vous pouvez créer des diagrammes hiérarchiques, des organigrammes et d'autres types de schémas pour représenter la structure de votre site.

Vous pouvez facilement organiser et relier les formes pour représenter la structure hiérarchique de votre site. Les fonctionnalités de glisser-déposer et d'alignement automatique vous permettent de positionner les éléments de manière précise et esthétique.

Lucidchart offre également des fonctionnalités de collaboration en temps réel, ce qui signifie que vous pouvez travailler en équipe sur l'arborescence de votre site. Vous pouvez inviter d'autres membres de votre équipe à modifier et à commenter le diagramme, facilitant ainsi la coordination et le partage des idées.

6.2. Mindmeister

MindMeister est un outil en ligne de mind mapping, également connu sous le nom de carte mentale, qui peut être utilisé pour créer et organiser visuellement des idées, des informations et des structures telles que l'arborescence d'un site Web.

Lorsque vous utilisez MindMeister, vous pouvez commencer par créer une carte mentale en ajoutant un nœud central représentant votre thème principal, comme l'arborescence de votre site Web. À partir de ce nœud central, vous pouvez créer des branches qui se connectent aux sous-thèmes et aux pages spécifiques de votre site.

Vous pouvez ajouter des nœuds supplémentaires à chaque branche pour représenter les différentes pages et sections de votre site web. Les nœuds peuvent être déplacés, redimensionnés et reliés les uns aux autres pour représenter les relations hiérarchiques et les liens entre les pages.

MindMeister offre également des fonctionnalités pour personnaliser votre carte mentale. Vous pouvez utiliser différentes couleurs, icônes et styles de police pour rendre votre arborescence plus visuellement attrayante et facile à comprendre.

6.3. Gloomaps

Gloomaps, un outil Web gratuit et facile d'utilisations spécifiquement conçu pour vous aider à concevoir l'arborescence de votre site internet de manière claire et intuitive. L'outil offre une interface conviviale et simplifiée pour créer et organiser votre arborescence.

Gloomaps propose des fonctionnalités de personnalisation pour vous permettre de différencier visuellement les différents niveaux de l'arborescence. Vous pouvez utiliser des couleurs, des icônes et des étiquettes pour représenter les différentes catégories, les pages principales et les sous-pages.

Cet outil permet également de créer des liens entre les différents nœuds pour illustrer les relations et les chemins de navigation entre les pages. Vous pouvez définir des liens pour indiquer les connexions et les transitions entre les différentes parties de votre site.

Une fois que votre arborescence est complète, vous pouvez exporter le projet dans différents formats, tels que PDF, PNG ou XML, pour une utilisation ultérieure. Cela facilite l'intégration de l'arborescence dans d'autres outils de conception web ou de présentation.

6.4. Dyno mapper

Dyno Mapper vous permet de cartographier et de planifier l'arborescence de votre site web de manière visuelle et interactive. Pour commencer, vous pouvez entrer l'URL de votre site dans l'outil. Dyno Mapper explorera ensuite votre site pour collecter les informations et générer une représentation graphique de son arborescence.

Une fois que l'arborescence est générée, vous pouvez visualiser la structure de votre site sous forme de diagramme interactif. Vous pouvez naviguer dans l'arborescence en cliquant sur les différents nœuds pour afficher les pages spécifiques et les relations entre elles.

L’arborescence de votre site Web, au cœur de la conception de votre site Web

L’élaboration de l’arborescence est le fruit d’une mûre réflexion sur l’ergonomie générale et l’organisation interne de votre site internet. Il est indispensable de le réaliser en ayant à l’esprit d’améliorer principalement l’expérience utilisateur, mais également le design de votre site.

Tous ces éléments permettent d’améliorer le référencement de votre site et de toucher votre cible plus facilement.

Le meilleur moment pour développer cette arborescence est bien évidemment avant la création de votre site Web, mais vous pouvez toujours la réorganiser si vous décidez de travailler sur une refonte de site Web.

N’hésitez pas à nous contacter au 514 572 7758 ou via notre formulaire de contact si vous souhaitez parler à un conseiller qui répondra à toutes vos question

Maxence Pezzetta
Cofondateur et Spécialiste Web Marketing et acquisition de clients Diplômé d’une double Maîtrise en Marketing et Communication, Max cumule plus de 10 ans d’expérience en Marketing digital. Ancien employé de Microsoft, sa mission est de « mettre le Web à la portée de tous » pour aider les entreprises à améliorer leur présence en ligne.
Envoyer un message
Soumission gratuite

Plus de lecture

Conception sites web Les différents types de site Web

Quels sont les différents types de sites Web ?

Conception sites web

Shopify vs WordPress : lequel choisir ?

Conception sites web page d'accueil

Comment créer une page d’accueil attractive ?

Conception sites web Site Web écoresponsable

Site web éco-responsable : qu’est-ce que c’est ?

Conception sites web Création de site Web pour dentiste

Création de site Web pour dentiste

Conception sites web |

Blogue et site internet : quelles sont les principales différences ?

Youpi!
Scroll top