Principii de navigare în spațiul web. Crearea navigației

În acest articol ne vom uita la modalități interesante de proiectare a navigației care sunt folosite astăzi. Unele dintre ele sunt folosite de mult timp, altele sunt o nouă privire asupra navigației pe site, iar altele sunt șabloane ușor modificate folosite pentru a crea contextul corect al resurselor.

Acesta este un șablon de navigare clasic. Este o listă de link-uri situate în partea de sus a paginii orizontal sau vertical. Această metodă nu va înceta niciodată să fie relevantă.

Acest tip de navigare funcționează cel mai bine pe site-uri mici unde există doar câteva elemente în navigare.

Exemple:

Navigare ascunsă

Acest tip de navigare este adesea folosit pe dispozitivele mobile, contribuind la economisirea spațiului. De multe ori are sens să ascunzi un astfel de meniu în spatele unui singur buton (meniu hamburger). Unii designeri folosesc acest meniu pentru a ascunde chiar și un număr mic de link-uri.

În cazul, de exemplu, Awwwards(), ascunderea elementelor de meniu are de fapt sens, deoarece... site-ul lor web conține un meniu complex care ocupă destul de mult spațiu pe ecran.

Alte exemple:

Navigație hibridă

Pe site-urile web mari, și în special în aplicațiile mobile, este adesea necesar să folosiți mai multe forme de navigare. De exemplu, ascundeți o fereastră de navigare separată în spatele pictogramei hamburger.

Site-urile din această categorie folosesc adesea navigarea în partea de jos a paginii (subsol). Uneori, o astfel de navigare pur și simplu copiază elemente din partea de sus a site-ului, făcându-l mai convenabil. În alte cazuri, subsolul conține navigare secundară care este utilă unui număr limitat de utilizatori.

Exemple:

Sistem de navigare

De exemplu, uitați-vă la aproape orice site de știri sau Pinterest. Aici intervine acest tip de navigare.

Este folosit pentru a prezenta utilizatorilor postări clasificate și alte colecții de informații. Daca informatiile de pe site sunt distribuite pe subiecte, date, tag-uri, aceasta metoda de navigare este pentru tine.

Exemple:

Navigare experimentală

Acesta nu este un șablon separat, ci o întreagă colecție. Poate fi numită „Navigarea în portofoliu”, deoarece această navigare este folosită cel mai adesea pe site-urile de portofoliu unde designerii simt libertatea deplină a creativității lor. Astfel de site-uri se caracterizează de obicei prin absența unui meniu tradițional sau prin împrăștierea elementelor de meniu pe întreaga pagină.

Eficacitatea unui proiect web, posibilitatea de a genera venituri sau profit din site, este direct proporțională cu sistemul de navigare de pe acesta. Navigarea pe site se află în centrul designului web holistic, împreună cu aspectul și structura site-ului. Indiferent de navigația pe care o alegeți pentru proiect, puțină dragoste și creativitate nu vă vor dăuna, ci mai degrabă vă vor lăsa doar emoții plăcute de la călătoria prin site. Astăzi ne vom uita la diverse exemple de navigare.

Cele mai populare și încă relevante „ghiduri” pentru site-uri sunt răsturnări (din rollover-ul englezesc). Ele pot fi redate cu grafică sau pur și simplu reprezintă un hyperlink text. Rollover-urile, de regulă, ajută utilizatorul să răspundă la întrebarea „Unde am fost înainte?”

Navigarea pe site poate fi verticală, orizontală și combinată. Indiferent de alegerea tipului de navigare, dacă acesta conține principalul lucru - logica, puteți încuraja vizitatorii să vizualizeze acele pagini ale site-ului pe care proprietarul însuși le consideră prioritare. Un sistem de navigare bine conceput permite utilizatorului să navigheze pe site fără să se gândească la acțiunile sale.

Navigarea convenabilă este:

  • posibilitatea de a ajunge la cele mai importante pagini ale site-ului cu un singur clic;
  • maxim trei clicuri pentru a trece de la sursă la pagina dorită de pe site;
  • utilizarea elementelor de navigație standard și general acceptate;
  • evidențierea vizuală și eficacitatea elementelor de navigație;
  • capacitatea utilizatorului de a ajunge la pagina de care are nevoie în mai multe moduri (duplicarea elementelor de navigare).

Indiferent de navigația pe care o alegeți pentru proiect, puțină dragoste și creativitate nu vă vor dăuna, ci mai degrabă vă vor lăsa doar emoții plăcute de la călătoria prin site.Portofoliul online al unui fotograf sub formă de carte. Butoanele pătrate multicolore servesc ca o tranziție către paginile site-ului, iar un ventilator răsfoiește paginile. Acesta este unul dintre puținele cazuri în care așteptarea încărcării paginilor nu este deloc plictisitoare.

Web design din Ucraina. Vă puteți bucura de desktop cu elemente de navigare pentru totdeauna.

Site-ul web al actriței Sarah Hyland este o reflectare fidelă a personalității sale. Schițele folosite ca meniuri sunt perfecte pentru această pagină!

Nu trebuie să înțelegeți limba spaniolă pentru a aprecia partea estetică a meniului desenat manual al acestui site. O „neglijență” plăcută conferă proiectului extravaganță.

Agenția de creație este originală în toate. Meniu de navigare sub forma unei scale de măsurare.

Un site web vibrant al agenției de turism, cu un meniu la fel de colorat și memorabil.

Un site neobișnuit pentru un bărbat cu un hobby neobișnuit. Proiect web al unui cartograf amator.

Elementele de meniu par a fi desenate manual, nu?

Nu degeaba elementele de meniu sunt indicate prin pictograme, deoarece acest proiect este dedicat pictogramelor pentru site-uri web.

Proiect pe internet pentru postarea unui portofoliu. Când faceți clic pe oricare dintre elementele de meniu, imaginea „se retrage”.

O altă prezentare originală de meniu.

Totul ingenios este simplu.

Nu un meniu, ci un mozaic complet. Neobișnuit și practic.

Fiecare figură de pe pagină ascunde ceva.

Un site de proiecte gata făcute de case și cabane cu materiale vizuale, accesul la care se realizează cu un singur clic.

Cel mai original studio realizat manual.

PRELEZA 1.

BAZELE WEB: SITE-URI, NAVIGATOARE ȘI NAVIGARE

Acest curs este pentru cei care sunt hotărâți să stăpânească HTML (limbajul designului site-ului web) și, cel mai important, să adopte acele reguli de design care nu numai că măresc numărul de vizitatori ai paginilor hipertext, dar și îmbunătățesc „ecologia” globală. reteaua de informatii. În lumea modernă, a izbucnit un adevărat boom de creare de site-uri web. Fiecare are propriile pagini pe Internet: agenții guvernamentale, companii mari, mici antreprenori, magazine, biblioteci, școli, grădinițe, creșe, președintele Rusiei și Pyotr Myachikov. Probabil că și tu te gândești la asta!

Serios, de ce nu? Toată lumea este binevenită pe internet! Și tu îți poți construi propria casă virtuală. Sau, împreună cu prietenii, creați un cuib confortabil pentru școala dvs. și apoi mergeți să ne vizitați.

Ce cunoștințe și abilități trebuie să aveți pentru a stăpâni cu succes cursul propus?

Se presupune că un designer începător poate:

Ø lansarea si inchiderea unei aplicatii informatice;

Ø comutați între ferestrele aplicațiilor de pe ecran și transferați informații prin clipboard de la o fereastră la alta;

Ø scrie si edita texte pe calculator;

Ø editarea informatiilor grafice;

Ø bine, și alte lucruri din bagajele obișnuite ale unui utilizator de computer de acasă.

Nu se presupun cunoștințe anterioare de HTML, design de site-uri web, design sau programare.

Prima prelegere conține material introductiv. Descrie spațiul web pentru un utilizator începător - o persoană care, ținând pasul cu progresul tehnologic, intenționează să folosească Internetul în activitățile sale zilnice.


Conceptul de spațiu web

Spațiu web este o colecție globală de site-uri. Site-ul este situat pe un server, serverele sunt conectate între ele folosind canale de comunicare.

Conceptul site-ului web

Site-ul web este o colecție de pagini hipertext (de obicei având o structură arborescentă) pentru a reprezenta o întreprindere, o firmă (site-uri corporative), pentru a reprezenta școli (site-uri școlare), private

persoane (site-uri personale). Site-ul poate desfășura comerț (magazine online), poate oferi servicii de informare (site-uri de căutare de informații,

biblioteci, sisteme de referință, liste de corespondență, instruire). În lumea modernă, un site web devine o carte de vizită atât a unei organizații, cât și a unui individ.

Paginile de hipertext care alcătuiesc site-ul sunt scrise într-un limbaj special, HTML (Hyper Text Markup Language - „HTML”, sau „ash-TE-EM-EL”, se folosește transcrierea în engleză sau latină). Acest limbaj nu este, strict vorbind, un limbaj de programare, deși este interpretat de browser. Instrumentele HTML sunt folosite pentru a instrui browserul sub ce formă să afișeze textul și graficele pe ecran și, de asemenea, vă permit să scrieți hyperlinkuri pe pagini.

Marcajul HTML (spre deosebire de, de exemplu, marcajul Word) este destul de tolerant cu diferite platforme, sisteme de operare și puterea computerului. Acest lucru vă permite să îl utilizați ca bază pentru construirea de site-uri web pe Internet, unde varietatea de platforme, sisteme de operare și computere este foarte mare.

Site-urile web sunt vizualizate folosind un browser - un program special de calculator.

Hyperlink este o zonă sensibilă de pe ecran. Când faceți clic pe o astfel de zonă, are loc o tranziție hipertext - browserul încarcă o altă pagină (poate fi localizată pe orice server de pe World Wide Web).

Zona sensibilă poate fi o bucată de text (de obicei evidențiată cu albastru și subliniată), o imagine sau un fragment dintr-o imagine. Când cursorul mouse-ului intră în zona de efect a hyperlinkului, este ușor de văzut - își schimbă forma într-un deget arătător.

Vizualizați site-ul

Pentru a vizualiza paginile site-ului, se folosește un program special de vizualizare - un browser. Browserul interpretează instrucțiunile scrise de dezvoltatori într-un fișier text simplu (extensii standard htm și html) și afișează documentul pe ecran.

Varietate de browsere Documentele hypertext moderne sunt din ce în ce mai dotate cu instrumente multimedia: grafică de înaltă rezoluție, sunet, video, diverse efecte speciale, interactivitate (dialog cu utilizatorul).

În consecință, dezvoltatorii de browsere adaugă suport pentru aceste noi tehnologii hipertext la produsele lor.

Cu toate acestea, există browsere care nu acceptă deloc grafica, cum ar fi browserul de text Lynx. Browserul vocal pwWebSpeek este conceput pentru persoanele nevăzătoare. Astfel de oameni nu văd imaginea, dar își fac o idee despre ea auzind descrierea acesteia. Există browsere care folosesc I/O Braille tactile. Unii utilizatori accesează Web-ul prin telefon. Acesta este modul în care funcționează sistemul Web-on-Call Voice Browser, de exemplu.

Recent, a devenit la modă să ai în mașină un computer de bord cu conexiune la internet. Deoarece ochii utilizatorului sunt ocupați cu drumul, un sintetizator de vorbire este conectat la browser.

Dintre numărul mare de browsere existente, cel mai popular este Microsoft Internet Explorer (aproximativ 90% dintre utilizatori). Super-popularitatea sa se datorează în principal faptului că acest browser face parte din sistemul de operare Windows și, prin urmare, nu necesită instrumente suplimentare sau efort de instalare pe computer.


Gestionarea Microsoft Internet Explorer (versiunea 6.0)

Când lansați browserul, se deschide o fereastră (Fig. 1), care conține:

Ø titlul ferestrei;

Ø meniul principal;

Ø bara de instrumente;

Ø panou de adrese;

Ø zona de lucru ferestre (în ea este afișată o pagină web);

Ø bara de stare.

Orez. 1. Fereastra browserului

Introducerea unei adrese

Adresa unui document (pagina de hipertext) din rețea - URL (Locație uniformă a resurselor, localizator universal de resurse) - este scrisă în bara de adrese a browserului. Pentru a introduce o adresă, trebuie să faceți clic pe bara de adrese și să introduceți adresa URL a documentului în ea de la tastatură, de exemplu, http://www. *****

Citind pagina

Pagina încărcată (documentul) poate conține informații prezentate sub formă de text împreună cu imagini (mai rar sunet și video). După activarea unui hyperlink într-un document, se descarcă un alt document, care poate fi localizat pe același sau pe alt server de rețea. Deoarece internetul este lent, încărcarea unei pagini poate dura de la câteva secunde la câteva minute (în funcție de dimensiunea paginii, viteza canalului de comunicare și stabilitatea rețelei în momentul vizionării).

Legăturile text dintr-un document au de obicei două evidențieri în același timp: albastru și subliniat. Când legătura este activată, culoarea sa se schimbă în roșu. Link-ul vă informează că începe să funcționeze. Dacă linkul a fost deja făcut clic, culoarea acestuia devine mai dezactivată (violet).

Utilizarea diferitelor culori pentru afișarea hyperlink-urilor permite o mai bună orientare atunci când navigați pe site-uri web. De exemplu, un document poate avea mai multe link-uri diferite către aceeași pagină. Vizualizarea unui document folosind orice link va „colora” toate linkurile către acesta în violet, ceea ce este un indiciu pentru utilizator despre locurile de pe site care au fost deja vizitate.

În designul modern al site-urilor web, se folosește adesea o altă tehnică de proiectare a hyperlinkurilor: textul sensibil este evidențiat în culoare, iar sublinierea apare doar atunci când cursorul trece peste link.

Nu trebuie să uităm că un link poate fi și o imagine (de exemplu, realizată sub formă de buton). Un indiciu clar că o zonă a paginii este un link este atunci când cursorul se transformă într-un deget arătător atunci când trece cu mouse-ul peste zona sensibilă.

Meniul principal al browserului

Fişier

Operațiuni de bază ale meniului Fișier (Fig. 2):

Ø scrierea paginii curente pe disc;

Ø Imprimarea paginii curente.

Orez. 2. Meniul Fișier

Edita

Meniul Edit vă permite să efectuați operațiuni (Fig. 3):

Ø copierea elementelor selectate în clipboard-ul Windows;

Ø cauta pe pagina curenta.

Orez. 3. Meniul Editare

Meniul Vizualizare vă permite să efectuați operațiuni (Fig. 4):

Ø gestionarea aspectului browserului;

Ø alegerea codificării și mărimii fontului;

Ø vizualizarea codului HTML al paginii;

Ø opri incarcarea paginii;

Orez. 4. Meniul Vizualizare

Favorite

Vă permite să lucrați cu „marcaje” (adresele paginilor memorate de utilizator).

Serviciu

Meniul Service permite (Fig. 5):

Ø configurati-va browserul;

Ø apelati la servicii suplimentare.

Orez. 5. Serviciu meniu

Referinţă

Acces la informații de referință.

Bara de instrumente

Bara de instrumente (Fig. 6) include butoane pentru comenzile utilizate frecvent (acestea duplică elementele din meniul principal).

Orez. 6. Bara de instrumente browser

Butoanele Înapoi și Înainte

Browserul stochează „calea” de-a lungul căreia utilizatorul vizualizează paginile. Butoanele Înapoi și Înainte vă permit să vă deplasați înapoi și, respectiv, înainte prin această poveste.

Buton de oprire

Când un document nu se încarcă mult timp (probleme de server), utilizatorul se răzgândește sau înțelege de la primele rânduri că documentul nu este necesar, puteți face clic pe

Butonul „Actualizare”.

Această comandă ajută uneori atunci când descărcarea durează în mod evident (defecțiune de rețea sau server). Cu toate acestea, acest buton este cel mai des folosit de dezvoltatorii web pentru a vedea modificările după editarea unui fișier htm.

butonul Acasă

Acest buton încarcă pagina „de pornire” a browserului, cea pe care browserul o încarcă automat la pornire. Pagina „de pornire” este setată de utilizator în setările browserului.

Butonul de căutare

Butonul Favorite

Adăugați un marcaj la pagina curentă sau încărcați un document folosind un marcaj existent.

butonul Imprimare

Imprimă pagina curentă.

Personalizarea Barei de instrumente

Panoul de setări poate fi accesat prin meniul View/Toolbars/Personalizare (sau făcând clic dreapta pe bara de instrumente):

Orez. 7. Fereastra de setări a barei de instrumente

Bara de instrumente (dreapta) poate fi modelată după cum doriți, folosind presetări (stânga).

Setări browser

Panoul de setări este apelat prin elementul Instrumente/Opțiuni Internet din meniul principal.

Tab. General

Vederea filelor este prezentată în Fig. 1.8.

Orez. 8. Fila General a panoului de setări browser

Pagina de start

Setați introducând (copiind) adresa URL dorită în câmpul „Adresă”.

Fila „Avansat”.

Secțiunea „Multimedia”.

Dacă sunteți interesat doar de informațiile text ale paginii și nu doriți să cheltuiți timp și bani pe grafică, debifați caseta din linia „Afișează imagini”.

Orez. 9. Elementul „Afișează imagini”

fila „Programe”.

În câmpul „Editor HTML”, setați „editor de text „Bloc de note”.

Orez. 10. Editor Notepad pentru vizualizarea rapidă a codului paginii

Costul vizualizării site-ului

Diferiți furnizori percep taxe diferite pentru utilizarea rețelei. Unele se încarcă în kilobyte, altele în funcție de momentul conexiunii la Internet. În orice caz, dimensiunea kilobyte a unei pagini este direct proporțională cu numărul de copeici necesari pentru a o vizualiza.

Structura site-ului

Să ne uităm la structura site-ului folosind un exemplu

Într-o fereastră de browser cu un site încărcat, puteți evidenția următoarele elemente importante (Fig. 11):

Ø Titlul ferestrei. Titlul ferestrei este același cu titlul paginii.

Ø Titlul site-ului. Situat chiar în partea de sus a paginii.

Ø Logo. De obicei, se află în colțul din stânga sus al paginii. Pe paginile a doua, sigla este un link către pagina principală (de pornire).

Ø Meniul de navigare orizontal al site-ului. De obicei, se află sub titlul site-ului.

Ø Meniu de navigare vertical. De obicei, se află sub logo.

Orez. 11. Elemente ale unui document hipertext

Site-ul este format din pagini

La fel ca o publicație tipărită, cum ar fi o carte, un site web este format din pagini. Paginile site-ului sunt fișiere cu extensia htm (html). O pagină de site este adesea numită document. Ca o carte, site-ul are o singură pagină principală (intrare

punct, pagina de start, pagina de start). Această pagină este indicată ca adresa site-ului.

Spre deosebire de o carte obișnuită, paginile site-ului sunt rareori răsturnate în ordine. Datorită tranzițiilor hipertext, utilizatorul trece de la o pagină la alta în funcție de context (prin sens, prin nevoia de a primi doar informațiile care se referă la subiectul de interes).

Exercita

Încercați să utilizați un browser conectat la Internet pentru a accesa site-ul web *****

Site-uri cu structură ierarhică

Ierarhia este dependență prin subordonare. Această structură este mai des folosită decât altele (lanț, tabel) pentru a organiza paginile site-ului. De obicei, site-urile au o pagină specială numită „Harta site-ului”, unde ierarhia paginilor este afișată ca un sistem de liste imbricate. Imbricarea reflectă aspectul ierarhic al site-ului, iar intrările din listă sunt hyperlinkuri către paginile corespunzătoare.

Utilizatorul vede structura logică completă a site-ului și are capacitatea de a ajunge la orice pagină cu un singur clic (Fig. 12).

Orez. 12. Harta site-ului

Sisteme de navigare pe site

Deplasarea pe site (navigarea) trebuie organizată clar și convenabil pentru utilizator. În același timp, tehnicile de navigare pe site-urile potrivite sunt aceleași pentru toate paginile sale. Excepția este cazul când site-ul are subsite-uri independente - își pot folosi propria schemă de navigare.

Navigare convenabilă

Navigarea este convenabilă dacă puteți răspunde cu ușurință la trei întrebări pe orice pagină a site-ului.

Ø Unde sunt? Utilizatorul înțelege clar unde se află în cadrul site-ului.

Ø Unde pot merge? Din fiecare pagină puteți ajunge la orice altă pagină, ocolind pagina de pornire.

Ø Unde este meniul? Utilizatorul nu trebuie să deruleze pagina pentru a accesa elementele de navigare.

Cărțile enumerate mai jos vor fi foarte utile pentru a lucra la cursuri:

1. . Web design. HTML, BHV-Petersburg, 2003.

2. Dmitri Kirsanov. Web design. Sankt Petersburg: Simbol, 1999.

Nu este un secret pentru nimeni că fiecare site web pentru o companie are patru obiective principale: construirea loialității mărcii, creșterea traficului, reducerea ratelor de respingere și creșterea ratelor de conversie în clienți potențiali sau vânzări! Multe aici depind de cât de confortabil se simt utilizatorii când vă vizitează site-ul.

Prin urmare, în articolul nostru de astăzi vom vorbi despre ce este navigarea pe site, datorită căreia se creează o „atmosferă confortabilă”. Sau, mai degrabă, despre cele mai frecvente greșeli făcute în timpul dezvoltării sale.

Greșeala nr. 1: stil non-standard

Se întâmplă că utilizatorii sunt obișnuiți să vadă navigarea pe site în partea de sus sau din stânga paginii, așa că nu ar trebui să-i forțați să rătăcească pe site în căutarea acestuia, deoarece astfel de jocuri de-a v-ați ascunselea pot să nu fie pe placul lor, care va afecta negativ ratele de conversie și va crește rata de respingere.

Da, o abordare creativă este întotdeauna binevenită în dezvoltarea paginilor/site-urilor web, dar navigarea pe site clar nu este cazul în care ar trebui să dai frâu liber imaginației. Cu astfel de experimente, distrageți atenția utilizatorilor, care vor fi forțați să studieze un nou stil de navigare mai degrabă decât conținutul principal al resursei.

Greșeala nr. 2: etichete generice ale elementelor de meniu

O altă regulă de aur cu privire la modul de a crea navigare pe site-ul web este că etichetele meniului de navigare trebuie să fie informative. De exemplu, utilizarea elementelor de meniu „Produse” sau „Servicii” este comună tuturor companiilor, iar astfel de nume înseamnă puțin pentru utilizatori. Iată un alt exemplu: „Ce facem” este aceeași frază fără chip.

În acest caz, cum puteți îmbunătăți navigarea pe site? Încercați să alegeți cele mai precise etichete pentru fiecare pictogramă de element de meniu de navigare și veți vedea cum vorbesc utilizatorilor. Vizitatorii site-ului au venit la tine în căutarea unui răspuns la întrebările lor, așa că nu ar trebui să-i îndepărtezi cu fraze și cuvinte clișee.

Acceptați că clienții dvs. nu caută „Produse” sau „Servicii” abstracte, iar navigarea cu astfel de pictograme nu va afecta promovarea site-ului în rezultatele căutării. Te recunoști? Așa că este timpul să ne îmbunătățim! Meniul site-ului și structura sa în ansamblu ar trebui să fie optimizate pentru motoarele de căutare și să vorbească o limbă ușor de înțeles pentru publicul țintă. După ce ai citit articolul nostru până la sfârșit, vei vedea câte companii rezolvă o problemă similară.

Greșeala nr. 3: meniul drop-down

Meniurile drop-down au devenit extrem de populare ca element de navigare, dar există două motive bune pentru care ar trebui folosite cu precauție extremă.

Probabil că mulți dintre voi au trebuit să prindă literalmente un meniu derulant. O mișcare incomodă - și fuge de tine! Și așa, tu, după ce ți-ai adunat puterile, caută din nou, dă clic și există o surpriză! - o altă listă de opțiuni de acțiune. Asemenea prinderi sunt teribil de enervante! Gândește-te bine, poate nu ar trebui să te deranjezi din nou potențialii tăi clienți?

Un alt motiv pentru abandonarea meniului drop-down: trafic redus către următoarele pagini ale site-ului sau profunzimea de navigare. Dacă aveți o problemă cu traficul scăzut către paginile de nivel superior, este foarte posibil ca motivul să fie în utilizarea unui meniu derulant. Dar există întotdeauna excepții de la reguli. În acest caz, excepții se aplică site-urilor mari cu multe secțiuni, deoarece aici, cu ajutorul unui astfel de meniu, gradul de utilizare a site-ului este îmbunătățit semnificativ.

Greșeala #4: Prea multe elemente de meniu

Acesta a fost cazul înainte, dar nu ar trebui să aderați la această tradiție astăzi decât dacă este absolut necesar, deoarece uneori chiar și 8 puncte pot fi prea mult. Încercați să le limitați la un număr mai mic, care să nu depășească 5: cu cât sunt mai puține puncte minore, cu atât mai rar ochii utilizatorilor se vor împiedica de ele și cu atât vor vorbi mai tare cei mai importanți.

Această regulă se aplică și întregului conținut al site-ului, nu doar navigației. Fiecare element eliminat le face pe cele rămase mai vizibile. Navigarea concisă este, de asemenea, importantă pentru SEO. Deoarece de cele mai multe ori utilizatorii urmăresc un link către pagina principală, și nu către paginile interne ale site-ului, de aceea este „autoritar” pentru motoarele de căutare. Când navigarea dvs. este supraaglomerată cu link-uri, pagina de pornire a site-ului devine mai puțin autoritară în comparație cu cele interne.

Greșeala #5: Plasarea inadecvată a elementului de meniu pentru comandă

Cercetările în psihologie au arătat că primul și ultimul element al oricărei liste sunt mai ușor de reținut decât elementele din mijloc. O acțiune similară are loc cu utilizatorii. Acest fenomen se numește „curba de poziție în serie” și este exprimat clar sub forma unui grafic:

Concentrarea atenției este semnificativ mai mare la începutul listei (efectul de primat) și la sfârșit (efectul de noutate). De aceea este corect să plasăm cele mai importante puncte la începutul navigației, iar pe cele secundare în centru. Elementul de meniu „Contact” ar trebui să fie plasat la sfârșitul navigației SUS în colțul din dreapta.

Sfat bonus: linkuri - pentru totdeauna, butoane - niciodată!

În cazul în care sunteți cu 8 ani în urmă față de tendințele de design web și încă folosiți butoane de navigare grafică în loc de link-uri text, atunci vă oferim 5 motive pentru a vă reconsidera obiceiurile:

  • Textul butonului nu este vizibil pentru motoarele de căutare.
  • Butoanele sunt mai greu de actualizat decât linkurile text.
  • Butoanele se încarcă mai lent, ceea ce le face nepotrivite pentru aplicațiile mobile.
  • Butoanele nu pot fi citite de browserele de vorbire și text.
  • Butoanele nu sunt necesare chiar dacă doriți să utilizați fonturi personalizate, de exemplu folosind instrumente precum TypeKit.

Și acum, așa cum am promis: 5 exemple de navigare pe site fără erori.

Navigarea este cea care ajută utilizatorul să navigheze pe site. Aceasta este o structură de catalog într-un magazin online care vă ajută să găsiți ceea ce trebuie, un meniu al unui site de informații cu subsecțiuni pentru diferite grupuri de conținut, o listă de subiecte pe un portal de știri și așa mai departe.

Navigarea este întotdeauna folosită de vizitatori, indiferent de cunoștințele lor de terminologie. Și cu cât este mai simplu, cu atât utilizatorul găsește mai repede informațiile de care are nevoie și cu atât o impresie mai bună are din resursa dvs. Căile întortocheate, chiar dacă duc la rezultatul dorit, îl pot oferi în mod constant. Dar adesea utilizatorii părăsesc site-ul nedumeriți, fără să înțeleagă cum să folosească toată această „bogăție”.

Cum ar trebui să fie navigația?


Iată 8 criterii pentru a evalua navigarea existentă. Dacă totul este greșit pe site-ul dvs., schimbați-l. Dacă doar creați o resursă, urmați sfaturile noastre imediat, pentru a nu fi nevoit să o repetați mai târziu. Deci, navigarea pe site trebuie să îndeplinească următoarele criterii:


Nu uitați că nu numai navigația primară, ci și cea secundară trebuie să respecte toate aceste reguli.