Proiectarea unei idei și inspirații pentru meniul de navigare câștigătoare
Meniul de navigare de pe un site Web este ca un semn rutier pe o stradă sau un director de nivel într-un mall. Nu puteți ajunge la destinație fără să știți unde vă aflați. La fel ca în viața reală, navigarea în designul web este foarte importantă și joacă un rol major în utilizarea site-ului, precum și în experiența utilizatorului.
În zilele noastre puteți vedea o mulțime de diferite tipuri de meniuri de navigare cu modele interesante, creative și neobișnuite. Dar cum despre navigarea eficientă într-un site web, cum ar arăta; cum ar trebui să arate?
Astăzi aș dori să împărtășesc observațiile și cunoștințele mele despre importanța navigației în designul web. Voi dezvălui câteva sfaturi simple pe care le puteți utiliza pentru a vă îmbunătăți navigarea și folosirea site-ului web. Vor fi de asemenea câteva exemple de meniuri de navigare eficiente pentru a vă oferi o idee despre cum să vă planificați următorul design.
Arhitectura informațională
Planificarea navigației ar trebui să înceapă cu arhitectura informațiilor. Este vital să stai jos și brainstorm despre arhitectura de informații a unui site web. Trebuie să vă dați seama ce fel de caracteristici oferă site-ul web, ceea ce este cel mai important și care ar putea fi plasat în niveluri inferioare în ierarhia de informații.
Arhitectura informațiilor include caracteristici, nevoile utilizatorilor, sitemap-ul, testele și firele de rețea. Puteți citi mai multe despre arhitectura informațiilor în articolul lui Cameron Chapman, în Arhitectura informațională 101: Tehnici și bune practici.
Utilizarea tehnologiilor activate de utilizatori
Evitați utilizarea Flash, JavaScript, jQuery sau altceva care riscă să împiedice accesul la navigarea site-ului dvs. în construirea barei de navigare sau cel puțin să vă asigurați că este capabil să se degradeze cu grație.
Pentru mai multe referințe pe grave degradare a javascript-ului, verificați acest post pe 10 metode utile de cădere pentru CSS și Javascript.
Utilizați termeni simpli, ușor de utilizat
Este mai bine să o utilizați simple, evidente și termeni ușor de înțeles decât să păstrați termenii numai pentru industrie pentru meniul de navigare. Orice legătură care ia mai mult de o secundă sau două utilizatori pentru a descoperi este, probabil, nepotrivită pentru utilizare.
Dacă un utilizator trebuie să facă clic pe un link pentru a determina ce duce la acesta, acest lucru va contribui la o experiență nefavorabilă a utilizatorilor pentru vizitatorii dvs..
Exemple
Termenii din meniul de navigare al site-ului Larissa Ness sunt ușor de înțeles și destul de obișnuiți. Utilizatorii nu vor găsi confuz, deoarece au deja experiență cu meniuri de genul asta.
Iată un alt exemplu bun de meniu de navigare curat și clar, cu termeni utilizați în comun, la csupport.
Agenția de creație Eighty8Four utilizează termenul "showroom", care poate fi confuz pentru vizitatori. Acest termen ar putea însemna portofoliu sau muncă, dar nu este clar și vizitatorii nu au de ales decât să facă clic pentru a verifica.
Standardizați designul de navigație
Utilizați același model de navigare în toate paginile dvs. Este foarte important pentru că, fără un design consistent, un utilizator poate crede că el este într-un alt site web. Asigurați-vă că utilizați același model de navigare, astfel încât utilizatorii să poată merge cu ușurință în legătură cu site-ul dvs. fără a fi pierduți.
Bluegg, prezentat mai jos, utilizează un design simplu și curat de navigare, care rămâne același în toate subpaginile. Singura diferență este indicatorul de culori, care arată pagina în care vizitatorul se află în prezent.
Indicați unde vă aflați
Este esențial să îi lăsați pe utilizator să știe unde este în orice moment. Puteți face asta prin schimbarea fundalului liniei, culoarea numelui paginii sau rotiți textul în caractere aldine în meniul de navigare, pentru al face diferit de ceilalți.
Austin Eastciders utilizează o altă culoare și un fundal diferit pentru a indica pagina pe care este utilizatorul activat. Acest indicator poate funcționa, de asemenea, ca o modificare subtilă a proiectului, de exemplu, prin utilizarea unui a fundal de navigație diferit care creează sentimentul că alte elemente de meniu sunt în profunzime.
Chirurgie media utilizează o culoare mai închisă ca indicator pentru o subpagină deschisă. Simplu dar eficient.
Utilizați convențiile web
Este vorba despre navigare ușor de utilizat și intuitivă. Concepțiile web fac mult mai ușor pentru designeri să lucreze în jurul proiectelor lor. Cei mai mulți utilizatori ar face clic pe sigla site-ului web pentru a reveni la pagina de pornire, așa că proiectați logo-ul dvs. pentru a face acest lucru.
Dacă nu, le faceti sa petreaca timp pentru a invata ceva nou sau în unele cazuri, inconvenientele acestora prin faptul că nu oferă ceea ce se așteaptă să fie norme de navigație obișnuite acceptate.
Puteți afla mai multe despre convențiile web aici:
- 10 convenții de proiectare web
- Nu reintroduceți roata Design Web
- Design cu convenții Web
Injectați design plasează sigla în colțul din stânga sus, care se potrivește astăzi uneia dintre cele mai utilizate convenții web.
Adams Creation utilizează una dintre cele mai comune convenții web - logo-ul este plasat în colțul din stânga sus al site-ului și se leagă de pagina de pornire.
Testați-o: implicați o terță parte
Verificați întotdeauna designul dvs. de navigație cu orice persoană care a folosit Internetul înainte. S-ar putea să doriți să aduceți persoane care nu au legătură cu procesul de proiectare pentru a le testa. Respectați preferințele atunci când navighează prin intermediul site-ului dvs. și să analizați timpul necesar pentru ca aceștia să găsească paginile pe care le căutau.
Pentru o precizie mai bună, implică mai mulți oameni, colectează datele, analizează și rezumă pentru o mai bună potrivire. Faceți un sondaj după test dacă este necesar. Puteți obține câteva idei și intrări neașteptate, care altfel ar fi nedetectate fără acest test.
Oferiți context
Pentru a fi în concordanță cu conținutul dvs. și cu navigația, furnizați un anumit context utilizatorilor site-ului pentru a găsi rapid lucrurile de care au nevoie. Puteți plasa mici pictograme legate de conținutul la care vă conectați sau scurte descrieri pentru a oferi o imagine de ansamblu asupra a ceea ce este pagina despre.
Bicicleta mea proprie utilizează simboluri simple pentru a oferi utilizatorilor mai multe informații despre ceea ce pot găsi în anumite subpagini.
Sarah Parmenter utilizează subtitrări scurte și frumoase sub navigarea principală pentru a furniza informații despre subpaginile la care se leagă navigația principală.
Scopuri SEO
Google îi place navigarea consecventă. Este bine să aveți navigare consecventă nu numai pentru ca utilizatorii să înțeleagă și să obțină ideea de navigare prin site-ul dvs. Web, dar și pentru motoarele de căutare pentru a indexa site-ul dvs..
Roboții din motoarele de căutare se vor accesa cu crawlere prin site-ul dvs. web pentru a-ți indexa site-ul și pentru a pune link-urile în pagina cu rezultatele motorului de căutare. Dacă doriți să fiți vizibili, acordați atenție unui design bun de navigație și obțineți mai mult trafic.
Scripturi gratuite de navigare (CSS și jQuery)
Iată o scurtă listă a celor mai recente meniuri de navigare pe care le-ați putea folosi pentru proiectele dvs. Aceste scripturi vor face expereriența utilizatorului dvs. chiar mai bună adăugând câteva caracteristici frumoase și făcându-l plăcut de utilizat.
XML-driven Vertical News Scroller Script folosind HTML și jQuery: vScroller
Filtrify
Scroller de pagină
Portofoliul de timp
HorizontalNav
CSS3 Meniu de navigare minimalistă
Efecte de navigare cu CSS3
Efecte de navigare în rețea cu jQuery
ascensor
Creați un meniu elegant de navigare CSS3
Arată o frumoasă navigație orizontală
Și nu în ultimul rând câteva meniuri de navigație orizontale. Verificați aceste site-uri uimitoare și soluțiile lor de navigare pentru a găsi noi idei pentru proiectele dvs..
Ch3mical
Bloom Search Marketing Inc.
Alex Perez
Libor Zezulka
Hauska!
Insulele de aur
Neil Carpenter
Marc Thomas
3D Polistiren
Liechtenecker
Lumea aventurilor
Arbutus Fotografie
OMDRL
4 Pini Bere
Vânătorii de vinuri
Sperăm că veți găsi acest articol util și informativ. Dacă aveți vreo idee sau dacă nu sunteți de acord, vă rugăm să vă împărtășiți opinia în secțiunea de comentarii.