Breadcrumbs ontwerpen die de werkelijke plaats van een pagina tonen
Maak broodkruimelnavigatie die bezoekers helpt en overeenkomt met uw sitehiërarchie. Met keuzes voor categorieën, mobiele weergave en bijpassende markup.

In dit artikel
Breadcrumbs, of broodkruimelnavigatie, tonen waar een pagina binnen een website hoort. Een bruikbare kruimelroute verbindt een detailpagina met herkenbare bovenliggende onderwerpen. Kies die route op basis van de inhoudelijke structuur, niet op basis van alle klikken die een bezoeker daarvoor deed.
Voor SEO is vooral de samenhang van belang: gewone links naar bestaande overzichtspagina's, duidelijke namen en eventuele gestructureerde gegevens die dezelfde route beschrijven. Een kruimelroute geeft geen garantie op een speciale zoekweergave. Ze helpt eerst iemand die rechtstreeks op een diep artikel of product terechtkomt.
Kies eerst een echte hiërarchie
Schrijf voor elk paginatype op bij welk overzicht het hoort. Een artikel over snoeien kan onder Tuinonderhoud vallen; een product onder Gereedschap. Het overzicht moet zelf bruikbaar zijn. Een lege categorie die uitsluitend bestaat om een extra zoekwoord in een kruimelroute te plaatsen, voegt weinig toe.
Controleer de keuze tegen uw interne leesroutes. De kruimelroute is één vaste oriëntatielaag. Contextuele verwijzingen in de tekst kunnen daarnaast andere verbanden leggen. U hoeft dus niet iedere relatie in één steeds langere route te proppen. Een bezoeker moet na één blik begrijpen waarom het gekozen bovenliggende onderwerp relevant is.
Gebruik pagina-identiteit in plaats van klikgeschiedenis
Een knop Terug en een kruimelroute hebben verschillende functies. Terug volgt een bezochte geschiedenis; een kruimelroute toont de plaats die de publicatie aan een pagina geeft. Die plaats blijft ook begrijpelijk wanneer iemand via een externe link binnenkomt.
Bij een webshop kan hetzelfde product in meerdere categorieën staan. Kies een stabiele primaire route, of toon een inhoudelijk verdedigbare route volgens een vaste regel. Laat een trackingparameter niet willekeurig bepalen welke hiërarchie zoekmachines zien. Behandel URL-keuzes apart via canonical-tags. Een andere kruimelroute lost dubbele productadressen immers niet automatisch op.
Maak de zichtbare navigatie toegankelijk
Gebruik echte links voor bovenliggende bestemmingen en een herkenbaar navigatiegebied. De huidige pagina hoeft geen nutteloze zelflink te krijgen. Scheidingstekens moeten visueel duidelijk zijn zonder dat hulptechnologie telkens overbodige tekens voorleest.
Het W3C-voorbeeld voor breadcrumbs beschrijft een navigatielandmark en het aanduiden van de huidige pagina. Dat is een ontwerppatroon, geen bewijs dat uw uitvoering automatisch toegankelijk is. Controleer toetsenbordgebruik, zichtbare focus en vergroting. Vooral lange categorienamen mogen de pagina niet buiten het scherm duwen of onbedoeld onleesbaar worden wanneer tekst wordt vergroot.
Laat namen dezelfde betekenis houden
Een kruimel mag compacter zijn dan een volledige paginatitel, zolang hij dezelfde bestemming herkenbaar beschrijft. “Onderhoud” is onduidelijk wanneer de website zowel fietsherstel als machineonderhoud behandelt. “Fietsonderhoud” geeft meer context zonder de hele titel te herhalen.
Stem deze naam af op het menu en de kop van het overzicht. De gids over paginatitels en metaomschrijvingen helpt verschillende tekstfuncties uit elkaar houden. U hoeft geen reeks plaatsnamen, superlatieven of synoniemen aan iedere kruimel toe te voegen. Een navigatielabel is een wegwijzer. Wanneer het als reclameblok gaat lezen, wordt oriënteren juist moeilijker.
Een fictieve route voor een onderdelenwinkel
De fictieve onderdelenwinkel Voorbeeldfiets heeft 18 onderhoudsgidsen en 42 producten. Een gids over kettingslijtage staat aanvankelijk onder “Home > Tips > Overige > Ketting”. De drie tussenniveaus leiden naar dunne lijsten zonder heldere taak.
De redactie kiest “Home > Fietsonderhoud > Ketting controleren”. Fietsonderhoud bevat nu de 18 gidsen, verdeeld met duidelijke tussenkoppen. Producten blijven in de winkelstructuur. Een inhoudelijke verwijzing uit de gids naar kettingmeters verbindt advies en aanbod zonder te doen alsof de gids een product is.
Dit is een fictief informatieontwerp. De aantallen beschrijven de oefening en zijn geen gemeten bezoekers- of zoekresultaat. Het voordeel dat wordt nagestreefd is een begrijpelijke terugweg naar verwant advies.
Voeg passende gestructureerde gegevens toe
Wanneer u BreadcrumbList gebruikt, moeten namen, volgorde en bestemmingen aansluiten bij de zichtbare pagina. Google's documentatie over breadcrumbs beschrijft het ondersteunde formaat en de vereisten. Gebruik de documentatie als technische basis en controleer de uiteindelijke uitvoer.
Laat een CMS niet ongemerkt oude categorieadressen in de markup bewaren terwijl de zichtbare navigatie al is gewijzigd. De algemene gids over structured data legt uit waarom beschrijving en werkelijkheid moeten overeenkomen. Geldige syntaxis alleen bewijst geen inhoudelijke juistheid. Een testtool kan niet weten of uw categorie werkelijk de juiste bovenliggende bestemming is.
Controleer uitzonderingen en mobiele weergave
Neem een homepage, categorie, detailpagina, artikel en eventuele vervolgpagina in uw steekproef. Een zoekresultatenpagina heeft mogelijk geen vaste plaats in de redactionele hiërarchie. Een gefilterde lijst vraagt evenmin automatisch een nieuw niveau. Schrijf deze uitzonderingen op voordat losse sjablonen hun eigen regels gaan verzinnen.
Controleer op een klein scherm of lange routes afbreken zonder informatie te verliezen. Verberg niet alle oriëntatie achter onbegrijpelijke afkortingen. Bekijk ook een rechtstreeks geopend diep adres en een pagina na een categoriehernoeming. Controleer dan zowel de links als de metadata, omdat beide vaak uit verschillende velden worden opgebouwd.
Een nieuwe categorie raakt meer dan het menu. Zij kan kruimelroutes, interne links, canonicals en gerelateerde artikelen veranderen. Wijs daarom één eigenaar aan die de gevolgen van verplaatsen controleert en eventuele oude bestemmingen beoordeelt.
Bewaar per paginatype een eenvoudig voorbeeld met de bedoelde route. Zo kan een ontwikkelaar een fout in het sjabloon onderscheiden van een verkeerde redactionele indeling. Een kwartaalcontrole is geen verplichte SEO-regel; kies een ritme dat past bij werkelijke structuurwijzigingen. De route verdient vooral aandacht wanneer u content toevoegt, categorieën samenvoegt of een productassortiment herordent.
Bronnen en grenzen
Google beschrijft Breadcrumb structured data. W3C publiceert het toegankelijkheidspatroon voor breadcrumbnavigatie. Deze bronnen onderbouwen respectievelijk de zoekmarkup en de semantische navigatie. De winkel en ontwerpkeuzes zijn fictieve redactionele voorbeelden. Welke hiërarchie past, hangt af van uw aanbod en echte leesroutes; een technisch geldige kruimelroute bewijst op zichzelf geen begrijpelijke structuur.