Esempi
Pagine Complete
Il menù principale di navigazione di un applicativo va scelto in base al numero di voci che deve contenere e alla quantità di informazione da mostrare a video.
I quattro esempi richiamabili qui sotto sono casi tipo per chiarire il concetto.
Il link all'esempio fuzionante apre un tab nel browser che mostra la pagina completa. Conviene staccarla e ridimensionarla per vedere la responsività degli elementi al suo interno.
Il link al codice commentato rimanda alla spiegazione tecnica della struttura generale del codice HTML che genera quella pagina.
Corpo pagina fluido
Utilizza tutta la larghezza dello schermo quando devono essere mostrati molti dati.
Menu orizzontale
Il menù orizzontale occupa poco spazio, ma può contenere solo pochi link.
Con i dropdown o i megamenù è possibile aumentarli, ma l'utente deve cliccare per vederli.
Menu verticale
Il menù verticale a comparsa è utile se le voci di menù sono molto numerose.
Non occupa spazio, ma deve essere aperto e chiuso con un click.
Corpo pagina compatto
Se i dati da mostrare non sono molti, evita che, sugli schermi grandi, le informazioni risultino troppo sparse.
Form
Il container mantiene vicine le informazioni anche se lo schermo è molto ampio.
Sidebar
Avendo spazio, la sidebar permette di visualizzare molte voci di menù immediatamente, risparmiando click all'utente