Le breadcrumb sono ausili di navigazione che consentono all’utente di monitorare la sua posizione attuale. Se ripensi alla favola di "Hansel e Gretel", ricorderai che i due protagonisti ritrovano la via d’uscita dalla foresta buia (e riescono a fuggire dalla strega che vuole mangiarli) lasciando cadere una scia di briciole.
Le breadcrumb, un termine inglese che significa per l’appunto “briciole”, seguono lo stesso principio: gli utenti possono passare da una pagina web all’altra attraverso collegamenti breadcrumb. Si tratta di un tipo di navigazione secondaria diverso dalla navigazione principale del sito (nota anche come navigazione primaria), rappresentata dal menu del sito sulla pagina principale.
Continua a leggere per scoprire come funzionano le breadcrumb e come aiutano gli utenti a navigare il tuo sito web e ottieni alcuni suggerimenti su come utilizzare le breadcrumb per facilitare la navigazione del tuo sito web da parte degli utenti e permettere loro di accedere direttamente alle pagine più pertinenti per loro.
Che cos’è la navigazione breadcrumb?
La progettazione di un sito web richiede molte considerazioni diverse. Ad esempio, devi assicurarti che il tuo sito abbia un design attraente, presenti il tuo prodotto o servizio in maniera evidente e sia sicuro per i pagamenti online.
Tuttavia, è anche importante che tu non trascuri l’architettura delle informazioni. Se questa è ben progettata, garantisce che tutte le informazioni sul tuo sito web siano facili da trovare e comprendere. Ad esempio, è importante assicurarsi che gli utenti siano in grado di accedere direttamente alla pagina di acquisto piuttosto che doverla cercare su Google. L’utilizzo di dati strutturati, che standardizzano il modo in cui le informazioni vengono presentate sul tuo sito web, è importante e la navigazione breadcrumb ti aiuta a ottenere esattamente questo obiettivo.
Un percorso di breadcrumb aiuta l’utente a capire dove si trova nella gerarchia del tuo sito e come arrivare alla pagina desiderata. Le breadcrumb consentono all’utente di ripercorrere tutte le pagine che ha visitato per arrivare dove si trova ora o di capire dove si trova nella struttura gerarchica del tuo sito. Invece di utilizzare il pulsante "Indietro" per tornare alla pagina precedente e a quella ancora prima, l’utente può utilizzare il percorso di navigazione breadcrumb per tornare direttamente dalla pagina corrente o a qualsiasi pagina di livello superiore nella struttura.
Esempi di navigazione breadcrumb
Sebbene le breadcrumb non possano sostituire la navigazione principale del tuo sito web, sono uno strumento utile per migliorare la tua esperienza utente.
È quasi certo che hai già visto la navigazione breadcrumb, anche se magari non l’hai riconosciuta sul momento. Se vuoi acquistare un nuovo paio di scarpe, è possibile che tu arrivi sulla pagina di un paio specifico (navigando nel sito o direttamente attraverso un collegamento in un motore di ricerca come Google) e veda nella parte superiore del sito una struttura del genere:
Home page > prodotti > scarpe > donna > atletica > corsa > nome del brand > stile
Nell’esempio precedente, ogni elemento racchiuso tra simboli > è chiamato breadcrumb. Questa struttura consente all’utente di vedere il percorso esatto che ha intrapreso per arrivare alla pagina corrente o dove si trova sul tuo sito web. Quindi, se le scarpe che stai guardando non sono quelle giuste, puoi tornare direttamente a qualsiasi pagina precedente e continuare la ricerca.
Le breadcrumb possono essere utili anche nel caso in cui agli utenti venga chiesto di completare diverse azioni. I siti web di e-commerce, ad esempio, possono chiedere agli utenti di effettuare il pagamento di un carrello inserendo prima le informazioni di spedizione e poi quelle di pagamento prima di confermare l’ordine. Un sito con navigazione breadcrumb può visualizzare i collegamenti a ciascuna fase precedente in modo che l’utente possa apportare delle modifiche.
Perché utilizzare la navigazione breadcrumb?
Perché la navigazione breadcrumb può essere utile e quali vantaggi può fornire agli utenti del tuo sito?
Facile navigazione del sito
Le breadcrumb aiutano l’utente a capire dove si trova nella struttura del tuo sito e come ci è arrivato. Contribuiscono a ridurre l’ansia degli utenti di perdersi se navigano su pagine aggiuntive e li aiutano a orientarsi se sono appena arrivati sulla pagina da un sito esterno come Google. Inoltre, i collegamenti breadcrumb consentono agli utenti di passare facilmente da un punto all’altro della struttura gerarchica.
Incoraggia la navigazione
Se gli utenti sono sicuri di poter tornare a qualsiasi pagina che hanno visualizzato in precedenza, sono in grado di esplorare e trovare esattamente quello che stanno cercando o magari addirittura qualcosa di cui non sapevano nemmeno di aver bisogno fino a quando non lo hanno trovato. La navigazione breadcrumb è particolarmente utile sui siti di e-commerce, dove i prodotti possono essere organizzati in categorie, il che consente agli utenti di guardare singoli articoli e di tornare facilmente a una categoria più ampia per continuare a navigare.
Migliora la ricercabilità
Le breadcrumb sono state originariamente create per semplificare la navigazione e ora vengono utilizzate per influenzare diversi aspetti dell’interazione dell’utente sul web.
Google e altri motori di ricerca utilizzano la navigazione breadcrumb per ottenere maggiori informazioni sui siti web, il che contribuisce a rendere le ricerche più accurate e ad assicurare che i risultati siano collegati ai contenuti più utili.
I risultati della ricerca spesso indirizzano gli utenti direttamente verso una pagina all’interno della gerarchia del tuo sito web piuttosto che semplicemente alla tua home page o alla tua pagina di destinazione. Ad esempio, i risultati possono collegare un cliente potenziale direttamente da una ricerca su Google alla pagina di acquisto di un articolo.
Inoltre, forse hai visto risultati di ricerca su siti come Google che includono più di semplici collegamenti a siti web e magari presentano anche una foto o un breve testo tratto dalla pagina di destinazione stessa. Questo è un esempio di "risultati avanzati", che sono molto più accattivanti di un semplice collegamento. Le breadcrumb sono uno degli elementi che aiutano Google (o qualsiasi altro motore di ricerca) a trovare e a estrarre informazioni da includere nei suoi risultati avanzati e rendono gli utenti più propensi a fare clic sul tuo sito web.
Le parole chiave mirate portano gli utenti alla pagina corretta
Quello di cui hai bisogno è un risultato di ricerca che porti gli utenti direttamente alle informazioni o al prodotto che stanno cercando. L’utilizzo di un percorso di breadcrumb consente a Google e ad altri motori di ricerca di fornire collegamenti direttamente alla pagina di destinazione più appropriata, ad esempio dettagli sugli attributi del prodotto, e quindi gli utenti possono collegarsi direttamente a pagine di livello superiore per saperne di più sul tuo brand. Ciò riduce anche il "tasso di bounce" del tuo sito web, ovvero il numero di utenti che escono dal tuo sito dopo aver visualizzato una sola pagina.
Quando non utilizzare la navigazione breadcrumb
Anche se le breadcrumb possono essere utili su vari siti web, ci sono alcuni motivi per cui potrebbero non essere indicate per te.
Il design del sito non è gerarchico
Se il design del tuo sito web è semplice, comprende solo poche pagine o non ha molte pagine secondarie, è facile intuire che gli utenti saranno in grado di navigare facilmente nel tuo sito senza bisogno di ausili alla navigazione come le breadcrumb. Al contrario, se decidi di includere questo strumento, puoi dare l’impressione che il tuo sito sia più complesso di quanto sia effettivamente, il che potrebbe scoraggiare alcuni utenti.
Lavoro di codifica extra per un piccolo risultato
Anche se le breadcrumb sono comuni e non difficili da implementare, la loro creazione e implementazione richiede comunque un po’ di lavoro. Se il tuo sito web non fornisce informazioni in più categorie o se esiste un altro modo più semplice per navigare nel tuo sito (come pulsanti o collegamenti integrati nella pagina stessa), potrebbe non valere la pena fare questo sforzo extra di codifica.
Può confondere gli utenti
A volte, più testo è presente sulla pagina e più il visitatore del sito web può sentirsi confuso. Considera il pubblico del tuo sito: la presenza di breadcrumb lo aiuterà o aggiungerà dati non necessari a un sito web che funziona meglio con un design visivo semplice e diretto?
Tipi di navigazione breadcrumb
Esistono diversi tipi di navigazione breadcrumb. Ciascun tipo è appropriato per siti diversi. Scopri le diverse categorie per cui potrebbe essere l’approccio migliore per il tuo sito web.
Breadcrumb basate sul percorso o sulla cronologia
Le breadcrumb basate sul percorso, note anche come breadcrumb basate sulla cronologia, mostrano a un utente come è arrivato dove si trova. Se desideri che l’utente possa tornare facilmente a una pagina precedente del tuo sito web, questo potrebbe essere il tipo di percorso di breadcrumb più indicato per te.
Breadcrumb basate su posizione o gerarchia
Un altro tipo di navigazione breadcrumb si basa sulla posizione o sulla gerarchia. Le breadcrumb basate sulla posizione sono statiche e non cambiano. Consentono all’utente di visualizzare la struttura complessiva del sito e di utilizzarla come strumento di navigazione. Le breadcrumb basate sulla posizione sono particolarmente utili per i siti con molte informazioni gerarchiche.
Ad esempio, un’organizzazione non profit potrebbe avere informazioni su numerose categorie di programmi, ciascuna delle quali presenta a sua volte diverse sottocategorie con collegamenti a informazioni più dettagliate. L’uso di breadcrumb può aiutare un utente a trovare le informazioni di cui ha bisogno e a rimanere sulla strada giusta.
Breadcrumb basate su attributi
Infine, la navigazione breadcrumb basata sugli attributi fornisce al visitatore maggiori informazioni sugli attributi della pagina corrente. Ad esempio, le breadcrumb basate su attributi sono popolari sui siti di e-commerce, dove gli utenti possono voler filtrare i risultati della ricerca per colore, taglia o tipo.
10 consigli per utilizzare la navigazione breadcrumb
Una volta deciso che le breadcrumb aiuteranno i tuoi utenti a orientarsi nella struttura del tuo sito web e a renderlo più prominente sui motori di ricerca come Google, ci sono alcune cose da tenere a mente che renderanno l’esperienza più facile per tutti.
Assicurati che i titoli delle breadcrumb siano coerenti con i titoli delle pagine
Dal momento che le breadcrumb vengono utilizzate per evitare confusione, non è opportuno utilizzare un nome per la breadcrumb che sia diverso rispetto al titolo della pagina stessa. Assicurati che i nomi corrispondano e siano coerenti per rassicurare gli utenti in merito al fatto che sono sulla pagina giusta.
Inizia il percorso di breadcrumb dalla home page
Sebbene gli utenti possano accedere per la prima volta al tuo sito web da una pagina a diversi livelli di profondità della tua gerarchia grazie a un collegamento in un risultato di ricerca, affinché la struttura delle breadcrumb della gerarchia abbia senso, il primo elemento nel percorso deve essere la home page. In questo modo, gli utenti possono sempre tornare direttamente qui.
Assicurati che la navigazione breadcrumb non sia eccessivamente lunga
Se il tuo percorso di breadcrumb diventa così a lungo da richiedere una seconda riga, è probabile che sia troppo lungo. Le breadcrumb semplici e brevi offrono i risultati migliori e la navigazione principale dovrebbe essere più in primo piano.
Includi l’intero percorso di navigazione
Quando si arriva a un livello particolarmente profondo nella gerarchia di un sito, può essere allettante abbreviare i percorsi di navigazione breadcrumb o rimuovere alcuni passaggi. Tuttavia, questo approccio può confondere gli utenti che, ad esempio, sono alla ricerca di un collegamento a pagine di livello superiore specifiche che non riescono a trovare.
Ciononostante, è anche possibile includere troppe informazioni. Se la struttura URL del sito include informazioni estranee che potrebbero causare confusione nell’utente (ad esempio, un livello di struttura nel sito che non corrisponde a nessuna pagina che l’utente potrebbe cercare), è possibile eliminare tali informazioni nei collegamenti breadcrumb.
Utilizzale solo se hanno senso per la struttura del sito
Le breadcrumb hanno molti usi, ma il loro scopo è supportare la navigazione principale di un sito piuttosto che sostituirla. Se la navigazione principale è semplice e chiara, non è necessario utilizzare breadcrumb.
Conosci il tuo pubblico
Considera quanto è esperto il pubblico del tuo sito nell’uso e nella navigazione su Internet. La navigazione breadcrumb è appropriata per la maggior parte dei tipi di pubblico, ma potrebbe non essere la scelta giusta se il tuo sito web è rivolto, ad esempio, a utenti meno esperti di Internet e alla ricerca di semplicità.
Assicurati che il risultato sia chiaro e facile da capire
Anche se le breadcrumb possono essere molto utili, non devono distrarre dalle informazioni principali sulle pagine del tuo sito. Assicurati che il testo sia piccolo ma leggibile e in una posizione standard in modo che gli utenti possano concentrarsi sulla pagina corrente fino a quando non saranno pronti a seguire un collegamento verso un’altra pagina.
Progresso dalla pagina di livello più alto alla pagina di livello più basso
Il tuo percorso di breadcrumb deve elencare le pagine di livello superiore a sinistra e poi passare a pagine di livello inferiore man mano che si procede verso destra. Magari ti verrà la tentazione di fare le cose a modo tuo, ma questo è uno degli aspetti in cui è davvero possibile trarre vantaggio da usabilità e visualizzazione della gerarchia del tuo sito web così come se le aspettano i clienti.
Assicurati che il percorso di navigazione sia facilmente visibile
Per assicurarti che i visitatori del tuo sito web possano sfruttare la navigazione breadcrumb, accertati che trovare il percorso di breadcrumb sia facile. Prendi in considerazione la posizione, il design e la lunghezza delle breadcrumb in modo da offrire l’esperienza migliore possibile ai tuoi utenti.
Libera la creatività con il design
Molti siti utilizzano il segno “maggiore di” (>) per indicare i punti nel percorso di breadcrumb, mentre altri siti scelgono di usare una barra (/), i due punti (:) o una freccia per visualizzare la posizione della pagina corrente. Alcuni siti includono anche menu a tendina quando gli utenti passano il mouse sulle breadcrumb, offrendo all’utente un percorso diretto verso posizioni nel sito che potrebbero non trovarsi nella gerarchia diretta della pagina corrente.
Pensa a cosa può rendere il percorso di breadcrumb quanto più chiaro possibile. È vero che è importante non spingersi troppo in là con la creatività fino al punto di creare confusione nell’utente. Ciononostante, puoi personalizzare l’aspetto delle tue breadcrumb in modo che si adatti alla struttura e al design del tuo sito utilizzando uno strumento come il Website Builder di Mailchimp.
L’integrazione di breadcrumb nel tuo web design può supportare la navigazione principale e aiutare i visitatori della tua pagina a capire come orientarsi, che si tratti di breadcrumb basate su attributi per un’azienda di e-commerce o di breadcrumb basate sulla posizione per un’organizzazione che offre molte informazioni. Le breadcrumb sono un modo intelligente per rendere il tuo sito web quanto più facile da usare possibile, aumentare la tua presenza su Google o altri motori di ricerca e fornire ai tuoi clienti collegamenti precisi alle informazioni e ai prodotti che stanno cercando.
Ci auguriamo che i tuoi utenti non debbano sfuggire a una strega cattiva come Hansel e Gretel, ma se li aiuti a non perdersi e a orientarsi con facilità tramite le breadcrumb digitali, vedrai presto i risultati!