Domača » UI / UX » Oblikovanje zmagovalnih idej in navdihov v navigacijskem meniju

    Oblikovanje zmagovalnih idej in navdihov v navigacijskem meniju

    Navigacijski meni na spletni strani je kot cestni znak na ulici ali ravni imenik v nakupovalnem centru. Ne morete doseči svojega cilja, ne da bi prej vedeli, kje ste. Kot v resničnem življenju je navigacija v spletnem oblikovanju zelo pomembna in igra pomembno vlogo pri uporabnosti spletne strani kot tudi v uporabniški izkušnji.

    Danes si lahko ogledate veliko različnih vrst navigacijskih menijev z zanimivimi, kreativnimi in nenavadnimi modeli. Toda kako bi lahko videli učinkovito navigacijo na spletnem mestu; kako naj izgleda?

    Danes bi rad delil svoja opažanja in znanje o pomenu navigacije v spletnem oblikovanju. Pokazal vam bom nekaj preprostih nasvetov, ki jih lahko uporabite za izboljšanje navigacije in uporabnosti vaše spletne strani. Na voljo bodo tudi nekateri primeri učinkovitih navigacijskih menijev, ki vam bodo dali nekaj idej o tem, kako načrtovati vašo naslednjo zasnovo.

    Informacijska arhitektura

    Načrtovanje navigacije se mora začeti z informacijsko arhitekturo. Pomembno je, da se usedemo razmislite o informacijski arhitekturi spletnega mesta. Morate ugotoviti, kakšne funkcije ponuja spletna stran, kaj je najpomembnejše in kaj bi lahko dali na nižje ravni v hierarhiji informacij.

    Informacijska arhitektura vključuje funkcije, potrebe uporabnikov, kazalo, testiranje in žične mreže. Več o informacijski arhitekturi lahko preberete v članku Camerona Chapmana v informacijski arhitekturi 101: Tehnike in najboljše prakse.

    Uporaba tehnologij, ki jih omogočajo uporabniki

    Izogibajte se uporabi Flash, JavaScript, jQuery ali karkoli drugega, ki bi lahko oviralo dostop do navigacije na vaši spletni strani pri gradnji navigacijske vrstice, ali pa se vsaj prepričajte, da se lahko elegantno razgradijo..

    Za več referenc na elegantna degradacija javascripta, Oglejte si to objavo na 10 uporabnih rezervnih metodah za CSS in Javascript.

    Uporabite preproste, uporabniku prijazne izraze

    Bolje je uporabiti preprostih, očitnih in izrazov, ki jih je enostavno razbrati kot za industrijske izraze za navigacijski meni. Vsaka povezava, ki uporabnike vzame več kot sekundo ali dve, je verjetno neprimerna za uporabo.

    Če mora uporabnik klikniti na povezavo, da bi ugotovil, na kaj vodi povezava, bo to prispevalo k slabi uporabniški izkušnji za vaše obiskovalce.

    Primeri

    Pogoji v navigacijskem meniju spletne strani Larissa Ness so lahko razumljivi in ​​dovolj pogosti. Uporabniki ne bodo menili, da je to zmedeno, ker že imajo izkušnje s takimi meniji.

    Tukaj je še en dober primer čistega in jasnega navigacijskega menija spletnega mesta s splošnimi izrazi, ki se uporabljajo v storitvi csupport.

    Ustvarjalna agencija Eighty8Four uporablja izraz "razstavni prostor", ki lahko obiskovalcem zmede. Ta izraz lahko pomeni portfelj ali delo, vendar ni jasno in obiskovalci nimajo druge izbire, kot da kliknejo, da ga preverijo.

    Standardizirajte načrtovanje navigacije

    Uporabite isti navigacijski model na vseh straneh. To je zelo pomembno, ker brez doslednega oblikovanja lahko uporabnik dejansko misli, da je na drugi spletni strani. Prepričajte se, da uporabljate isti navigacijski model, da lahko uporabniki brez težav izgubijo vaše spletno mesto.

    Bluegg, spodaj, uporablja preprost in čist načrt navigacije, ki ostaja enak v vseh podstrani. Edina razlika je barvni indikator, ki prikazuje stran, na kateri je obiskovalec trenutno.

    Navedite, kje ste

    Pomembno je, da uporabnik ves čas ve, kje je. To lahko storite do spreminjanje ozadja povezave, barva imena strani ali obrnite besedilo krepko v navigacijskem meniju, da se razlikuje od drugih.

    Austin Eastciders uporablja drugo barvo in ozadje, da navede stran, na kateri je uporabnik. Ta indikator lahko deluje tudi kot subtilna sprememba zasnove, na primer z uporabo a različna ozadja navigacije ki ustvarja občutek, da so drugi elementi menija v globini.

    Medijska kirurgija uporablja temnejšo barvo kot indikator za odprto podstran. Enostavno, vendar učinkovito.

    Uporabite spletne konvencije

    Gre za preprosto in intuitivno navigacijo po spletnih straneh. Spletne konvencije oblikovalcem omogočajo veliko lažje delo s svojimi modeli. Večina uporabnikov bi kliknila na logotip spletne strani, da bi se vrnila na domačo stran, zato oblikujete svoj logotip.

    Če ne boste, prisilili ste jih, da preživijo čas, da se naučijo nekaj novega ali v nekaterih primerih povzročajo neprijetnosti, ker ne zagotavljajo tistega, kar pričakujejo, da bodo splošno sprejete navigacijske norme.

    Več o spletnih konvencijah lahko izveste tukaj:

    • 10 Konvencije o oblikovanju spletnih strani
    • Ne obnovi novega kolesa za spletno oblikovanje
    • Oblikovanje s spletnimi konvencijami

    Inject Design postavi logotip v zgornji levi kot, ki ustreza eni izmed najbolj uporabljenih spletnih konvencij danes.

    Adams Creation uporablja eno od najpogostejših spletnih konvencij - logotip se nahaja v levem zgornjem kotu spletne strani in povezav na domačo stran.

    Preizkusite: Vključite tretjo osebo

    Vedno preizkusite svoj načrt navigacije s katero koli osebo, ki je že uporabljala internet. Morda boste želeli priskrbeti ljudi, ki niso bili povezani s procesom oblikovanja, da bi ga testirali. Pri navigaciji upoštevajte njihove nastavitve prek spletnega mesta in analizirajte čas, ki je potreben, da najdejo strani, na katerih so iskali.

    Za boljšo natančnost, vključevati več ljudi, zbirati podatke, analizirati in povzemati za boljše prileganje. Opravite anketo po testu, če je to potrebno. Lahko dobite nekaj nepričakovanih zamisli in vnosov, ki bi bili sicer nevideni brez tega testnega teka.

    Navedite kontekst

    Če želite biti skladni z vašo vsebino in navigacijo, lahko uporabniki spletnega mesta hitro najdejo stvari, ki jih potrebujejo. Majhne ikone, povezane z vsebino, na katero se povezujete, ali kratke opise lahko postavite, če želite pregledati vsebino strani.

    Moj kolo uporablja preproste ikone, ki uporabnikom omogočajo več informacij o tem, kaj lahko najdejo v določeni podstrani.

    Sarah Parmenter uporablja kratke in lepe napise pod glavno navigacijo, da zagotovi nekaj informacij o podstrani, na katero se povezuje glavna navigacija.

    SEO namene

    Google všeč stalne navigacije. Dobro je, da imate dosledno navigacijo, ne samo za uporabnike, da razumejo in dobijo idejo o tem, kako krmariti po vaši spletni strani, ampak tudi za iskalnike za indeksiranje vaše spletne strani..

    Roboti iskalnikov bodo pregledali vašo spletno stran, da bi indeksirali vašo spletno stran in postavili povezave na strani z rezultati iskanja. Če želite biti vidni, bodite pozorni na dobro načrtovanje navigacije in več prometa.

    Prosti skripti za navigacijo (CSS in jQuery)

    Tukaj je kratek seznam najnovejših navigacijskih menijev, ki bi jih lahko uporabili za vaše projekte. Te skripte bodo uporabniku omogočile še boljše izkušnje z dodajanjem nekaterih lepih lastnosti in užitek pri uporabi.

    Vertikalne novice Scroller z navpičnimi novicami XML z uporabo HTML in jQuery: vScroller

    Filtrify

    Stran Scroller

    Timeline Portfolio

    HorizontalNav

    Meni minimalistične navigacije CSS3

    Učinek navigacije kroga s CSS3

    Učinki navigacije na omrežje z jQuery

    Ascensor

    Ustvarite eleganten navigacijski meni CSS3

    Predstavitev lepe horizontalne navigacije

    In nenazadnje nekateri navdihujoči meniji za horizontalno navigacijo. Preverite te neverjetne spletne strani in njihove rešitve navigacijskega menija, da boste našli nove ideje za vaše projekte.

    Ch3mical

    Bloom Search Marketing Inc.

    Alex Perez

    Libor Zezulka

    Hauska!

    Zlati otoki

    Neil Carpenter

    Marc Thomas

    3D polistiren

    Liechtenecker

    Svet pustolovščin

    Arbutusova fotografija

    OMDRL

    4 Pines Beer

    Lovska vina

    Upamo, da boste v tem članku našli koristen in informativen prispevek. Če imate kakšne misli ali se ne strinjate, prosimo, delite svoje mnenje v oddelku za komentarje.