Meniuri cu hamburgeri în designul site-ului web

Oricine folosește internetul a văzut probabil zeci de exemple de meniuri Hamburger pe internet. Această pictogramă simplă, cu trei linii, este printre cele mai recunoscute butoane astăzi. Multe site-uri web îl folosesc pentru a ascunde elemente de navigare adesea robuste și pentru a economisi spațiu. Cu toate acestea, în ciuda utilității lor, meniurile Hamburger în designul site-urilor web sunt încă printre cele mai discutabile opțiuni de design web . Pentru unii, este o soluție autentică, care ar trebui să-și găsească drumul în totalitate în toate modelele responsive. Pentru alții, este un efect secundar nefericit care provine dintr-o interpretare greșită a designului structural practic.

O introducere în meniurile Hamburger în designul site-urilor web

Nu exclusiv, dar meniurile pentru hamburger se găsesc de obicei pe site-uri web și aplicații responsive atunci când se adaptează la afișajele pe ecrane mici. Indiferent dacă sunt pe partea stângă sau pe partea dreaptă, designerii și dezvoltatorii profesioniști folosesc hamburger manus pentru a economisi spațiu prețios. Aceasta este o soluție populară, deoarece ascund navigarea principală pentru a lăsa mai mult spațiu pentru restul conținutului . Dar, nu toată lumea crede că este o soluție adecvată. Mulți susțin exact contrariul.

Pentru a vă ajuta să înțelegeți mai bine meniul de hamburgeri, aici vom discuta:

• Ce sunt meniurile cu Hamburger
• Conceptul de meniuri Hamburger în designul site-ului web
• Controversa din spatele ei
• Implementare alternativă
• Avantajele și dezavantajele generale ale meniurilor Hamburger în designul site-ului web

Ce sunt meniurile cu hamburger?

Mai simplu spus, un meniu de hamburger este o alternativă simplă și mai mică la barele mari de navigare . Acesta servește practic ca un sertar în care puteți plasa totul, de la navigare, care vă aglomera site-ul. Meniurile cu hamburgeri arată de obicei ca trei rânduri una peste alta. Numele provine de la asemănarea sa evidentă cu hamburgerii.

Totul a început în 1981. la stația de lucru Xerox Star. Norm Cox, designerul de interfață grafică cu utilizatorul din acea vreme, a creat o pictogramă pentru a deschide o listă de elemente ascunse. Intenția a fost de a oferi o soluție alternativă de economisire a spațiului pentru listele lungi de opțiuni . Ceva similar cu meniul conceptual cu clic dreapta pe computerele desktop. Dar, până în 2009, meniul de hamburgeri nu a cunoscut prea multă glorie. Abia când Facebook și alte câteva site-uri l-au introdus din nou, meniul hamburger și-a început călătoria. A fost o soluție aproape perfectă pentru a economisi spațiu prețios pe ecran pe dispozitivele mobile de atunci.

Dar, a fost?

Argumentul veșnic despre meniul de hamburger

Intenția creatorului original a fost să creeze ceva simplu, dar eficient. Un buton mic care va reduce dezordinea urmând același principiu din spatele meniului cu clic dreapta. Trebuia să fie similar, memorabil și ușor de folosit. Și este, chiar și în forma sa actuală, pentru care nu a fost destinat inițial.

Cu toate acestea, nu toată lumea împărtășește același entuziasm când vine vorba de meniurile cu hamburgeri . Mulți designeri îl critică pentru că ascunde cea mai importantă parte a navigării pe site. În consecință, vizitatorilor le va fi greu să-l găsească. Ei recomandă utilizarea meniului Hamburger numai atunci când există mai mult de patru elemente de navigare în meniu. Pe de altă parte, aceste afirmații s-ar putea schimba în viitor, deoarece majoritatea oamenilor se obișnuiesc deja cu modul în care arată și funcționează meniurile de hamburger.

Utilizare și implementare alternative

Pe lângă regula „patru elemente” , există și alte sugestii despre cum să îmbunătățiți utilizarea meniului de hamburger.

• Combinați meniul de hamburger cu alte caracteristici . De exemplu, puteți plasa funcția de căutare și meniul hamburger unul lângă celălalt.
• Utilizați substituenți de diferite forme , margini și culori pentru a face „hamburger” mai distins.
• Găsiți o poziție alternativă care nu este neapărat unul dintre colțuri.
• Creați un meniu de hamburger plutitor cu o poziție fixă ​​odată ce vizitatorii încep să defileze pe pagină.

Ideea este de a oferi un design curat, dar distins, convenabil pentru utilizatorii de telefonie mobilă, indiferent de dimensiunea ecranului dispozitivului lor.

Avantajele și dezavantajele generale ale meniurilor Hamburger în designul site-ului web

Din punctul de vedere al UX (experiența utilizatorului), meniurile de hamburger pot fi o sabie cu două tăișuri. Deși poate funcționa în majoritatea situațiilor, în altele poate crea confuzie. Pentru a înțelege când să-l folosești, este mai bine să verifici toate avantajele și dezavantajele meniurilor Hamburger.

Pro:

• Meniul de hamburger reduce dezordinea – funcționează atunci când contează cel mai mult. Utilizarea corectă a spațiului poate însemna uneori totul pentru site-urile și aplicațiile mobile. Având în vedere dimensiunea ecranului de care dispuneți, orice vă poate oferi mai mult spațiu este bun. De asemenea, prea multe elemente de pe ecran nu pot decât să distragă atenția vizitatorilor de la acordarea atenției conținutului potrivit.
• Menține navigarea ușor de înțeles – Aproape toată lumea înțeleg astăzi pentru ce este folosită atunci când văd meniul de hamburger. Suntem ființe vizuale și este ușor să observăm o pictogramă care arată ca trei linii orizontale într-o coloană. Mai ales dacă ne amintește de una dintre cele mai preferate mese rapide. Gândește-te doar la câte pictograme și logo-uri de marcă diferite cunoști după nume.
• Poate fi o opțiune excelentă pentru a ține din cale elementul secundar de navigare - Nu există nicio regulă care să spună că trebuie să plasați întreaga navigație în meniul hamburger. Destul de des, una dintre cele mai bune soluții este să lăsați elementele principale de navigare pe site și să plasați toate celelalte opțiuni secundare în meniul hamburger. Practic, acesta ia ce este mai bun din ambele lumi și încă își servește scopul.

Contra:

• Navigarea importantă nu este vizibilă – Când vă transformați navigarea într-un meniu de hamburger, o faceți aproape invizibilă. Câteva cercetări confirmă faptul că implicarea site-ului poate scădea considerabil din acest motiv. Cu alte cuvinte, unii oameni nu vor face clic mai departe pentru că nu le atrage atenția imediat.
• Nu toată lumea o înțelege – mai puțin probabil, dar există totuși vizitatori care întâlnesc meniurile cu hamburgeri pentru prima dată. Poate părea familiar, dar nu suficient de motivant sau auto-explicativ pentru a-i determina să facă acțiunea. Îl vor lăsa așa cum este pentru că nu există alte indicații despre ce este folosit. Acest lucru se schimbă, dar uneori poate fi neintuitiv. Mai ales când designerii folosesc prea multă libertate și o fac complet abstractă. Sau „hamburgerul” în sine nu este suficient de distins vizual.
• Meniul hamburger necesită un „efort” suplimentar pentru utilizare – Deși poate părea prostesc, dar, din punct de vedere tehnic, un meniu hamburger durează câțiva pași mai mult decât navigarea obișnuită. Ca să nu mai vorbim de faptul că nu toată lumea poate ajunge la el cu degetele mari atunci când își ține telefoanele într-o mână.

Oricare ar fi opinia ta subiectivă, nu uita niciodată să iei în considerare care este cea mai bună opțiune pentru utilizatorii tăi. S-ar putea să vă placă meniurile cu hamburger, dar, totuși, ajungeți să nu le folosiți dacă circumstanțele nu par corecte. Sau poți să-l urăști complet, dar ar putea fi cea mai bună soluție pentru site-ul sau aplicația ta. Amintiți-vă că aplicarea corectă a hamburger manus în designul site-urilor web poate fi situațională și diferită de la caz la caz . Pentru a vedea dacă este pentru tine, rulează câteva teste A/B și vezi ce părere este publicul tău despre asta.