Cosa Vedono i Visitatori Prima di Scorrere
Il concetto di "above the fold" — preso in prestito dal layout editoriale, dove i contenuti più importanti apparivano nella metà superiore della prima pagina piegata — rimane uno dei principi più affidabili nel web design. Gli utenti agiscono in base a ciò che vedono immediatamente. I contenuti che richiedono scorrimento o interazione per essere rivelati ricevono molto meno attenzione e coinvolgimento rispetto ai contenuti visibili all'arrivo.
Applicato alla navigazione, questo significa: gli elementi di navigazione immediatamente visibili quando un visitatore arriva nel tuo negozio — senza scorrere, senza aprire un menu, senza alcuna interazione — sono quelli che influenzano in modo affidabile ogni visitatore. Gli elementi di navigazione che richiedono l'apertura di un menu, lo scorrimento oltre un'intestazione o l'interazione con un dropdown raggiungono solo il sottoinsieme di visitatori abbastanza motivati da compiere quei passi aggiuntivi.
Per i visitatori da mobile — che rappresentano la maggioranza del traffico della maggior parte dei negozi — la superficie di navigazione above the fold è ancora più limitata che su desktop. Uno schermo mobile standard mostra un'intestazione con un logo e un'icona hamburger. Tutto qui. L'intera capacità di navigazione visibile above the fold è una singola icona che, premuta, apre un menu. Il costo di questo vincolo è che ogni azione di navigazione richiede almeno una pressione aggiuntiva prima che il visitatore possa iniziare a navigare.
«Abbiamo tracciato quali elementi di navigazione venivano usati dai nuovi visitatori rispetto ai visitatori abituali. I nuovi visitatori usavano il menu hamburger a una frazione del tasso dei visitatori abituali — si affidavano quasi esclusivamente alla Tab Bar. La Tab Bar era visibile above the fold; il menu completo richiedeva un'interazione. Ciò che era immediatamente visibile guidava il comportamento. Ciò che richiedeva uno sforzo veniva per lo più ignorato.»
— Un cliente Navi+, brand lifestyle multi-categoria
L'Inventario della Navigazione Above the Fold
Prima di apportare modifiche, vale la pena verificare esattamente quali elementi di navigazione sono visibili above the fold nel tuo negozio in questo momento. Ciò significa visualizzare il tuo negozio su un dispositivo mobile rappresentativo — non una finestra del browser con gli strumenti per sviluppatori che mostra un viewport mobile, ma un vero telefono — e annotare esattamente quale navigazione è presente senza alcuno scorrimento o interazione.
Per la maggior parte delle configurazioni predefinite dei temi Shopify, questo inventario è minimale: una barra dell'intestazione con un logo, un'icona hamburger e un'icona del carrello. Tre elementi, di cui due sono icone. L'hamburger apre un menu. Il carrello apre il carrello. Non c'è navigazione diretta verso alcuna categoria di prodotto specifica, nessuna scorciatoia verso le promozioni correnti, nessun percorso verso le destinazioni più importanti del negozio.
Questa è la navigazione che plasma la maggior parte delle esperienze di prima sessione nella maggior parte dei negozi Shopify. È il punto di partenza da cui deve iniziare qualsiasi miglioramento — e quasi qualsiasi miglioramento rispetto a questa baseline genererà un aumento misurabile nell'engagement di navigazione.
Sfruttare al Massimo la Superficie di Navigazione Visibile
La Tab Bar cambia completamente il calcolo della navigazione above the fold. Una Tab Bar fissa in basso è visibile su ogni pagina, a ogni profondità di scorrimento, senza alcuna interazione. Aggiunge fino a cinque destinazioni di navigazione alla superficie visibile above the fold — cinque percorsi specifici che un visitatore può intraprendere con un solo tocco, senza dover aprire alcun menu in anticipo.
Scegliere cosa inserire in quei cinque slot della Tab Bar è una decisione strategica che deve essere informata dalle stesse analisi che guidano qualsiasi prioritizzazione della navigazione: quali destinazioni generano il maggior ricavo per visitatore? Quali categorie hanno i tassi di conversione più alti? Quali sono le prime azioni di navigazione più comuni dei visitatori che poi effettuano un acquisto?
Le risposte a queste domande dovrebbero determinare direttamente l'allocazione degli slot della Tab Bar. Se "Saldi" genera il tasso di conversione più alto tra i visitatori alla prima sessione, merita uno slot nella Tab Bar. Se "Novità" è la seconda pagina visualizzata più comune dopo la homepage, appartiene alla Tab Bar. Le cinque destinazioni di navigazione più preziose del negozio devono essere immediatamente visibili, immediatamente accessibili, senza alcuna interazione preliminare.
| Elemento di navigazione | Visibile senza interazione | Accessibile con un tocco |
|---|---|---|
| Menu hamburger | Sì — icona visibile | No — apre il menu, poi richiede un secondo tocco |
| Contenuto del menu hamburger | No — nascosto fino all'apertura del menu | No — richiede minimo due interazioni |
| Slot Tab Bar (Navi+) | Sì — sempre visibile in fondo allo schermo | Sì — un tocco da qualsiasi punto |
| FAB (Navi+) | Sì — pulsante flottante persistente | Sì — un tocco da qualsiasi punto |
L'Effetto Cumulativo della Visibilità Immediata
Gli elementi di navigazione immediatamente visibili non vengono solo usati di più rispetto agli elementi nascosti — vengono anche usati prima nel corso della sessione. Un visitatore che utilizza la navigazione entro i primi 10 secondi dall'arrivo ha molte meno probabilità di rimbalzare rispetto a un visitatore che trascorre quei 10 secondi cercando di orientarsi sulla homepage senza un percorso chiaro. Un engagement di navigazione più precoce è fortemente correlato a sessioni più approfondite e tassi di acquisto più elevati.
Rendere immediatamente visibili le tue destinazioni di navigazione più importanti — tramite una Tab Bar, un'intestazione sticky ben configurata o un FAB — sposta effettivamente l'engagement di navigazione prima nella sessione tipica, con effetti a cascata su sessioni più lunghe, maggiore esposizione alle categorie e tassi di conversione più alti. Navi+ si installa in pochi minuti e rende questo cambiamento disponibile per qualsiasi negozio Shopify senza modifiche al tema.
Provalo gratis — nessun codice, nessuno sviluppatore
Installa in pochi minuti su Shopify, WordPress o qualsiasi sito web.