Breadcrumps Navigation: Brødkrummer, der hjælper både bruger og Google

Det virkelige problem i livet
Har du nogensinde haft glæde af webstedet og har lyst til "Lost"? Jeg ved ikke, hvor du er på webstedet. Og vender tilbage til hovedsiden, eller hvordan man kan være interesseret? Eller måske klikker du fra Google -søgeresultaterne til en side direkte på webstedet. Og fandt, at det "flydende" ansigt alene, ingen kontekst, ikke ved, hvad der er relateret til eller er der nogen større side?
Dette problem er ikke kun en bruger som os. Kun men for webstedsejeren Digital Marketing eller SEO er dette problem et "mareridt", der har en direkte indflydelse på webstedets effektivitet. Om det er:
- Brugeren er forvirret og frustreret: når brugeren ikke kan finde vejen. Eller forstår ikke webstedsstrukturen, de sandsynligvis vil "trykke på" dit websted i sidste ende. Også kendt som en høj afvisningsrate
- Konverteringsfrekvens falder ned: Hvis kunder finder produktoplysninger, service eller opkald til handlingsknap, kan det ikke findes på grund af kompliceret navigation. Beslutningen om at købe eller kontakte er næsten nej.
- Google er forvirret. Tek på dit websted: Hvis Google Bot kommer ind for at gennemgå, skal du indsamle data og ikke forstå, hvilken side der er vigtig. Hvilken side er barnets ansigt? Hvilken side er en kategori, det er vanskeligt for dit websted at blive rangeret godt.
Hvis du støder på en situation som denne, er du ikke alene. Dette er et klassisk problem, som mange websteder står overfor. Men den gode nyhed er, at der er en "exit", der er meget enkel, men kraftfuld. Det vil hjælpe med at løse dette problem som "et skud med to ridepistoler", både bruger og Google, "Breadcrumps Navigation" eller "Bread Frake".
Spørg om illustrationer: Brugerbilledet bruger en computer og en mobiltelefon med et forvirret udtryk. Med en foruroligende sti som en labyrint på skærmen
Hvorfor skete dette problem?
Hvorfor forsømmer mange websteder eller design brødkrummer navigation, selvom det har enorme fordele? Hovedårsagen er ofte fra misforståelser. Eller giver større betydning for andre ting
- Med udsigt over betydning: Nogle mennesker tror, at brødkrummer bare er et lille element, der er unødigt eller mener, at det bare er en "dekoration", der er tilgængelig.
- Fremhæv for meget design: Nogle designere kan fokusere på skønheden eller enkelheden i designet for meget. Indtil jeg forsømmer de grundlæggende funktioner, der hjælper med at guide brugeren, såsom at skjule brødkrummer eller bruge for små tegn
- Webstedsstrukturen er ikke klar fra starten: hvis informationsarkitekturen (IA) på webstedet ikke er planlagt godt fra begyndelsen. Gør strukturen kompleks intet klart hierarki Det er vanskeligt at skabe en effektiv brødkrummer. kan du studere mere på informationsarkitekturartiklerne for SEO og UX for at forstå dette?
- SEO teknisk uvidenhed: Nogle webstedsejere eller udviklere ved muligvis ikke, at BreadCrumps ikke kun er nyttig for brugerne. Men spiller også en vigtig rolle i SEO, især for at hjælpe Google med at forstå strukturen på webstedet bedre via Breadcrumbs skema -mærke
- Opdatering af det websted, der ikke er konsistent: Nogle gange når nye sider tilføjes eller forbedrer indholdet, men ikke opdaterer brødkrummerstrukturen for at være konsistent, kan det få brødkrummer til at vise fejl. Eller ufuldstændig
Disse årsager fører til problemer, som brugerne "mistede" og Google "forstår ikke" webstedsstrukturen. Hvilket er en vigtig hindring for rangering og øget konvertering
Spørgsmål om illustrationer: Webstedsdesignere ser på små komponenter på skærmen eller billedstrukturen på webstedet, der ser kompliceret ud og ikke har nogen regler.
Hvis det er tilbage, hvordan vil det påvirke?
God uvidenhed og installation af gode brødkrummer -navigation kan føre til "smertefulde" resultater, både med hensyn til brugeroplevelser og SEO -ydeevne på dit websted. Lad os se, om det er tilbage i lang tid, hvad der vil ske:
- Obligationsrate er høj: Når brugerne kommer ind på webstedet og ikke kan finde, hvad de vil have. Eller ikke kan finde en måde at fortsætte på, de vil "trykke" på webstedet hurtigt, hvilket får Bounce -hastigheden til at være højere, hvilket er et dårligt signal for Google.
- Varigheden af brugeren på nettet (opholdstid) faldt: Hvis brugeren ikke kan udforske andet indhold på webstedet bekvemt, vil de bruge mindre tid. Som negativt påvirker Google Ranking og reduktion af muligheden for at opdage andet værdifuldt indhold
- Konverteringsfrekvens ned: Uanset om det er at købe produkter, udfylde formular eller abonnement, hvis brugeren ikke kan guide målsiden glat, vil chancerne for konvertering falde dramatisk.
- SEO er ikke så bang som det skal: Google Bot vil have problemer med at forstå hierarkiet på dit websted. Når strukturen ikke er klar, kan Google muligvis bedømme dit websted, end du burde være. Som påvirker dine søgerangeringer
- Oprettelse af et forkert internt link: Ingen gode brødkrummer får dig til at gå glip af muligheden for at skabe internt link af høj kvalitet, hvilket er vigtigt at distribuere Page Authority og hjælpe Google med at opdage Windows. Lettere på dit websted
- Brugeroplevelse (UX) er dårlig: brugeren vil føle sig frustreret og ikke imponeret over dit websted. Får dem til ikke at tænke på at vende tilbage til brug igen i fremtiden, hvilket er noget, du slet ikke ønsker at ske
Gode investeringer med UX -design fra starten er vigtig for at studere UX -strukturer til IR -webstedet kan hjælpe dig med at se vigtigheden af en god struktur.
Spørg om illustrationer: Grafen, der viser den stigende afvisningshastighedsgraf og den reducerede konverteringsfrekvens, sammen med spørgsmålstegn og computerskærmen, der viser dårlige søgeresultater.
Er der nogen løsning? Og hvor skal det starte?
Bare rolig! Det er ikke vanskeligt at løse disse problemer med brødkrummernavigation. Og har en værdi, der er mere værd end forventet! Lad os se, hvor du skal starte. Og hvilke teknikker
Første trin: Forstå din webstedsstruktur
Før du begynder at sætte brødkrummer, skal du først forstå strukturen på selve webstedet, hvor mange niveauer. Hvilken side er under hvilken side? For eksempel: Hjem> Kategori> Produkter eller hovedside> Service> Sub -service> Artikler
Teknikker til løsning af problemer med Navigation
- Klar brødkrummerdesign og let at bruge:
- Position: skal placeres på toppen af hovedindholdet. Under hovednavigationsmenuen eller under H1 på siden, så brugerne let kan se
- Format: Brug tekstformerne med pile eller mærker ">" adskilt mellem ansigtet, såsom hovedsiden> Produkter> T -shirts
- Farve og størrelse: Brug farve og størrelse på de tegn, der er lette at læse. Sluger ikke med baggrunden, men ikke fremragende for at konkurrere om opmærksomhed fra hovedindholdet
- Brug brødkrummer baseret på hierachy (ifølge hierarki):
- Dette er de mest almindelige og anbefalede formularer til SEO, der viser ruten i henhold til den rigtige webstedsstruktur, såsom Home> Category> Subcategory> Aktuel side.
- Dette giver både brugere og Google mulighed for at forstå hierarkiet på webstedet tydeligt.
- Sørg for, at hver side har de rigtige brødkrummer:
- Bortset fra hjemmesiden (hjemmesiden), skal hver side have brødkrummer, der fører tilbage til de vigtigste sider og sider, der er involveret.
- Linket i brødkrummer skal være et klikbart link og bruge brugeren til den rigtige destination.
- bruge Breadcumblist skema markering:
- Dette er "SEO", de vigtigste brødkrummer! At øge brødkrumbliststruktureret (i form af JSON-LD) til kodeksen på webstedet vil hjælpe Google med at forstå din webstedsstruktur bedre og kan muligvis vise dine brødkrummer i søgeresultaterne (Rich Strappet), hvilket vil gøre dit link mere klik.
- Du kan bruge forskellige værktøjer, såsom Google Search Central for at kontrollere, om din skema -markering er korrekt.
- Gør mobilvenlig:
- Glem ikke, at mange brugere får adgang til webstedet via mobil. Sørg for, at dine brødkrummer vises godt på en lille skærm. Ikke for stor eller kompliceret, indtil det er vanskeligt at læse
- Hvis der er for meget hierarki på mobil, kan det overveje nogle skjulte eller bruge JavaScript til at forkorte "..." mellem hoved- og nuværende hovedsider. For at spare plads
- Bind de interne links korrekt:
- Breadcrumbs er et fantastisk internt linkværktøj. Det hjælper med at distribuere sidemyndigheden og fortælle Google, hvilken side der er knyttet til hvilken side.
- Overvej forbindelsen mellem brødkrummer til mega -menu, der fokuserer på din SEO for at styrke strukturen. Du kan se prøver fra WebFlow SEO -venlig mega -menu .
Fra din "webstedsundersøgelse" er det vigtigste punkt. Derefter begyndte det at tilpasse disse teknikker trin for trin.
Spørg om illustrationer: Håndbilledet af Breadcrumbs Jigsaw -puslespil på et klart webstedsdiagram. Repræsenterer strukturen
Eksempler fra den rigtige ting, der plejede at få succes
For tydeligt at se, at Navigation af brødkrummer faktisk kan skabe et håndgribelige resultater. Jeg vil gerne dele et eksempel fra et af de "e-handelswebsteder", der sælger elektroniske enheder. Som havde stødt på et problem med bruger- og konverteringsfrekvens
Originalt problem: Brugeren er forvirret, Google forstår ikke.
Deres originale websted har ikke klare brødkrummer, eller er det bare en normal besked. Det kan ikke klikke på, når brugerne kommer ind i produktet direkte fra Google, de er ofte forvirrede over, hvilken kategori af dette produkt der er i. Eller vil vende tilbage for at se andre produkter i samme kategori som et resultat, forladelse af høj vogn, og de fleste brugere går ud af siden uden at udforske andre dele. På webstedet. Google selv ser det ud til at tage lang tid at gennemgå. Og rangerer ikke nogle sider så godt som det skal være
Metode: Installer Breadcrumps -navigation med skema -markering
Holdet besluttede at "revidere" den nye navigation. En af nøglen er at installere de korrekte brødkrummer -navigation. De fortsætter som følger:
- Webstedsstrukturanalyse: Oprettelse af en ny webstedsplan for at sikre, at der er et klart hierarki (såsom hovedsiden> Computer> Laptop> MacBook Pro)
- Ryd brødkrummerdesign: Placer brødkrummer i en klar position på toppen af produktet og siden. Brug skrifttypestørrelse og kontrasterende farver. Og tillader hvert link i brødkrummer at klikke
- Pilot med skema-markering: Tilføj brødkrumblist skema markering (JSON-LD) til alle funktioner. Der er en brødkrummer til at fortælle Google klart, at dette er strukturen på webstedet.
- Forbedre mobiloplevelse: Sørg for, at brødkrummer ikke hindrer mobilbrug. Og stadig let at læse og klikke på
Resultater: Salg, SEO er mærkbart bedre!
Efter brug af brødkrummer -navigation i kun et par måneder er resultatet:
- Konverteringsfrekvensen steg med 15%: Brugere kan let finde relaterede produkter og kategorier. Gør købsbeslutningen hurtigere
- Bookce Rate faldt med 8%: Brugere brugte længere på hjemmesiden. Og udforsk flere vinduer
- SEO -placeringen er bedre: Mange sider med produkter begyndte at vises som rig snippe i søgeresultaterne af Google (viser brødkrummer under linknavnet), hvilket gjorde linket mere interessant og mere sandsynligt at klikke. Trafik fra organisk søgning er steget tydeligt.
- Vognafgivelsesgraden er reduceret med 10%: Brugere rejser gennem processen med at vælge produkter lettere. Reducer muligheden for at smide kurve væk
Dette er et bevis på, at brødkrummer ikke kun er et "brødkrum", men et "værktøj", der er virkelig kraftfuldt på dit websted effektivitet.
Spørg om illustrationer: E-handelswebsted med klare brødkrummer med øgede salgsgrafer og google-søgeresultatikoner, der viser rigt uddrag.
Hvis du vil følge, hvad skal jeg gøre? (Kan bruges med det samme)
Klar til at opgradere dit websted med Breadcrumps -navigation, ikke? Dette er en simpel tjekliste, som du kan følge med det samme:
- Vurder din nuværende webstedsstruktur:
- Tegn en simpel webstedsplan. For at se det overordnede hierarki (hovedside> Kategori> Side/artikel)
- Angiv hvilken side der er hovedsiden foran mor og barn
- Vælg brødkrummerens position:
- Den bedste position er "toppen af hovedindholdet" (over H1 eller under navigationsmenuen)
- I tråd med den anbefalede praksis for velkendte brugere
- Designet og skabte brødkrummer:
- Brug let -forstået tekst: Sidnavnet i brødkrummer skal være det samme navn som det rigtige navn.
- Brug den rigtige adskillelse: såsom
>
eller/
- Lav linket. Klik: Alle dele af brødkrummer undtagen den aktuelle side. Bør være et link, der kan klikke tilbage til moderens ansigt eller hovedside
- Stiljustering: Brug CSS til at kontrollere størrelsen, farve og afstand for at se ren og let at læse. Forstyr ikke hovedindholdet
- installere Breadcumblist Schema Markup (JSON-LD):
- Dette er et vigtigt skridt for SEO.
- Hvis du bruger CMS som WordPress, kan der være et plugin (såsom Yoast SEO), der hjælper med at oprette et skema -markering automatisk.
- Hvis det er en webflow eller brugerdefineret kode, bliver du nødt til at sætte JSON-LD-koden i
Af hver side
- Eksempelkode:
{
"@context": "https://schema.org/",
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"name": "หน้าหลัก",
"item": "https://www.yourwebsite.com/"
},{
"@type": "ListItem",
"position": 2,
"name": "หมวดหมู่",
"item": "https://www.yourwebsite.com/category/"
},{
"@type": "ListItem",
"position": 3,
"name": "หน้าปัจจุบัน",
"item": "https://www.yourwebsite.com/category/current-page/"
}]
}
- Test og forbedring:
- Test på desktop og mobil: Kontroller, at brødkrummer viser resultaterne korrekt, smukt og let at bruge på alle enheder.
- Brug Google Rich Results Test : Kontroller, at din skema -markering er korrekt, og Google kan læse.
- Kontroller ødelagte links: Sørg for, at linket i brødkrummer ikke er brudt.
- Relateret internt link:
- Ud over at bruge brødkrummer, hjælper oprettelsen af et godt internt link i artikelindholdet også med at forbedre SEO, for eksempel kan du anbefale læserne at studere mere om at oprette en venlig FAQ -side, som kan være en del af din webstedsstruktur.
Denne tjekliste giver dig en venlig navigation af brødkrummer med både brugere og Google! Og hvis du har brug for hjælp fra UX/UI -eksperter til at designe komplekse strukturer eller gøre webstedet til at være mest effektivt, tøv ikke med at konsultere Vision X Brain UX/UI -eksperter for de bedste resultater
Spørg om illustrationer: Tjeklistebilleder, der har alle de korrekte mærker, repræsenterer let trinene.
Spørgsmål, som folk har en tendens til at undre sig, og de svar, der er ryddet
Efter at vi har lært om vigtigheden og metoden til at lave navigation af brødkrummer, tror jeg, at mange af jer stadig har nogle spørgsmål. Jeg har udarbejdet et populært spørgsmål med et klart svar.
Q1: Brødkrummer, er det nødvendigt for alle typer websteder?
A: I princippet "meget nødvendigt", især for websteder med komplicerede strukturer, er der mange underkategorier, såsom e-handelswebsteder, nyhedswebsteder, blogs med en række kategorier eller store websteder med meget indhold. For et lille websted med et par sider er brødkrummer muligvis ikke så meget. Men at have det er stadig bedre end ingen, fordi det altid hjælper UX
Spørgsmål 2: Brug af brødkrummer vil gøre vores interne links "duplikat"? Og vil Google tænke den spam?
A: Overhovedet ikke! Breadcrumbs er et af de interne links, som Google forstår og endda kan lide. Det forårsager ikke dobbeltarbejde på en beskadiget måde. Men det hjælper Google med at forstå hierarkiet og forholdet mellem vinduerne. På dit websted endnu bedre er brugen af brødkrumblistsskema -markering endnu mere bekræfter for Google, at dette er den rigtige og nyttige navigationsstruktur for brugerne.
Q3: Hvor skal jeg lægge brødkrummerne på websiden?
A: Den mest passende position er "toppen af hovedindholdet" eller "under hovednavigationsmenuen". Normalt er det under overskriften eller navigationslinjen på webstedet, fordi det er et sted, som brugerne er bekendt med og ser ud til at forstå, hvor de er på hjemmesiden. Placeringen i denne position hjælper også Google Bot -gennemsøgning og let at forstå.
Spørgsmål 4: Hvis vores websted har en side eller en artikel i mange kategorier på samme tid, hvordan skal Breadcrumbs gøre det?
A: Dette er en almindelig situation. Den bedste måde er "Vælg kun en hovedrute", der er den mest rimelige for dine brugere og din virksomhed, for eksempel, hvis et produkt er i kategorien "Shirt" og "Fremme", skal du vælge kategorien "Shirt" som hovedruten i brødkrummer, fordi det er hovedproduktstrukturen og bruger det interne link til at oprette forbindelse til siden "promovering", så det ikke er for kompliceret.
Q5: Har du værktøjer eller stik, der hjælper med at skabe brødkrummer i CMS, såsom WordPress let?
A: Selvfølgelig! For WordPress har det populære SEO -plugin, Yoast SEO eller Rank Math, funktioner til åbning og let indstillet brødkrummerne samt oprettelse af skema -markeringen automatisk. For webstrømmen eller et websted oprettet med den brugerdefinerede kode, skal du muligvis bruge yderligere kode til at skrive koden i sektionen. "Hvis du vil følge, hvad skal jeg gøre?"
Spørg efter illustrationer: Spørgsmål og svarboblebilleder, der flyder over Google -logoet og det smilende brugerikon som at modtage svar.
Resume for at være let at forstå + vil prøve at gøre
Hvordan har du det? Med historien "Breadcrumbs Navigation: Breadcricks, der hjælper både bruger og Google". Jeg håber, du nu forstår, hvordan denne lille navigation har "magt"!
Let at huske, at brødkrummer er den "sande ven" for både brugere og Google:
- For brugere: Det er et "livskort", der hjælper dem ikke tabt på dit websted. Ved du, hvor du er, og hvor kan du hen næste gang? Gør oplevelsen (UX) fremragende, indtil det ønsker at blive og vil købe
- For Google: Det er et "kompas", der hjælper Google Bot med at forstå hierarkiet på dit websted. Gør rangeringen (SEO) effektiv og hjælper også dit websted med at have mulighed for at vise det rige uddrag på søgeresultaterne!
Investeringer med det korrekte design og installation af brødkrummer er ikke kun en "lille" forbedring, men "investering", der vil skabe en masse belønning for dit websted, såsom den reducerede afvisningshastighed, den øgede opholdstid, konverteringsfrekvens og en bedre SEO -rang.
Vent ikke længere!
Jeg inviterer dig til at "gøre" fra i dag. Lad os gå tilbage og udforske dit websted for at se, om der er en brødkrummer? Hvis du har det, fungerer det godt nok? Hvis der stadig ikke er tid til at installere det alvorligt!
Start fra:
- Forstå din webstruktur.
- Det er klart og brødkrummerdesign
- Det vigtigste er "Glem ikke at placere brødkrumblist -skema -markering" for at fortælle Google tydeligt!
Hvis du føler, at det er kompliceret at gøre det selv, er det kompliceret eller vil have eksperter til at hjælpe med at passe fra begyndelsen til slutningen for at få et websted med en stærk struktur og imponerende konvertering, konsulter Webflow -eksperten til Vision X Brain gratis! Ingen forpligtelse! Vi er klar til at være en "partner", der vil hjælpe med at "oprette" dit websted. "Vejledning af brødflager", der fører brugerne til målet og tager din virksomhed til bæredygtig succes!
Spørg om illustrationer: Håndbilleder, der drysser brødflager på den klare rute på kortet med Google -logo og smilende brugerikoner.
Seneste blog

Sammenlign chok, chok mellem webflow og framer til opstart, der understreger åbningshastigheden, skønhed og skalaevne.

Webhastighed er ikke kun teknisk! I -dybde, at Core Web Vitals (LCP, INP, CLS) påvirker SEO -placering, brugeroplevelse og hvordan overskuddet på organisationsweb

Overse ikke sidefod! En samling af webstedsfoddesignteknikker, der hjælper med at forbedre UX, supplere SEO og ændre de besøgende til at blive føringen.