Dopo aver gestito uno store abbastanza a lungo, mi sono reso conto che la maggior parte dei clienti se ne va non perché i prodotti siano scadenti, ma perché non riesce a trovare ciò che cerca abbastanza in fretta. Buona parte di questo attrito vive nella navigazione. Questo articolo raccoglie i cinque errori di navigazione su Shopify più comuni, come individuare ciascuno e il modo più pulito per correggerlo.
Un numero da tenere a mente prima di entrare nei dettagli: secondo il Baymard Institute, il tasso medio di abbandono del carrello nell’ecommerce è intorno al 70%. Non tutto deriva dalla navigazione, ma una parte dei clienti se ne va molto presto, ancora prima di aggiungere qualcosa al carrello, semplicemente perché si è persa.
Errore 1: Troppe voci di menu di primo livello
È l’errore più facile da commettere, perché nasce da buone intenzioni. Il merchant vuole che i clienti vedano tutto, quindi ammassa ogni cosa sulla barra del menu principale: una dozzina o più di voci di primo livello, a volte quasi venti.
Il problema è che quando tutto è importante, niente lo è. Il cliente guarda una lunga fila, non sa da dove cominciare e così, di solito, non comincia affatto.
Individuarlo è piuttosto semplice. Apri la homepage su desktop e conta le voci di primo livello. Se il menu deve andare a capo su una seconda riga, sei in sovraccarico. Su mobile, se l’elenco di primo livello supera la lunghezza di uno schermo e non è ancora finito, è anche quello un segnale.
La soluzione: raggruppa le voci correlate. Un negozio di moda non ha bisogno di “T-shirt”, “Camicie” e “Giacche” come voci di primo livello separate — vanno raccolte sotto “Top”, con i tipi all’interno. Mantieni il menu di primo livello intorno a 5-7 voci, così i clienti possono scorrerlo in un secondo o due.
Errore 2: Nessun mega menu per uno store con molte categorie
Una volta raggruppate le cose con ordine, compare il problema opposto: le sottocategorie finiscono sepolte troppo in profondità. Il cliente deve cliccare su “Top”, aspettare il caricamento della pagina per vedere quali tipi ci sono, poi cliccare di nuovo. Ogni clic in più è un’altra occasione per arrendersi.
È qui che il mega menu dà il suo contributo. Un mega menu è un ampio pannello a tendina su più colonne che mostra l’intera struttura delle categorie nel momento in cui il cliente ci passa sopra con il mouse, permettendogli di saltare da una categoria di primo livello a una sottocategoria in un solo gesto. Per un catalogo ampio, è quasi lo standard di default sui grandi siti retail.
Come capire se il tuo store ha bisogno di un mega menu: se i clienti devono cliccare tre o più volte per arrivare a una pagina di elenco prodotti, oppure se hai molte sottocategorie senza un modo per vederle tutte insieme, è un segnale.
Una nota nella costruzione di un mega menu: se il pannello non ha un ritardo sull’hover, tremolerà ogni volta che il mouse ci passa sopra per errore. Se usi un menu builder, scegline uno che gestisca questo aspetto al posto tuo. Navi+ (https://naviplus.io) costruisce mega menu per desktop con drag and drop, senza bisogno di codice, così non devi preoccuparti di questo dettaglio tecnico.
Errore 3: Affidarsi solo al menu hamburger su mobile
La maggior parte dei clienti acquista dal telefono, quindi questo è l’errore più costoso. Molti store comprimono tutta la navigazione in un’icona a tre linee nell’angolo — un menu Shopify in stile hamburger — e la considerano completa. Ma nascondere tutto significa che i clienti devono aprirlo attivamente per vedere qualcosa, e la maggior parte non si prende la briga.
Il Nielsen Norman Group una volta ha testato questo aspetto sia su telefoni che su desktop. Il risultato: quando la navigazione è nascosta, i clienti faticano di più a trovare ciò che cercano, si muovono più lentamente e valutano la ricerca come più difficile rispetto a quando il menu è mostrato chiaramente. In altre parole, ciò che i clienti non vedono di fatto per loro non esiste.
Come individuarlo: apri il tuo store sul tuo telefono. Se per raggiungere la categoria più venduta devi toccare l’hamburger, scorrere e poi toccare di nuovo, immagina un cliente di fretta, in piedi mentre aspetta un passaggio.
La soluzione non è eliminare l’hamburger, ma portare i percorsi importanti allo scoperto, dove un pollice può raggiungerli senza dover aprire nulla. Una Tab Bar fissa in fondo allo schermo — come nelle app che i clienti usano ogni giorno — tiene Home, Categorie, Ricerca e Carrello proprio nella zona del pollice. È il tipo di menu che Navi+ costruisce specificamente per il mobile, configurato separatamente dal desktop, così tieni l’hamburger per le cose secondarie e lasci che la Tab Bar gestisca l’essenziale.
Errore 4: Nessun breadcrumb o indicatore di posizione
I clienti navigano in profondità nel catalogo e dimenticano dove si trovano. Atterrano su una pagina prodotto tramite un annuncio o una ricerca, l’articolo piace, ma vogliono vedere altri prodotti simili — e non c’è un modo naturale per risalire alla categoria principale.
Un breadcrumb è una piccola traccia come “Home > Top > T-shirt > T-shirt da uomo” posizionata sopra il nome del prodotto. Risponde a due domande insieme: dove mi trovo e come torno indietro di un livello. Sembra semplice, ma molti temi Shopify non lo abilitano di default, oppure i merchant lo rimuovono perché lo trovano “disordinato”.
Come individuarlo: apri una qualsiasi pagina prodotto e chiediti: “dove clicco per vedere i prodotti dello stesso tipo?”. Se la risposta è il pulsante Indietro del browser, ti manca un indicatore di posizione.
La soluzione: abilita i breadcrumb nelle pagine di categoria e prodotto. Inoltre, rendi chiaro l’elemento corrente nel menu principale — per esempio mettendo in grassetto o sottolineando la categoria attiva — così i clienti sanno sempre su quale ramo si trovano.
Errore 5: Categorizzare secondo la logica del merchant, non secondo il modo di pensare di chi compra
Questo è l’errore più sottile, perché il menu sembra comunque in ordine. Il problema sta in come sono impostati i gruppi. I merchant tendono a categorizzare nel modo in cui il magazzino o il fornitore organizza le cose, mentre chi compra ragiona in termini dei propri bisogni.
Un esempio familiare: un negozio di cosmetici divide il menu per marca, perché è così che acquista la merce. Ma i clienti di solito non ricordano i nomi delle marche — arrivano per trovare la “crema solare” o il “rossetto matte”. Quando il menu non ha un percorso per scopo, i clienti devono indovinare quale marca abbia ciò che cercano, e la maggior parte si arrende.
Baymard colloca la navigazione categorizzata male tra i problemi di navigazione ad alto impatto, perché lascia l’impressione che uno store sia difficile da usare.
Individuarlo è più difficile rispetto ai quattro errori precedenti, perché richiede di ascoltare i clienti. Rileggi i messaggi e le domande che i clienti fanno spesso: se molte persone scrivono “vendete X”, quando X è chiaramente disponibile sul sito, quasi certamente non sono riuscite a trovarlo dal menu. È un menu che parla la tua lingua, non la loro.
La soluzione: dai i nomi alle voci usando le parole che usano i clienti, non il gergo interno. Puoi mantenere entrambi gli assi — navigare per tipo di prodotto e navigare per scopo o occasione — se i tuoi clienti ragionano in modi diversi. Il modo più rapido per verificare è chiedere a qualche persona esterna che non è mai stata sul tuo store di trovare un articolo specifico, e osservare dove clicca per prima cosa.
Una nota generale: non sacrificare la velocità
Quando si sistema la navigazione c’è una trappola: aggiungi un’app, aggiungi effetti e la pagina rallenta. Ogni app può caricare script che appesantiscono la pagina.
Google fissa la soglia “buona” per l’esperienza di caricamento della pagina a un LCP sotto i 2,5 secondi, un INP sotto i 200ms e un CLS sotto lo 0,1. Un bel menu che fa scattare la pagina, ne sposta il layout o risponde lentamente fa più male che bene. Quando scegli un menu builder, dai la priorità a uno che tiene ai Core Web Vitals — è anche ciò per cui Navi+ è ottimizzato, e il menu resta al suo posto quando cambi tema, così non devi ricostruirlo da zero ogni volta che modifichi il design.
Tutti e cinque gli errori qui sopra si possono correggere senza conoscere alcun codice. Parti da quello che colpisce il maggior numero di clienti sul tuo store — di solito il lato mobile — e procedi verso il basso.
Questo articolo fa parte della guida più ampia su Perché i clienti visitano il tuo store ma non comprano — e quanto conta la navigazione.