Breadcrumbs: klein linkje, groot effect

Breadcrumbs zijn een belangrijk navigatie-element. Je maakt hiermee de bezoekers van je website bewust van hun huidige locatie binnen de hiërarchische structuur van een website. Zo hebben breadcrumbs nog wel meer voordelen. Als je het mij vraagt is zo’n kruimelpad onmisbaar op je website, en niet alleen voor SEO.

Wat zijn breadcrumbs?

Breadcrumbs zijn navigatie-elementen die worden gebruikt op websites en webshops. Ze ondersteunen gebruikers bij de reis door de website. Breadcrumbs helpen met de oriëntatie en helpen bezoekers de weg te vinden naar andere, mogelijk relevantere pagina’s.

Zo’n kruimelpad is een lijst met links die de huidige pagina en zijn “voorgangers” (bovenliggende pagina, hoofdpagina, enzovoort) benadrukken. Meestal gaat dat helemaal terug naar de homepagina van de site.

Ze worden weergegeven als een spoor van links bovenaan de pagina, meestal net onder de hoofdnavigatie. Zo’n pad begeleiden bezoekers naar pagina’s met een bredere inhoud in de bovenliggende categorie van de huidige pagina.

Zo’n breadcrumb is hartstikke handig, maar niet altijd nodig. Ze nemen soms kostbare ruimte in beslag boven de fold en bieden wel eens geen significante waarde. Vooral als je hoofdnavigatie gemakkelijk te begrijpen is, en je een goede zoekfunctie op de site hebt.

Breadcrumb voorbeeld in de webshop van Dille&Kamille.

Waarom is een breadcrumb onmisbaar?

Een breadcrumb gebruiken heeft meerdere voordelen. Daarom heeft bijna elke site of webshop ze wel in gebruik. Zowel voor SEO, UX,en als navigatiehulp is een kruimelpad ontzettend waardevol.

1) Goed voor je interne linkstructuur

Breadcrumbs zijn ook een soort interne links. Dat betekent dat je met deze links ook context kunt geven. Kies daarom de anchortekst van je link zorgvuldig uit. Met een breadcrumb ondersteun je daarom je interne linkstructuur.

2) Bezoekers verdwalen minder

Ze zijn vooral handig wanneer gebruikers op de site komen via een externe link of niet beginnen bij de homepagina. Ze laten zien waar je bent, zodat je bezoeker niet verdwaalt.

3) Laat zien hoe de website in elkaar zit

Het laat zien hoe een grote website is gestructureerd en/of hoe producten zijn georganiseerd in een webshop. Als je bijvoorbeeld een productpagina bekijkt, en je meer van zulke producten wilt zien, weet je door de breadcrumb in welke categorie je die moet vinden.

4) Vergroot de kans op relevante doorstroming

Breadcrumbs gebruiken is een manier om een ​​niveau terug te krijgen en gerelateerde content te verkennen. Je kunt door klikken en zo verder door de website heen navigeren.

Wat als je breadcrumb te lang is?

Gebruik geen breadcrumbs die te lang zijn of meerdere regels innemen. Een breadcrumb met meerdere regels illustreert de structuur van het pad niet goed. Wat doe je daar precies aan?

Te lang op Desktop

Toon op desktop – waar veel ruimte is – altijd het volledige kruimelpad. Al moet je daar toch even goed opletten of die rij dan niet te lang wordt. Korter is in dit geval vaak beter. Oogt de breadcrumb rij wat lang?Probeer de breadcrumb tekst dan wat in te korten. Of gebruik als breadcrumb tekst wat steekwoorden in de anchortekst, in plaats van de titel van de desbetreffende pagina.

Als de breadcrumb-‘rij’ alsnog de volledige breedte inneemt op desktop en/of meerdere regels in beslag neemt, moet je je misschien even afvragen of je niet té veel niveau’s hebt in je websitehiërarchie.

Kom je toch echt niet onder al die niveau’s uit, kun je ervoor kiezen om een aantal categorieën uit het kruimelpad te halen. Maar zorg er steeds voor dat de voorgaande paden erg logisch op elkaar volgen.

Geen ruimte op Mobiel

Is het gek om kostbare mobiele ruimte op een schermpje te gebruiken voor een lijst met breadcrumb-links?  Ja. Op mobiele sites kunnen breadcrumbs snel meerdere regels inpikken en waardevolle ruimte in beslag nemen op een toch al overvol mobiel scherm.

Een goed compromis is om mobiele gebruikers alleen één stap terug te laten zien – zowel als een doorstroommiddel, als een hint van waar ze zich bevinden. Een breadcrumb die enkel één niveau naar boven wijst, is op mobiel vaak voldoende om de belangrijkste gebruikersdoelen te ondersteunen. 😉

Overige tips voor breadcrumbs

• Plaats breadcrumbs bovenaan.
  De meest voorkomende plaats waar bezoekers breadcrumbs verwachten en waar ze effectief werken als onderdeel van de algemene lay-out, is ergens boven de H1-kop of onder de navigatie.
• Breadcrumbs zijn bedoeld als aanvulling.
  Breadcrumbs mogen de algemene navigatiebalk of de subnavigatie niet vervangen.
• Breadcrumbs moeten de huidige locatie in de hiërarchische url structuur van de site weergeven.
  Plaats er dus alleen links in die relevant zijn voor de reeks.
• Neem de huidige pagina op als het laatste item in het kruimelpad en maak het laatste item niet klikbaar.
  Alle andere links van het kruimelpad moeten er klikbaar uitzien en klikbaar zijn. Stel je hebt op Mobiel te weinig ruimte, zou je altijd kunnen testen of je deze stap kan weglaten.
• De breadcrumb kan de titel of wat steekwoorden zijn
  De breadcrumb hoeft niet altijd de titel van de pagina te bevatten, soms zijn een paar woorden al genoeg. Het kan de naam zijn van de categorie, het product, de titel van het artikel, enzovoort.
• Gebruik zoekwoorden in de breadcrumb tekst.
  Aangezien een breadcrumb ook een interne link is, geeft de breadcrumb tekst meer context aan de pagina. Verwerk daarom zoekwoorden in die anchortekst om de pagina beter te omschrijven.