Il tuo web site ha fame di visitatori? Ecco tutto sull’ hambuger menu: dalle basi alle best practice che migliorano la navigazione

hamburger menu: Caratteristiche e funzionamento

hamburger menu: Caratteristiche e funzionamento

Girano pochi visitatori sul tuo website? meglio accoglierli con un hamburger menu! L’ icona delle 3 lineette orizzontali  sembra insignificante; in realtà è la star dello Sviluppo siti Web moderni. Nasce trent’ anni fa grazie alla genialità di Norm Cox per l’interfaccia grafica Xerox Star. Ignorata per un pò, diventa necessaria alla user experience top sui dispositivi mobili. Soprattutto per Gmail, Facebook e Twitter. Al punto che nel sessantasettesimo compleanno di Cox il colosso McDonald’s crea veri hamburger in omaggio alla sua invenzione. I siti Web e i browser che hanno nell’ angolo in alto a sinistra le 3 righe di Cox sono milioni. Il visitatore affamato di informazioni sa che cliccandoci su le trova velocemente. L’ hamburger menu icon è semplice ma potente, occupando uno spazio molto limitato. Si ispira agli strati del famoso panino americano, bello zeppo di cose buone. Presenta le pagine del tuo website come fossero versioni di ricette. Stilizzato al massimo, l’hamburger menù, detto anche hamburger button, piace perché si ricorda facilmente. Il tuo website non ha l’hamburger menu: questo costringe l’utente a cliccare più volte per raggiungere una sezione o una pagina. Peggiorando la sua user experience di consumatore. Il 17 giugno 2009 l’icona fa la sua comparsa in iPhone 3G: cliccando sul menu hamburger compare la lista delle registrazioni e delle opzioni che spesso cerchiamo disperatamente in un sito. In generale, toccando questa  icona si apre una tendina laterale con la lista delle opzioni che offre il sito. Un’operazione facile per l’utente dell’ app o per il visitatore. Eppure non tutti sono d’accordo su questo. Leggi di seguito quando usare il menù hamburger e quando è meglio lasciar perdere.

menu hamburger: quando e perché usarlo

menu hamburger: quando e perché usarlo

Il tuo web site ha un menù a tendina: la prima voce è ben visibile, mentre le altre vengono fuori cliccandoci sopra. Oppure ha un menu tradizionale: tutte le voci di menu sono visibili in orizzontale. Pensi di migliorare l’attuale Layout Sito Web inserendo l’ hamburger menu. L’inventore Cox non ha dubbi: l’uso continuo nelle App dagli anni Ottanta fino ad oggi è la prova della sua utilità. Nelle hamburger menu icons sono infilate tutte le opzioni, le impostazioni e le estensioni che richiedono più icone. Un bel risparmio di energie. Soprattutto sul dispositivo mobile, perché gestisce la navigazione con una grafica minima. Molto usato nel visual design, l’icona dell’hamburger menu è subito riconoscibile; ecco perché lo scelgono Chrome, Instagram, Facebook e Amazon. Non a caso piattaforme social e di ecommerce, usate su telefoni e tablet. Ideale quindi per la massa abituata a reagire guardando un’immagine. Anche la sua semplicità segna un punto a favore: secondo uno studio della Columbia University infatti, gli utenti acquistano di più da siti progettati con meno opzioni di acquisto. Infine, nel menu hamburger trovi lo storico dei tuoi acquisti, ricevute, impostazioni di pagamento che occuperebbero molto spazio sulla schermata principale. Insomma, se hai un sito di ecommerce, via libera al menu hamburger per catturare e fidelizzare clienti. Occhio però, ci sono casi in cui la scelta non è tra le migliori: ecco quali sono.

hamburger menù: quando e perché non usarlo

hamburger menù: quando e perché non usarlo

Gestisci un sito di ecommerce; non puoi fare a meno di inserire l’hamburger menu, icona mondiale riconoscibile al primo sguardo. Porta il consumatore diritto alla pagina che cerca, soprattutto se fa acquisti da mobile. Ma nel css menu hamburger affidati ai Web Designer Freelance che spesso non sono d’accordo. Perché l’hamburger menu nasconde pulsanti e pagine di navigazione importanti del tuo sito che così vengono sminuite. In un web site pieno di contenuti come servizi o argomenti l’icona dell’ hamburger menu si usa molto meno rispetto ad altri pulsanti. Secondo la Nielsen Norman Group  la rilevabilità del sito si riduce a metà, aumentando la difficoltà di navigazione. Questo perché una parte degli utenti non capisce che le 3 linee orizzontali sono un’icona di menu. Nel dettaglio: sul desktop del pc l’hamburger menu viene usato nel 27% dei casi rispetto al 50% di un menù tradizionale orizzontale. L’uso dell’ hamburger menu css su desktop causa un calo del 20% del recupero di contenuti; significa che il target di utenti collegati abitualmente da pc non distingue l’icona da un motivo decorativo. Perdendosi gran parte dei contenuti disponibili. Ricapitolando: se punti ad un target poco informatizzato scegli il menu tradizionale. Se invece vuoi catturare navigatori dinamici che si connettono da qualsiasi posto, via libera all’ hamburger menu.

menù hamburger, sceglilo con AddLance

Conclusioni

Vuoi provare l’hamburger menù? fai la tua scelta  con un professionista di AddLance!