Breadcrumb
B
Definition complete
Le breadcrumb (fil d'Ariane) est un element de navigation secondaire affichant le chemin hierarchique de l'utilisateur depuis la page d'accueil jusqu'a la page actuelle. Ce pattern UX essentiel ameliore l'orientation des visiteurs et contribue positivement au SEO.
Le breadcrumb offre plusieurs benefices :
- Navigation facilitee : l'utilisateur peut remonter rapidement dans l'arborescence
- Orientation claire : l'utilisateur sait ou il se trouve dans le site
- Maillage interne : liens contextuels vers les pages parents
- SEO : structure claire pour les robots + affichage enrichi dans les SERP
- Reduction des rebonds : alternative au bouton retour qui quitte parfois le site
Types de breadcrumbs :
- Hierarchique : reflete la structure du site (Accueil > Categorie > Sous-categorie > Produit)
- Attributs : base sur les caracteristiques (Accueil > Chaussures > Homme > Running)
- Historique : base sur le parcours utilisateur (moins recommande)
L'implementation avec Schema.org BreadcrumbList en JSON-LD permet a Google d'afficher le breadcrumb enrichi dans les resultats de recherche, ameliorant le CTR.
Exemples pratiques
- E-commerce : Accueil > Mode Homme > Chaussures > Baskets > Nike Air Max 90
- Blog : Accueil > Blog > Categorie SEO > "Comment optimiser vos balises title"
- Site corporate : Accueil > Nos Services > Creation de Sites Web > Sites E-commerce
- Schema.org : Balisage JSON-LD BreadcrumbList generant les liens cliquables dans les SERP
- Mobile : Breadcrumb tronque "... > Sous-categorie > Page actuelle" pour economiser l'espace
A quoi sert Breadcrumb ?
Cas d'usage en UX et SEO :
- Implementation sur tous les sites avec plus de 2 niveaux de profondeur
- Balisage Schema.org BreadcrumbList en JSON-LD pour l'affichage enrichi Google
- Audit des breadcrumbs existants pour verifier la coherence avec l'arborescence
- Adaptation du design pour la version mobile (troncature, scrollable)
- Test de l'impact du breadcrumb sur la navigation et le taux de rebond
- Integration avec le CMS pour generation automatique selon la hierarchie
Breadcrumb en pratique chez 123web
Chez 123web, nous implementons des breadcrumbs optimises avec balisage Schema.org sur tous nos projets. Cette navigation secondaire ameliore l'experience utilisateur, renforce le maillage interne et genere des resultats enrichis dans Google pour un meilleur taux de clic.