Breadcrumbs, verplichte kost voor elke site

Het is een mooi sprookje wat bijna elke Nederlander wel kent: Hans en Grietje die broodkruimels achterlaten om de weg terug te kunnen vinden. Deze methode heeft zijn weg gevonden naar het internet en heeft er dezelfde naam gekregen als in het sprookje: breadcrumbs.

Breadcrumbs zijn dus bedoeld om de weg terug te kunnen vinden, maar hoe ziet dat er uit voor een website? De volgende situatie geeft een overzicht van een kleine website weer:

scheme.gif

Een goede website heeft altijd een hiërarchische structuur zoals bovenstaand schema (ook hele grote websites kunnen een verzameling zijn van een aantal van deze structuren). Op het moment dat ik door deze site navigeer zullen bovenaan de pagina de betreffende breadcrumbs staan die het pad vanaf de homepage aangeven. Dus voor de pagina's "Rood" en "Fiets" zullen de breadcrumbs er zo uitzien:

  • Winkel > Auto > Rood
  • Winkel > Fiets

Wat is nou het grote voordeel van het weergeven van de breadcrumbs: het overzicht. Iemand die binnenkomt op de "Rood" pagina zal direct zien waar hij zich in de site bevind. Hij weet dat hij in de winkel bij het onderdeel auto op het type rood gekomen is. De volgende keer hoeft een bezoeker dus niet opnieuw via de afgelegde weg naar de site te komen maar kan hij de weg ook vinden vanaf de homepage.

Er zijn veel mensen die wel iets weten te vinden op het internet terwijl ze niet precies weten waar het staat. Wat ze wel weten is het pad dat ze de vorige keer afgelegd hebben om het te vinden, dat kan het ingeven van een zoekopdracht zijn of het volgen van een link vanaf een andere site. In dat proces loopt de bezoeker altijd de kans dat het toenmalig afgelegde pad er niet meer is en het gezochte niet meer terug kan vinden. Daarom wil je zelf controle hebben over die paden. Als je site de bezoeker direct al duidelijkheid had gegeven over de plek waar hij zich in de site bevond hoefde hij niet opnieuw een bepaald pad af te leggen maar kon hij de pagina ook vinden vanaf de homepage.

Ook als navigatiemiddel is het een handig hulpmiddel: mensen zien hoe de structuur van de site opgebouwd is en voelen zich vertrouwd met de site omdat ze niet snel de weg kwijt raken. Hoe vaak gebeurd het dat mensen binnen een site een interne link in een nieuw scherm openen om zo de vorige pagina niet kwijt te raken... Verder zijn ze makkelijk om de bovenliggende pagina van een bepaalde pagina te bereiken. In het geval van de eerdergenoemde site kun je dus van de "Rood" pagina naar de "Auto" pagina om andere auto's te bekijken.

Het laatste voordeel wat ook zeker belangrijk is: breadcrumbs zorgen voor een goede interne linkstructuur, en daar zijn zoekmachines blij mee. In het geval van de voorbeeld site krijgen de pagina's de volgende inkomende links:

  • Winkel: 6 stuks (Auto, Fiets, Blauw, Rood, Groot, Klein)
  • Auto: 2 stuks (Blauw, Rood)
  • Fiets: 2 stuks (Groot, Klein)

Al die links hebben de juiste tekst die ook over de betreffende pagina gaat. Dus zonder het handmatig aanbrengen van interne links tussen pagina's heb je al de basis voor een goede linkstructuur staan. Bij grotere sites zul je zien dat deze structuur een goede leidraad is voor zoekmachines om via elke willekeurige pagina de structuur van de site in te duiken om zo alle pagina's te vinden.

Click to activate social bookmarks

 
  • Jake

    andre, ben wel met je eens maar is het niet onnoemelijk veel moeite voor een webmaster omdit ook nog eens in een site te implementeren?

  • Dat ligt er aan. Als je een goede structuur in je site hebt zitten is het een koud kunstje om de breadcrumbs te implementeren. Grote sites werken nu vaak al met een database waarin de structuur en de onderlinge relaties tussen de pagina's vast liggen, implementatie van breadcrumbs kost daar weinig moeite.

    Sites die dus niet met een duidelijk structuur werken en in de loop van de tijd willekeurig pagina's hebben zitten toevoegen zullen inderdaad een probleem hebben met het invoeren.

  • Barend

    Eigenlijk een open XML voor de bezoeker dus?
    En dan wat compacter.

  • Ja, zo zou je het ook kunnen noemen inderdaad.

  • endless

    En vind jij de standaard "breadcrumbs" die WordPress heeft goed?

  • Voor zover ik weet is die standaard functionaliteit niets anders dan het weergeven van een homepagelink gevolgd door de categorie. Dat is voor een simpele site als deze in feite voldoende maar ook overbodig omdat direct wel duidelijk is in welke categorie je je bevind.

    Op het moment dat er een uitgebreidere structuur gebruikt wordt is die functionaliteit ook niet meer toereikend en zul je een speciale breadcrumb plugin moeten installeren die meer opties bied.

  • Sjoerd

    In het sprookje van Hans & Grietje komen geen broodkruimels voor. Dit is afkomstig uit het sprookje Kleinduimpje. even ter informatie 🙂

  • En wat gooien Hans en Grietje op de grond dan als ze naar het huisje van de heks gaan?

  • Henk de Vries

    Als je een artikel schrijft over iets wat percee op een website moet staan, dan moet je het natuurlijk ook zelf ook op je website hebben staan he.

  • Dan

    Hoi Andre,

    Ik zal me eerst even voorstellen:
    Dan Knijf, woonachtig in Rotterdam, 47 jaar oud en heb een fijne vriendin. Hobby’s zijn o.a. skiën, boarden, ‘350-Z scheuren’ en sinds een jaar of twee het ‘website-gebeuren’.

    Ik heb een (kleine) meubelspuiterij welke ik samen met een collega run. We hadden al een oude website die ooit door een vriend was gemaakt. http://www.eurobord.nl Niet echt een pronkstuk maar geeft wel een idee van wat we doen.

    Twee jaar geleden ben ik begonnen met een cursus html en css om zelf in de toekomst mijn eigen website te kunnen maken/ onderhouden. Al snel raakte ik geïnteresseerd in SEO.

    Ik ben nu bezig met een eerste eenvoudige site voor de zaak die ik volgende maand ga lanceren. De pagina’s voor de ‘basis’ heb ik bijna klaar.

    Ik heb de volgende vraag over breadcrumbs en de directory/mappenstructuur:
    Ik wil breadcrumbs toevoegen op m’n pagina’s. Nu heb ik gelezen dat het van belang is om de URL in het browservenster (en hiermee de structuur) zo goed mogelijk overeen te laten komen met de breadcrumbs.

    Klopt het dat ik hiertoe voor elke html-pagina waarnaar de home-pagina verwijst, ook een gelijknamige map moet maken waarin dan weer de html-pagina’s zitten waarnaar op hun beurt die pagina’s weer verwijzen?
    En dat deze pagina’s dan weer een map in deze eerder genoemde map krijgen voor de pagina’s waarnaar zij doorverwijzen?

    Voorbeeld:
    Home> contact (.html)
    Home > contact > route (.html)

    Er is dus een html-pag. ‘route.html’ maar ook een map ‘route’. Dit is de enige manier die ik kan bedenken om ‘contact’ tussen ‘home’ en ‘route’ te krijgen. Contact verwijst bij beide breadcrumbs naar de contact-pagina. (Als ik alleen de pagina’s home, contact en route heb, krijg ik ze in de URL nooit achter elkaar in deze volgorde)

    Is dit juist voor SEO en ook een om de site later mee uit te bouwen?
    Ik heb gezocht maar er geen antwoord op gevonden.
    Ik hoop dat jij me iets verder kunt helpen. Thanx alvast.
    Groet, Dan