Lo spazio disponibile per il design sugli schermi, è molto prezioso, specialmente nel mondo mobile. Una manovra usata molto ma molto spesso dai designers, è quella di nascondere il menù di navigazione dietro all’ormai famosa icona con le 3 lineette, o comunemente chiamata Hamburger Menù. In questo articolo vedremo perché quest’icona non è il massimo dal punto di vista della User Experience, e quali possono essere delle valide alternative a essa.

PER QUALE MOTIVO L’HAMBURGER MENU È UNA PESSIMA SCELTA PER LA UX

Il problema principale dell’Hamburger Menù, è essenzialmente il fatto che è nascosto. Gli utenti non sono propensi ad utilizzarlo, lo evitano, andando cosi a influire negativamente sulla navigazione, perdendo informazioni e infine, abbandonando il sito.

Cosa fare dunque? Dato che non esistono delle regole precise da seguire per le applicazioni e siti web mobile, la soluzione migliore è quella di mantenere visibili le voci più importanti magari, e rendere visibili le altre voci solo tramite l’uso di elementi interattivi.

1. TAB BAR

Se avete un numero di voci principali limitato, una Tap Bar può essere un’ottima soluzione. Posizionata in alto in basso, sempre fissa durante lo scrolling, sarà perfetta da usare per i vostri utenti.

La Tab Bar sempre essere la soluzione migliore, ma bisogna considerare alcuni aspetti:

  1. La Tab Bar permette l’utilizzo di massimo 5 elementi.
  2. Una di queste opzioni dovrebbe essere sempre evidenziata.
  3. Il primo tab dovrebbe essere l’homepage, a seguire le altre voci disposte secondo un ordine logico.
  4. Sarebbe meglio usare le icone affiancate da una label, per aiutare l’utente a capire di cosa si tratta.

2. TAB BAR CON MAGGIORI OPZIONI

Quando si hanno più di 5 voci di menù, la soluzione ideale è mostrarne 4 e come ultimo tenere un elemento lista che mostri le altre. Un design identico a quello della Tab Bar, tranne per l’ultimo elemento che è quelli adibito a mostrare i restanti elementi del menù di navigazione.

L’elemento “mostra tutti” può lavorare come un drop down menu o un semplice link a una pagina esterna con al suo interno tutte le voci di menù.

Tab Bar

3. MENU A COMPARSA PROGRESSIVO

Una versione evoluta della Tab Bar formata da un sistema a comparsa del menù, che prevede di mostrare più voci possibili in base alla larghezza della finestra, nascondendo automaticamente le altre al suo restringimento.

Menu a Comparsa

4. NAVIGAZIONE SCHERMO INTERO

In maniera opposta agli altri menù che cercano di minimizzare la loro presenza, il menù di navigazione a schermo intero lavoro esattamente all’opposto.

Perfetto in tutte quelle situazioni si ha a che fare con numerose voci di menù da gestire. In questo modo si da la completa possibilità all’utente di decidere dove andare.

Navigazione a schermo intero

16 consigli per aumentare il traffico e le visite al tuo Sito Web

LASCIA UN COMMENTO