Arborescence : 8 règles pour en récolter les meilleurs fruits

Sur un site, une organisation arborescente de l’information est la plupart du temps indispensable. Elle facilite le repérage de l’utilisateur et accompagne sa découverte des contenus. Mais sa mise en place pose toujours question. Pour combien de rubriques opter ? Quelle profondeur maximale viser ? Comment optimiser l’accès aux derniers niveaux ?

La plupart des architectures de l'information reposent ce que les spécialistes du domaine nomment des taxonomies. Hérité de la biologie, ce terme désigne une méthode de classification hiérarchique des informations. On en rencontre partout : un livre est divisé en chapitres, sections, paragraphes, phrases et mots ; un supermarché en rayons, familles de produits, marques et références...

Sur un site Web, on parlera plus volontiers d'arborescence. Avec ses niveaux liés entre eux par des ramifications, elle rappelle en effet la structure d'un arbre.

Insérer Schéma Arbo 1

En dépit de son caractère peu flexible, l'arborescence présente quatre avantages majeurs pour l'utilisateur :

  • L'information est distribuée selon une logique familière, plutôt qu'en un seul bloc indigeste.
  • La découverte progressive des contenus est accompagnée : la page d'accueil propose des contenus génériques, les pages de niveau 2 des contenus plus précis, et la spécificité augmente au fur et à mesure de la progression dans l'arborescence.
  • La structure est adaptée à n'importe quel niveau de détail souhaité : si un thème doit être traité dans le détail, il est toujours possible d'ajouter un niveau inférieur constitué d'un ensemble de pages plus spécifiques.
  • La contextualisation est favorisée : chaque élément "parent" participe à la définition des éléments de niveau inférieur.

Les multiples atouts de l'arborescence expliquent sans doute qu'à ce jour, la quasi-totalité des sites n'a pas trouvé meilleur système d'organisation. D'autant qu'en matière de référencement, une organisation arborescente des contenus épouse aussi la progressivité des besoins exprimés par les requêtes des internautes. Ainsi :

  • L'internaute encore peu mature sur son besoin saisira par exemple "acheter caméscope" dans un moteur de recherche. Et effectivement il gagnera à atterrir au niveau de la catégorie "caméscopes" de l'arborescence.
  • L'utilisateur qui sait quel type de produit il recherche mais souhaite en comparer plusieurs saisira plutôt "caméscope Mini-DV". Et il gagnera à atterrir dans la sous-famille éponyme de l'arborescence.
  • Enfin, le prospect qui a identifié le produit qu'il souhaite saisira quant à lui une requête de type "caméscope Mini-DV Samsung VP371". Et gagnera à atterrir directement sur la fiche-produit située au dernier niveau de l'arborescence.

1. Concevoir l'arborescence comme un arbre généalogique

Comme toute organisation hiérarchique, une arborescence doit reposer sur des relations de type "parent-enfant". A l'image d'un arbre généalogique, une rubrique "mère" contient des sous-rubriques "filles." La sous-rubrique peut vivre indépendamment de la rubrique à laquelle elle se rattache, tout en comportant des caractéristiques de cette dernière.

Intégrer Schéma Arbo 2

La construction d'une arborescence selon cette démarche revient finalement à respecter la logique de la pyramide inversée. D'un niveau très global, on passe à un niveau spécifique que l'on traite de plus en plus en profondeur. Le tout, dans une logique descendante.

2. Homogénéiser la granularité des rubriques de même niveau

L'analogie avec l'arbre généalogique convient aussi pour les rubriques situées à un même niveau dans l'arborescence. Entre elles, ces catégories "sœurs" doivent de préférence avoir un degré de spécificité équivalent. Ainsi, à la vue de 2 ou 3 rubriques, un utilisateur est en mesure d'anticiper sur celles qui vont suivre. Dans le cas contraire, il sera dérouté au moment de s'orienter.

Par exemple :

Une rubrique intitulée offres d'emploi ne devra pas donner à la fois accès à une sous-rubrique intitulée direction d'une part et à 3 autres nommées communication, marketing, R&D d'autre part. Tandis que la première relève d'une catégorie transverse, les trois suivantes sont plus spécifiques. Du coup, où irait un candidat en quête d'un poste de directeur de la communication ? Il hésiterait entre direction et communication. Il convient donc de supprimer la rubrique direction et de ventiler ses offres dans les 3 autres rubriques.

Whirlpool risque de refroidir ses utilisateurs en juxtaposant des rubriques qui ne devraient pas l'être
Page d'accueil du site Whirlpool

En proposant à un même niveau des rubriques intitulées réfrigérateurs et congélateurs d'une part, puis réfrigérateurs américains et réfrigérateurs congélateurs d'autre part, Whirlpool génère de la confusion dans l'esprit de l'utilisateur. Et risque de le faire fuir… En effet, à la vue des 2 premières sous-rubriques, il peut s'attendre par exemple à ce qu'on lui propose d'autres rubriques de type réfrigérateurs intégrables ou réfrigérateur 2 portes. Ce n'est pas le cas puisque l'on passe ensuite à des sous-rubriques plus génériques. Dérouté s'il est en quête d'un table top, il peut considérer que le site n'est pas en mesure de répondre à son besoin.

3. Eviter à tout prix les contenus dupliqués

En matière d'arborescence, il faut s'attacher à ce qu'une information ne puisse logiquement figurer que dans une seule rubrique. Dans le cas contraire, c'est que l'architecture est bancale : dite polyhiérarchique, elle prodiguera un effet-brouillon chez l'utilisateur.

En plus, le contenu dupliqué nuit grandement au référencement : il fractionne les liens entrants vers le contenu. Au final, chaque page concernée perd en visibilité propre.

Cette recherche d'exclusivité ne s'entend que pour un même schéma d'organisation. Si deux systèmes sont utilisés en parallèle, comme dans le cas de la juxtaposition entre des accès par thématique et par audience, le problème ne se pose pas. Une information est rattachée à une rubrique de l'arborescence thématique et peut, via la même URL, être relayée dans une section relative à une audience en particulier.

4. Ne pas viser trop large

Les capacités de l'utilisateur à examiner une page Web et sa mémoire à court terme sont bornées. Ses limites cognitives l'empêchent de pouvoir identifier et retenir un terme ou une rubrique si ceux-ci sont noyés au milieu de dizaines d'autres. Selon la célèbre règle du psychologue G. Miller, la limite se situe en l'occurrence à 7 éléments, + ou - 2, selon l'individu.

Dans cette optique, on gagne à minimiser le nombre d'options proposées à chaque niveau. Autrement dit, l'arborescence ne doit pas être trop "large".

Bien qu'il faille le garder en tête moment de constituer une arborescence, ce chiffre magique de 7 (+ ou -2) ne doit pas être érigé en dogme. Notamment lorsque l'on dispose d'une offre très hétérogène, comme ce peut être le cas sur les sites E-commerce.

L'Oréal joue avec le feu en étirant au maximum son arborescence
Vue d'écran de la page d'accueil de l'Oréal

9 rubriques au niveau 1, 10 au niveau 2 : L'Oréal fait fi de la limite courante des 7 éléments à un même niveau. Un pari risqué ? Il suffit de faire le test et d'essayer de lire les 10 sous-rubriques de la rubrique Recherche. Arrivé à la fin de la liste, il y a fort à parier que l'on ne se souvienne plus du début…

5. Ne pas viser trop profond non plus

Une arborescence qui repose sur trop de sous-niveaux ou, autrement dit, un site trop profond décourage l'utilisateur. Se limiter à une arborescence à 5 "étages" est judicieux. Et évite que l'utilisateur multiplie les clics pour accéder à une information.

On relèguera cependant aux oubliettes la règle fallacieuse des 3 clics : arbitraire, celle-ci complexifie l'arborescence en confrontant l'utilisateur à plus de choix à un même niveau. Et donc, augmente les risques d'erreurs et de frustrations...

Limiter la profondeur offre un autre avantage : celui d'éviter les freins au référencement. Il est couramment admis que les moteurs de recherche indexent moins fréquemment les contenus les plus "profonds", au-delà des niveaux 4 ou 5.

6. Equilibrer la largeur et la profondeur de l'arborescence, en somme

Limiter la largeur et la profondeur d'une structure hiérarchique, c'est déjà se rapprocher d'une autre règle présidant à sa conception. Pour être efficace, une arborescence doit équilibrer le nombre d'options qu'elle propose à un même niveau (la largeur) et le nombre de sous-niveaux (la profondeur). On comprendra aisément pourquoi :

  • Si une arborescence est large et peu profonde, l'expérience-utilisateur sera déceptive. Au début de son parcours sur le site, l'internaute se verra en effet proposer un choix étoffé... Mais il aura tôt fait de se sentir trompé : au clic, peu d'informations, s'offriront à lui.
  • Si, au contraire, une arborescence est étroite et profonde, l'internaute devra passer par un nombre considérable de sous-niveaux pour voir son besoin satisfait. Dans ce cas, l'expérience-utilisateur sera complexe et décourageante.

7. Associer une page à chaque niveau de l'arborescence

Une arborescence a vocation à accompagner la progression dans le site. A ce titre, elle ne doit pas brusquer l'utilisateur qui passe d'un niveau N à un niveau N-2. Le niveau intermédiaire N-1, doit aussi faire l'objet d'une page. Il correspond à une étape à part entière dans la découverte des contenus : celle qui permet d'opérer à des choix ou des les valider.

Les niveaux intermédiaires entre une rubrique générique et une page très spécifique doivent être relayées par des "pages-carrefours" Elles donnent accès aux contenus des niveaux inférieurs en opérant, par exemple, à une sélection des informations les plus pertinentes ou les plus récentes qu'ils contiennent. Elles structurent également le parcours de l'utilisateur sur le site, avec logique et fluidité.

Dans tous les cas, il faut à tout prix éviter de proposer des rubriques intermédiaires dans une seule démarche "intellectuelle", c'est-à-dire juste pour regrouper des sous-rubriques. Si une rubrique ne peut faire l'objet d'une page, c'est qu'elle ne doit pas être un élément visible dans l'arborescence. On préfèrera toujours ajouter un clic supplémentaire plutôt que de créer des rubriques auxquelles on ne peut accéder.

Alstom présente ses activités dans la douceur
Page métiers du site Alstom

Avec cette page-carrefour, Alstom permet à l'internaute de disposer d'une vue d'ensemble sur les activités de la société. Respectant le principe de la pyramide inversée, le chapô en présente une synthèse qui peut suffire à certains. Ceux qui souhaitent en savoir plus sur l'un des métiers ont la possibilité de le faire via l'accès aux 2 sous-rubriques en bas de la page. Une manière d'épouser les différentes typologies de besoins, en accompagnant chacun d'entre eux.

8. Refléter l'arborescence dans l'URL des pages

Comme l'arborescence, un schéma d'URL contribue à l'expérience de navigation. Comme elle aussi, il se constitue à partir de relations de subordination. Autant donc viser la cohérence et calquer la structure des URLs sur celle de l'arborescence. Et refléter l'une à travers l'autre.

Les URLs de Saint-Gobain sont parfaitement intuitives
Page Chiffres par pôles du site de Saint Gobain

Reflétant strictement l'arborescence et la manière dont elle se déploie, les URLs mises en œuvre par Saint-Gobain sont parfaitement optimisées. Pouvant servir la navigation, elles portent par ailleurs une valeur informative, utile à l'internaute et porteuse en termes de référencement.

Aussi structurante soit-elle, l'arborescence n'est pas une fin en soi : répondant à des choix parfois arbitraires, elle masque les différentes acceptions que peut revêtir un thème. Et limite les chemins d'accès à l'information. A ce titre, elle doit être complétée par une navigation efficiente pour satisfaire les différents modes de recherche.

Réexploiter ce contenu

Architecture de l'information

Principes de structuration
Modèles d'organisation
Arborescence
Bosch / Whirlpool : stratégies d'arborescence
Pages-clés
Landing page

Navigation :

Retrouvez cette page en ligne sur : http://www.contentme.fr/