Créer l'arborescence, le menu, de votre site

Autre étape importante dans la réalisation du site, la création de l'arborescence, reflétée par le ou les menus du site, permet au visiteur de se faire une représentation de l'endroit où il se situe sur le site et les différents chemins qu'il peut emprunter pour trouver l'information.

Trouver la bonne arborescence n'est pas aisé car elle détermine une bonne partie de la disposition des différents éléments du site dans la page (menu, sous-menus, fil d'ariane...). Dans le même temps, celle-ci peut être amené à changer en fonction de l'évolution du site. L'art de créer une bonne arborescence consiste donc en la prévision de l'évolution future du site pour ne pas avoir à réintégrer tout ou partie du design par la suite.

Comme énoncé plus haut, la menu est directement impacté par le type d'arborescence choisi qui lui est fonction du nombre de pages et donc du contenu du site. Nous allons donc énoncer les différents types d'arborescences fréquemment rencontrés.

Arborescence plate ou menu simple

Ce type d'arborescence est réservé aux sites vitrines qui ne contiennent pas énormément de pages. En deçà de 5-6 pages, il est possible de créer un menu de type "Onglet" ou horizontal (comme pour Savaux Elec par exemple). Sinon, le menu devra être horizontal (comme sur Dog Elegance).

L'avantage est qu'en un seul regard, le visiteur peut connaître le contenu qui lui est proposé. L'inconvénient majeur est que c'est un type de menu difficilement évolutif sans faire de profondes modifications.

Arborescence à plusieurs niveaux

Les arborescences à plusieurs niveaux permettent de classer un grand nombre de page dans des sections principales. Ainsi, le lecteur peut, malgré la complexité du site et le nombre d'informations présentes sur ce dernier, s'orienter facilement.

Dans le cas d'une arborescence de 1 à 2 niveaux, l'usage est de créer un menu horizontal déroulant comme sur le site de Publigraphie. L'avantage est que le menu ne prend pas une grande place dans la présentation du site. L'inconvénient majeur est que les niveaux n+1 ne sont pas visibles directement et qu'il faut aller les chercher pour savoir ce qu'ils contiennent. Néanmoins, ce manque est comblé par la clarté des intitulés des pages de premier niveaux et la logique de l'arborescence. Malheureusement, c'est plus facile à dire qu'à faire et cela demande que le projet soit arrivé à maturité pour en juger.

Il est également possible de placer le menu principal et un ou plusieurs sous-menus à des endroits différents comme sur le site d'Alterbrio. Cependant, méfiez-vous de ce type d'organisation car le lecteur peut ne pas le voir s'il est mal placé ou mis en valeur.

Pour des arborescences à niveaux supérieur à 2, l'idéal est de représenter l'arborescence de manière vertical, soit au complet, soit en masquant une partie de cette dernière. Ce type d'arborescence doit être évité au maximum. Seulement, sur certains sites institutionnels ou corporate, il peuvent être la seule solution. Petit conseil : pensez également à la possibilité de créer plusieurs site différents.

Il existe aussi le modèle des onglets à niveaux sortes de menu horizontaux superposés. Ces derniers sont bien pratique dans certains cas, mais nécessitent des rechargement de page pour passer d'un niveaux à l'autre. En fonction du type d'informations, cela peut être gênant ou non.

Site à arborescences multiples

Il arrive que sur certains sites plusieurs organisations logiques de pages forment des arborescences hermétique bien distinctes. Ne cherchez pas forcément à les regrouper. Le fait de les distinguer sur le site permettra au visiteur de bien comprendre cela et de mieux exploiter le contenu du site.

Les pages satellites

C'est, le joker de l'organisation d'un site. Les pages qui ne rentrent dans aucune logique et sont là pour respecter des obligations légales (mentions légales, cgv, crédits etc...). Il est important de les énumérer à cette étape, mais elle ne sont pas comprises dans l'arborescence, c'est pourquoi vous devez en faire une liste également.

A savoir que ces pages peuvent parfois revêtir un aspect important. Dans ce cas, n'hésitez pas à leur réserver une place de choix en dehors du menu dans la mise en page de votre site, prochaine étape de ce guide.

Derniers sites créés

Guy Vernez

Guy VernezLe site de présentation de Guy Vernez, coach de vie professionnel nous a été confié. Suite

Actualité

Performance améliorée

Nous avons profité d'un changement de serveur web pour améliorer une fois encore la performance de nos hébergements. Suite

A propos

Nous avons créé l'agence Elitwork en 2006 au coeur du Nord-Pas-de-Calais dans le triangle Arras - Cambrai - Douai. Depuis, nous forgeons notre savoir-faire au jour le jour afin rester experts du web et des technologies d'Internet en général.
Spécialisés dans la créations de sites Internet et le développement d'application/progiciels web sur mesure, nous permettons à nos clients de réussir leur transition vers un système d'information connecté. En savoir plus

Actu de l'agence

Orange HTML5 Hackathon

Orange HTML5 HackathonNicolas Froidure, le développeur d'Elitwork a remporté avec son équipe le grand prix du jury du concours de hacking Orange HTML5 Hackathon. Découvrez cette folle journée ! Suite

Nous contacter

Elitwork SARL
10, rue Antoine DEQUEANT
62860 Oisy le Verger
Tél. : 03 21 59 62 24
E-mail