Breadcrumbs

Breadcrumbs er en række små navigationslinks, der viser, hvor den aktuelle side ligger i hjemmesidens struktur. En sti kan eksempelvis se sådan ud: Forside → Webshop → Motorcykelhjelme → Integralhjelme. På dansk bliver de ofte kaldt brødkrummer eller en brødkrummesti.

Navnet kommer fra fortællingen om Hans og Grete, men funktionen er mindre eventyrlig. Den hjælper en besøgende med at orientere sig og gå et eller flere niveauer tilbage uden først at finde hovedmenuen. Det er især nyttigt på en stor webshop, en videnssektion eller et website med mange kategorier.

Breadcrumbs er ikke det samme som browserens tilbageknap. Tilbageknappen følger den rute, personen faktisk har taget. Brødkrummestien viser derimod sidens placering i websitets informationsarkitektur. En bruger kan være landet direkte fra Google og stadig se, hvilken kategori siden hører til.

Funktionen kan både støtte UX og SEO. For brugeren skaber den overblik og korte veje. For søgemaskiner tilføjer den tekstlinks mellem beslægtede niveauer og gør hierarkiet tydeligere. Med korrekte strukturerede data kan stien desuden bruges som en del af præsentationen i søgeresultaterne.

Det betyder ikke, at alle små websites skal have breadcrumbs. Har virksomheden fem sider i ét niveau, kan stien ende som “Forside → Kontakt”, og så tilfører den næsten intet. Funktionen er bedst, når der faktisk findes et meningsfuldt hierarki, som læseren kan have glæde af at se.

Begynd med strukturen, ikke med designet. Afgør hvilke sider der er overordnede, hvilke der er kategorier, og hvor den konkrete side hører hjemme. Breadcrumbs kan ikke reparere en rodet struktur alene. De afslører mest, at rodet findes.

Vis normalt stien tæt på toppen af siden, før hovedoverskriften eller lige under den. Den skal være synlig uden at dominere. Brug tekstlinks på alle tidligere niveauer, mens den aktuelle side kan stå som almindelig tekst. Det gør det tydeligt, hvad der kan klikkes på.

Brug korte og genkendelige navne. En kategori kan godt hedde “Hjemmesider”, selv om dens fulde title tag er “Professionelle hjemmesider til virksomheder”. Breadcrumbs er navigation, ikke et sted til at proppe alle søgeord ind. Linkteksten skal først og fremmest hjælpe læseren.

Sørg for, at den synlige sti og den tekniske BreadcrumbList-opmærkning fortæller den samme historie. Google Search Console kan vise fejl i strukturerede data, men den kan ikke afgøre, om jeres valgte kategorier giver mening for kunderne. Det kræver en redaktionel vurdering.

På mobil må stien ikke skubbe det vigtigste indhold langt ned eller blive til en ulæselig linje med seks niveauer. Den kan forkortes visuelt, scrolles vandret eller vise de nærmeste niveauer, men de bevarede links skal stadig være lette at trykke på. Test den som en del af det responsive design.

Inddrag breadcrumbs i arbejdet med intern linkbuilding, men lad være med at tælle dem som hele løsningen. De forbinder typisk barnet med forældrene. Indholdslinks i brødteksten kan stadig pege på søskendesider, guides og ydelser, hvor forbindelsen er relevant.

En webshop med genbrugsbyggematerialer har 1.800 produkter. En besøgende lander fra Google på en bestemt brugt terrassedør. Uden breadcrumbs kan personen enten købe døren, bruge menuen eller gå tilbage til Google. Med stien Forside → Døre og vinduer → Terrassedøre → Produkt kan personen med ét klik se alle terrassedøre.

Data viser, at 38 ud af 100 besøgende på produktsiderne klikker videre til en kategori, før de forlader webshoppen. Det er ikke et bevis på, at breadcrumbs alene skaber salget, men det viser, at kategorivejen bliver brugt. Funktionen hjælper især de besøgende, som opdager, at det første produkt ikke passer i mål eller pris.

På en mindre virksomhedshjemmeside med siderne Forside, Om, Ydelser og Kontakt vælger man derimod ikke at vise breadcrumbs. Der er kun ét niveau under menuen, og navigationslinjen ville gentage det, som allerede står tydeligt øverst. Her er den bedste løsning at lade være.

Et tredje eksempel er en marketingordbog. Stien kan være Forside → Viden → Marketingordbog → Breadcrumbs. Den hjælper læseren tilbage til oversigten og viser, at opslaget er en del af et større fagligt univers. Samtidig forbinder den undersiden med de centrale oversigtssider.

Hvis Google viser breadcrumb-stien i et SERP, kan resultatet fremstå mere læsbart end en lang teknisk URL. Det er dog Google, der bestemmer den endelige visning. Opmærkningen er en mulighed for at forklare strukturen, ikke en garanti for et bestemt udseende.

Den mest almindelige fejl er at generere stien ud fra den URL, der tilfældigvis findes, selv om adressen ikke afspejler den reelle struktur. En side kan ligge på /kampagner/sommer/produkt-x/, men høre fast hjemme i kategorien “Hjelme”. En kampagnemappe er ikke nødvendigvis en meningsfuld forælder.

En anden fejl er at gøre hvert ord til et link, inklusive den aktuelle side. Brugeren forventer normalt ikke, at et klik på sidens eget navn gør noget nyttigt. Lad det sidste led markere placeringen, og gør tidligere niveauer klikbare.

Undgå også en sti, der ikke stemmer med menu, canonical og interne links. Hvis produktet vises under tre kategorier, skal I vælge, hvilken primær sti der giver mest mening, i stedet for at skifte tilfældigt fra besøg til besøg. Ellers bliver navigationen ustabil.

Endelig kan en alt for lang brødkrummesti gøre mere skade end gavn. Syv næsten ens kategorier fortæller, at hierarkiet måske er blevet for detaljeret. Det er sjældent et CSS-problem. Det er et tegn på, at kategorierne bør vurderes.

W3C beskriver breadcrumbs som en navigation, der viser brugerens placering i et sæt websider. Den bør have et tilgængeligt navn, så personer med skærmlæser kan skelne den fra andre navigationsområder. Den aktuelle side kan markeres med aria-current="page".

Google understøtter BreadcrumbList som strukturerede data. Hvert niveau får en position, et navn og normalt en URL. Det tekniske format kan være JSON-LD, men det ændrer ikke kravet om, at den synlige navigation skal være sand og anvendelig.

På WordPress kan temaet, et SEO-plugin eller en specialudviklet funktion levere breadcrumbs. Kontrollér altid resultatet på rigtige sider. En automatisk løsning kan være teknisk korrekt og stadig vælge forkerte kategorier eller vise arkiver, som kunderne aldrig bruger.

Se breadcrumbs som et lille resultat af en større beslutning om struktur. Når kategorier, URL’er, menu og interne links peger i samme retning, bliver stien nyttig. Når de andre dele modsiger hinanden, bliver den blot en pæn række links oven på problemet.

Vores guide om brugervenlige hjemmesider går bredere ind i navigation, tydelige valg og den vej, besøgende skal kunne finde. Breadcrumbs er kun ét af de greb, der kan gøre den vej enklere.

Brødkrummestien kan også bruges som et redaktionelt kontrolpunkt. Hvis redaktøren ikke kan afgøre, hvilken sti et nyt opslag skal have, er det ofte fordi kategorien er uklar eller siden forsøger at dække flere emner på én gang. Løs først den uklarhed, før navigationen automatiseres.

På websites med facetter og filtre bør breadcrumbs normalt vise den stabile kategori, ikke enhver midlertidig kombination af farve, pris og størrelse. Ellers kan stien vokse voldsomt og skabe links til filtrerede sider, som ikke bør være permanente landingssider. Det hænger sammen med canonical, noindex og crawlstyring.

Kontrollér også, om en kategoriændring automatisk ændrer breadcrumb-stien på gamle sider. Det kan være helt korrekt, men det bør ske bevidst. Når en hel produktgruppe flyttes, skal menu, URL-struktur, interne links og structured data fortsat fortælle samme historie.

Et godt navn til det enkelte led er ofte kortere end sidens H1. Brugeren har allerede konteksten fra de foregående led. “Integralhjelme” er bedre end “Se vores store udvalg af integralhjelme til motorcykel”, fordi navigationen skal kunne scannes hurtigt og fungere på små skærme.