Construire l'arborescence

Tu as tes pages et tes regroupements. Il faut maintenant les ranger dans un plan, qu'on appelle l'arborescence. Elle ressemble à un arbre à l'envers : la page d'accueil en haut, les rubriques en dessous, puis éventuellement des sous-pages. Dans cette leçon, tu vas apprendre à trouver le bon équilibre entre un menu trop long et des pages cachées trop loin. Tu verras aussi le rôle du pied de page et des adresses de pages. À la fin, tu pourras dessiner le plan d'un petit site sur une seule feuille.

Une arborescence a deux dimensions. La largeur, c'est le nombre de rubriques côte à côte. La profondeur, c'est le nombre de niveaux à traverser pour atteindre une page. Si tu mets vingt rubriques au premier niveau, le visiteur se perd dans le menu. Si tu caches la liste des documents au quatrième niveau, il ne la trouvera jamais. Pour un petit site comme ceux de nos trois cas, deux niveaux suffisent presque toujours : l'accueil, puis une poignée de rubriques, avec quelques sous-pages là où c'est vraiment nécessaire.

Le menu principal reprend les rubriques les plus utiles. Garde peu d'entrées, en général moins de sept pour un petit site, et place les plus importantes en premier. Choisis des noms courts et concrets, comme « La carte », « Réserver » ou « Nous trouver ». Sur téléphone, le menu se replie souvent derrière une icône à trois traits, et le visiteur ne voit donc pas ce qu'il contient. C'est pourquoi la tâche principale, réserver chez Dar Yasmine ou demander un entretien au cabinet, doit rester visible sous forme de bouton, même quand le menu est fermé.

Le pied de page, c'est le bas de chaque page. Les visiteurs y descendent souvent quand ils cherchent une information pratique. Mets-y les coordonnées complètes, les horaires, les liens vers les mentions légales et la politique de confidentialité, les réseaux sociaux de la structure et quelques liens utiles. Chez Mwinda, le pied de page affiche l'adresse du centre à Ngaliema, le numéro WhatsApp et le lien « Devenir bénévole ». Le pied de page ne remplace pas le menu, mais il rattrape les visiteurs qui ont fait défiler toute la page sans trouver.

Voici le plan du site de Dar Yasmine, tel qu'il tient sur une feuille. En haut, l'accueil. En dessous, quatre rubriques : la carte, réserver, les repas de groupe, et les horaires avec l'accès. La carte a deux sous-pages, le midi et le soir. En bas, le pied de page avec le contact, les mentions et la confidentialité. Dessine ton plan avec des boîtes et des traits, à la main ou dans un tableur, et numérote chaque page. Ces numéros te serviront à suivre chaque page dans les maquettes, le montage et les tests.

Chaque page a une adresse, qu'on appelle aussi URL. Une adresse lisible aide le visiteur et les moteurs de recherche. Google le recommande dans son guide de démarrage : des mots compréhensibles plutôt que des identifiants au hasard. Pour Dar Yasmine, on préfère une adresse qui se termine par la-carte plutôt qu'une suite de chiffres. Utilise des mots courts, en minuscules, séparés par des tirets simples, sans accents ni espaces. Et évite de changer une adresse après l'ouverture : les liens partagés ne marcheraient plus, sauf si tu prévois une redirection.

Retiens qu'une bonne arborescence équilibre largeur et profondeur : pour un petit site, deux niveaux suffisent souvent. Le menu principal reste court, avec des noms concrets, et la tâche principale reste visible en bouton sur téléphone. Le pied de page accueille les informations pratiques et légales. Les adresses des pages sont lisibles et ne changent plus après l'ouverture. Ton plan est prêt, mais une question reste ouverte : le visiteur arrive-t-il vraiment au bout de sa tâche ? La prochaine leçon y répond avec les parcours et le test d'arborescence.