Menu de navigation

Les types de menus de navigation

• Menu horizontal — le plus courant, placé dans le header. Affiche les items principaux en ligne. Parfait pour les sites avec 5-7 sections principales.
• Menu hamburger — représenté par trois lignes horizontales (☰). Ouvre un menu en overlay au clic. Standard sur mobile, de plus en plus utilisé aussi sur desktop pour un design épuré.
• Menu vertical / sidebar — placé sur le côté de la page. Utile pour les sites avec beaucoup de sections (documentation, e-commerce complexe).
• Méga-menu — menu déroulant large qui affiche toutes les sous-catégories en plusieurs colonnes. Utilisé par les gros e-commerces pour présenter un vaste catalogue.
• Menu sticky — reste visible en permanence pendant le scroll. Utile sur les pages longues pour garder la navigation toujours accessible.
• Menu footer — placé en bas de page, souvent avec des liens secondaires (mentions légales, contact, réseaux sociaux).
• Fil d’Ariane (breadcrumb) — menu de navigation contextuel qui montre la position du visiteur dans l’arborescence du site (Accueil > Services > SEO).

Les règles d’un menu efficace

• Limitez le nombre d’items — maximum 7 items au premier niveau (loi de Miller sur la mémoire de travail). Au-delà, le visiteur se perd. Regroupez les pages en sous-menus si nécessaire.
• Utilisez des labels clairs — “Services” est universel, “Notre offre 360°” est jargonneux. Préférez les mots que cherchent vos visiteurs.
• Ordre logique — les items les plus importants à gauche (premier lu), les moins importants à droite. “Contact” est souvent en dernier à droite.
• Visible en permanence — sur desktop, le menu horizontal est toujours visible. Sur mobile, le bouton hamburger est toujours atteignable (souvent sticky).
• Indicateur de page active — la page courante doit être visuellement distinguée dans le menu (couleur, soulignement, graisse). Le visiteur doit toujours savoir où il est.
• Cohérence sur tout le site — le menu doit être identique sur toutes les pages. Pas de variations qui désorientent.

Menu de navigation et mobile

Sur mobile, l’espace est précieux. Le menu hamburger est devenu le standard de facto, mais il a ses limites : il cache la navigation et réduit l’exploration des pages par les visiteurs. Quelques alternatives modernes :

• Bottom bar (barre de navigation en bas) — inspirée des apps mobiles, affiche 3-5 icônes principales en bas de l’écran. Toujours visible, ergonomique pour les pouces.
• Menu hamburger avec preview — le menu hamburger s’accompagne d’une icône supplémentaire (panier, recherche, contact) toujours visible.
• Sticky CTA — plutôt qu’un menu complet, afficher en permanence le CTA principal (“Appeler”, “Devis gratuit”).

Menu et SEO

Le menu de navigation a un impact SEO significatif : il constitue l’un des maillages internes les plus puissants de votre site. Chaque lien du menu est présent sur toutes les pages, ce qui transmet beaucoup de PageRank aux pages liées.

Les bonnes pratiques SEO pour le menu :

• Liens vers les pages importantes — le menu doit inclure les pages que vous voulez positionner en priorité sur Google.
• Ancres descriptives — “Création de site web” plutôt que “Notre savoir-faire”.
• URLs propres — les liens du menu doivent pointer vers des URLs descriptives et optimisées SEO.
• Fil d’Ariane balisé — ajouter le schema BreadcrumbList pour afficher le fil d’Ariane dans les résultats Google.

Besoin d’un site web au design professionnel ?