Breadcrumb navigacijos geriausia praktika ir pavyzdžiai

Breadcrumb navigacija dažnai ignoruojama projektavimo ir kūrimo procese. Kai kurie žmonės gali tai matyti kaip nereikalingus, o kiti gali manyti, kad tai pernelyg didelė už tai, ko verta. Svarbus dalykas yra tai, kad plaukiojimas navigacija labai padidins svetainės tinkamumą naudoti.

Breadcrumbs suteikia naudotojams alternatyvų navigacijos būdą, leidžia jiems pamatyti, kur jie yra svetainės hierarchijoje, ir sumažins veiksmų, kurių reikia norint naršyti į aukštesnio lygio svetainę, skaičių.

Čia apibūdinti įvairūs šiandien naudojamų grūdų navigacijos tipai, kodėl jie yra svarbūs ir kaip jie turėtų būti geriausiai įgyvendinami internete. Čia taip pat yra jūsų nuoroda daugiau kaip 30 pavyzdžių, kaip šiandien vartojami duonos kepiniai.

Atminkite, kad, nors tikėtina, kad naršymas su naršykle nebus sukurtas ar pertraukiamas į svetainę, naudotojas turės daugiau naudos, nes padidins bendrą svetainės tinkamumą ir funkcionalumą.

Breadcrumb tipai

Kelias

Kelio pagrindu pagaminti rupiniai rodo veiksmus ar kelią, kurį vartotojas ėmėsi atvykti į dabartinį svetainės puslapį. Be to, naudotojai matys nuorodas į anksčiau aplankytus puslapius, kad pasiektų dabartinį puslapį. Iš trijų tipų naršymo būdų navigacija yra mažiausiai populiarus internete. Priežastis yra tai, kad maršruto pagrindu sukurta navigacinė sistema suteikia panašią funkciją “Persiųsti” ir “Atgal” mygtukai naršyklėje. Daugumoje svetainių navigacija pagal vietą ir atributų pagrindu suteikia geresnį funkcionalumą.

Vieta

Vietos pagrindu pagaminti rupiniai nurodo naudotojui, kuriame esamas puslapis yra svetainės hierarchijoje. Šis naršymo būdas dažniausiai rodomas svetainėse, kuriose yra daugiau nei du gylis ar turinys. Toliau einant į svetainės naudotojus, pateikiamos nuorodos į puslapius ar kategorijas, kurios veikia kaip a “tėvai” arba aukštyn nuo puslapio, kurį jie šiuo metu peržiūri. Pavyzdžiui, vartotojas gali būti “Kalbėkite” puslapyje, tačiau “Ką mes darom” puslapis yra tėvų “Kalbėkite” puslapyje, o “Namai” puslapis yra tėvų “Ką mes darom” puslapyje.

Clearleft Ltd.

Atributas

Atributų pagrindu pagaminti krumpliukai vartotojui nurodo atributus arba kategorijas, priskirtas dabartiniam tinklalapio puslapiui. Dažnai elektroninės prekybos svetainėse produktai gali būti ne tik priskirti kategorijai, bet ir tam tikriems atributams. Pavyzdžiui, transporto priemonė gali būti skirstoma į visureigį, po to turi būti juodos spalvos ir 2010 m..

Cars.com

Kodėl naudoti Breadcrumbs?

• Puikus naudojimas

  Breadcrumbs yra papildoma priemonė, kuria naudodamiesi vartotojai gali lengvai naršyti svetainėje. Jei naudotojas nukreipia į vidinį jūsų svetainės puslapį iš kito šaltinio, vartotojas galės tiksliai matyti, kur jie yra svetainės hierarchijoje. Naudotojui taip pat suteikiama galimybė bet kuriuo metu pereiti prie aukštesnio lygio svetainės, be jokių rūpesčių.

• Lengva nuvažiuoti

  Pirminės navigacijos nėra suprojektuotos taip, kad jas būtų galima stebėti atgal. Kadangi „backtracking“ yra labai populiarus internete, šiek tiek papildoma pagalba gali eiti ilgą kelią.

• Pašalinkite papildomus paspaudimus

  Breadcrumbs leidžia vartotojams pereiti iš vieno svetainės lygio į kitą, nenaudojant “Persiųsti” arba “atgal” naršyklės mygtukai. Be to, rupiniai pašalina poreikį vartotojams nuolat naudotis pagrindine navigacija.

• Rodo naudotojų hierarchiją

  Pirminė svetainės navigacija neatspindės kiekvieno svetainės puslapio hierarchijos. Suteikiant naudotojams duoną, jie galės matyti tinklalapio puslapio hierarchiją.

• Vizualiai malonus

  Ne tik duonos skrebučiai suteikia vartotojams papildomą naudojimą, bet ir tai daro be puslapio ar vietos. Breadcrumbs yra lengva įdiegti į savo svetainės vizualinį dizainą ir suteikia didelę naudą vartotojams.

• Pateikiama papildoma pagalba

  Visiškai įmanoma, kad kai kurie vartotojai nesupranta, kaip veikia pagrindinė svetainės navigacija, o kai kuriais atvejais naudotojai gali net nežino, ko jie ieško. Suteikiant naudotojams duoną, jie galės matyti bendrą svetainės pažangą ir struktūrą, kad jie galėtų geriau naršyti svetainėje.

• Mažesni atmetimo rodikliai

  Paprastai riešutai suteiks išsamesnę navigaciją nei pirminė navigacija. Taip naudotojams bus suteikta daugiau galimybių naršyti svetainėje. Suteikdami jiems galimybę lengvai stebėti kelis svetainės puslapius, bus sumažintas jūsų atšokimo lygis.

• Sukuria susidomėjimą

  Kai vartotojas nusileidžia į vidinį svetainės puslapį, šansai yra jau dominančiame puslapyje. Breadcrumbs gali pateikti nuorodas į papildomus puslapius ir informaciją, apie kurią vartotojas taip pat domina, nepradėdamas jų pradėti nuo kvadratinių.

Breadcrumb Best Practices

• Naudokite „Breadcrumbs“ puslapio viršuje

  Dažniausiai ir instinktuojanti riešutų vieta yra puslapio viršuje. Tai leidžia vartotojams lengvai surasti rupinius ir juos naudoti.

• Naudokite „Breadcrumbs“ nuosekliai

  Jei nuspręsite naudoti duonos kepalus, įsitikinkite, kad juos naudosite visoje svetainėje. Suteikiant naudotojams duonos mėsą kai kuriuose puslapiuose, o ne kitiems, jie tik suklaidins ir sužlugdys juos. (Vienas geriausių pavyzdžių yra „Amazon“, nes jie pašalina duonos skonį iš atskirų produktų puslapių.)

• Breadcrumbs turėtų sugadinti gražiai

  „Breadcrumbs“ visada turėtų būti pradedamas nuo pagrindinio puslapio ir nuleidžiamas į dabartinį puslapį. Tai darydami jūsų duonos riešutai turi pereiti nuo aukščiausio lygio iki žemiausio lygio vienu žingsniu vienu metu.

• Stilizuoti Breadcrumbs tinkamai

  Norite matyti, kad jūsų duonos mėsos būtų matomos, tačiau nenorite, kad jos taptų pagrindiniu tašku. Taip pat norite, kad būtų akivaizdu, jog jūsų skrudai nėra pagrindinio puslapio dalis, tik papildoma parama. Raskite laimingą laikmeną, kurioje jūsų rupiniai yra pastebimi, tačiau ne per daug.

• Puslapių kategorizavimas aiškiai

  Jei turite puslapių, kurie priskiriami dviem ar daugiau kategorijų, galite nenorėti, kad jūsų svetainėje būtų galima naudoti kepinius. Bandant įdėti puslapį į dvi ar daugiau kategorijų, tikėtina, kad bus sukurta tik neaiški rupiniai ir galvosūkis. Įsitikinkite, kad jūsų svetainė turi organizuotą hierarchiją ir yra rodoma atitinkamai per jūsų skanėstus.

• Aiškiai atskirti kiekvieną lygį

  Įsitikinkite, kad naudotojai gali atskirti skirtumą tarp kiekvieno skalavimo lygio. Dažniausias lygių atskyriklis yra „didesnis nei“ simbolis (>). Kiti geri atskyrikliai apima teisingas dvigubo kampo kainas (»), brūkšnius (/) ir rodykles (→). Jei naudojate paprastą tekstą, naudokite tik vieną. (»Yra patrauklesnis ir veiksmingesnis už >>)

• Išskirti dabartinį puslapį

  Jei norite nustatyti, kad jis yra šiuo metu rodomas puslapis, naudokite kitą stilių, esantį paskutiniame įrašų sąrašo elemente. Tai galite atlikti atlikdami elementą paryškinti, keisti jo spalvą, arba pabrėžiant ji.

• Nesukurkite dabartinio puslapio nuoroda

  Nereikia, kad paskutinis elementas būtų įtrauktas į nuorodą, nes jis yra dabartinis puslapis. Čia sukuriama nuoroda suklaidins vartotojus, ypač kai jie spustelės jį ir nebus perkeliami į naują puslapį.

• Nenaudokite „Breadcrumbs“ kaip puslapio antraštės

  Naudojant paskutinį ištraukos sąrašo elementą kaip dabartinio puslapio antraštė yra neveiksminga. Jei nuspręsite naudoti duonos kepalus, tai darykite kartu su puslapio antrašte.

• Breadcrumbs Negalima pakeisti pirminės navigacijos

  Breadcrumbs turi būti naudojami tik kaip pagrindinės navigacijos palaikymas, niekada nepakeičiant pirminės navigacijos. Visada turėtumėte pateikti naudotojams pirminę navigaciją, iš kurios jie gali naršyti svetainėje, prieš naudodamiesi klavišų navigacija.

Didieji Breadcrumbs pavyzdžiai

„Vitra Direct“

Trek Bikes

Illy

„SiteInspire“

Mia ir Maggie

Intridea

Žmonių projektavimas

Roxy

Blik

„SitePoint“

Tikslas

Walmart

1-800-Gėlės

BestBuy

„Amazon.com“

Barns & Noble

Žemės pabaiga

Apple

„Google“

Vytis

AbsolutePunk.net

Littman Bros. Apšvietimas

Guardian.co.uk

ERDVĖ 17

Wufoo

Vidurio Tenesio mergaičių skautai

Glazgo kolektyvas

Pirmagimis

Bell Kanada

Grooveshark

Devlounge

Apie autorių - Shay Howe yra profesionalus interneto ir vartotojo sąsajos dizaineris, šiuo metu gyvena Čikagoje, IL. Jis rašo apie žiniatinklio dizainą savo dienoraštyje per „letscounthedays“ ir norėčiau išgirsti iš jūsų „Twitter“. Nedvejodami pasakykite jam sveiki!