Il breadcrumb, noto anche come “briciole di pane”, è un componente essenziale della navigazione web, progettato per aiutare gli utenti a orientarsi all’interno di un sito. Il termine trae ispirazione dalla celebre favola di Hansel e Gretel, in cui i due protagonisti lasciano una traccia di briciole per ritrovare la strada di casa dopo essersi avventurati nel bosco.

Cos’è un breadcrumb e perché è importante

Questa metafora è perfetta per descrivere il funzionamento del breadcrumb nei siti web: esso fornisce un percorso chiaro e strutturato, mostrando la posizione dell’utente rispetto alla gerarchia del sito, e consentendo un ritorno semplice alle sezioni precedenti senza dover ricorrere al tasto “Indietro” del browser.

In ambito web, il breadcrumb viene solitamente visualizzato nella parte superiore di una pagina e indica il percorso seguito dall’utente. Ogni segmento del breadcrumb è cliccabile.

L'importanza del breadcrumb risiede in due aspetti fondamentali:

Migliora la navigazione, offrendo agli utenti un chiaro riferimento sulla loro posizione nel sito.
Favorisce la SEO, aiutando i motori di ricerca a comprendere la struttura del sito e migliorando il posizionamento.

Esempio di breadcrumb in un e-commerce

Home > Abbigliamento > Uomo > Scarpe > Sneakers

Questo percorso indica chiaramente dove si trova l’utente e consente di tornare facilmente a categorie superiori.

Perché il Breadcrumb è importante

L’implementazione di un breadcrumb porta numerosi vantaggi, sia per l’esperienza utente che per l’ottimizzazione SEO, rendendo la navigazione più intuitiva e migliorando la visibilità sui motori di ricerca.

Il breadcrumb è un elemento essenziale per migliorare l’esperienza di navigazione degli utenti e l’ottimizzazione SEO del sito web. La sua funzione va oltre la semplice visualizzazione del percorso: contribuisce a rendere la navigazione più intuitiva, semplifica l’accesso ai contenuti e permette ai motori di ricerca di comprendere meglio la struttura del sito.

I Vantaggi per l’utente

Il breadcrumb aiuta gli utenti a muoversi agevolmente all’interno di un sito, offrendo loro un riferimento chiaro e immediato sulla loro posizione. La sua presenza evita la frustrazione di dover cercare manualmente il percorso di navigazione o tornare alla pagina iniziale per accedere ad altre sezioni.

Facilitare la navigazione è un aspetto cruciale per garantire una buona esperienza utente, soprattutto nei siti web complessi con molte categorie o contenuti strutturati in più livelli. Gli utenti possono saltare direttamente a un livello superiore senza dover compiere passaggi aggiuntivi, rendendo l’interazione con il sito più fluida.

Un buon sistema di breadcrumb consente inoltre di ridurre il numero di clic necessari per raggiungere una determinata pagina, ottimizzando il tempo di navigazione e aumentando la soddisfazione dell’utente. Questo si traduce in una maggiore permanenza sul sito, elemento fondamentale per mantenere l’engagement e ridurre la probabilità che l’utente abbandoni la pagina.

Oltre a migliorare la navigazione, il breadcrumb contribuisce anche a rendere più chiara la gerarchia del sito. Un’organizzazione logica delle pagine permette agli utenti di comprendere rapidamente la struttura del sito web, facilitando la loro esplorazione e il recupero di informazioni senza la necessità di ricerche aggiuntive.

Vantaggi per la SEO

Dal punto di vista della SEO, il breadcrumb svolge un ruolo strategico nella visibilità del sito sui motori di ricerca. La sua presenza migliora la struttura del sito, rendendolo più facilmente comprensibile da parte di Google e Bing e favorendo un’indicizzazione più efficace delle pagine.

Un breadcrumb ben progettato offre ai motori di ricerca una rappresentazione chiara della gerarchia dei contenuti, facilitando la loro analisi e permettendo una migliore classificazione nelle pagine dei risultati. Questo aiuta il sito a posizionarsi meglio nelle ricerche organiche e a ottenere una maggiore esposizione.

Un altro aspetto importante riguarda il linking interno, cioè la connessione tra le diverse pagine del sito. Un sistema di breadcrumb ben implementato rafforza l’autorità delle pagine superiori nella gerarchia, migliorandone il posizionamento e contribuendo alla strategia SEO complessiva.

Un effetto diretto dell’utilizzo del breadcrumb è la riduzione della frequenza di rimbalzo, ovvero la percentuale di utenti che lasciano il sito senza interagire con altri contenuti. Grazie al breadcrumb, gli utenti possono facilmente esplorare sezioni correlate e trovare contenuti di loro interesse, evitando di abbandonare il sito dopo la prima interazione.

L’ottimizzazione della navigazione e della struttura interna del sito non solo migliora l’esperienza utente, ma aumenta la rilevanza del sito agli occhi dei motori di ricerca, contribuendo a ottenere posizionamenti più alti nei risultati di ricerca e una maggiore visibilità complessiva.

Il breadcrumb è quindi uno strumento fondamentale per garantire un’esperienza utente positiva e migliorare la SEO. Implementarlo correttamente significa rendere il sito più accessibile, intuitivo e ben strutturato, aumentando il valore sia per gli utenti che per i motori di ricerca.

Tipologie di Breadcrumb

I breadcrumb sono strumenti di navigazione che migliorano l’esperienza utente e offrono vantaggi SEO, ma il loro utilizzo deve essere adattato al contesto e alla struttura del sito web. Esistono diverse varianti di breadcrumb, ognuna con caratteristiche specifiche e applicazioni ideali.

Breadcrumb Gerarchico (o basato sulla struttura del sito)

Il breadcrumb gerarchico è il più utilizzato e mostra la posizione esatta dell’utente all’interno della gerarchia del sito. Segue la struttura logica del sito, partendo dalla home e mostrando le varie sezioni visitate.

Questa tipologia di breadcrumb è ideale per siti con categorie ben definite, come e-commerce, blog e siti aziendali, in cui l’organizzazione dei contenuti segue una logica precisa.

I principali vantaggi di questo approccio sono:

Aiutare gli utenti a comprendere la struttura generale del sito e a navigare in modo più fluido.
Consentire un ritorno rapido a sezioni superiori senza dover utilizzare il tasto "Indietro".
Facilitare la scoperta di nuovi contenuti, incentivando gli utenti a esplorare più pagine.

Esempio di breadcrumb gerarchico in un blog:
Home > Blog > Tecnologia > Intelligenza Artificiale > Articolo sul Machine Learning

Breadcrumb basato sugli attributi

Questa tipologia di breadcrumb è particolarmente utile nei siti e-commerce, dove gli utenti filtrano i prodotti in base a criteri specifici, come il brand, il colore, la taglia o il prezzo.

A differenza del breadcrumb gerarchico, che mostra la posizione nella struttura del sito, il breadcrumb basato sugli attributi evidenzia i filtri applicati durante la ricerca.

I principali vantaggi di questo sistema includono:

Permettere agli utenti di modificare facilmente i filtri senza perdere il contesto della ricerca.
Migliorare la precisione della navigazione, rendendo più chiaro quali opzioni sono state selezionate.
Favorire una migliore esperienza utente, soprattutto nei siti con ampio assortimento di prodotti.

Esempio di breadcrumb basato sugli attributi in un negozio online:
Home > Scarpe > Sneakers > Nike > Colore Nero > Taglia 42

Questo permette agli utenti di modificare i filtri senza dover ripetere la ricerca da zero.

Breadcrumb basato sulla cronologia

Il breadcrumb basato sulla cronologia segue il percorso effettivo dell’utente e mostra le pagine visitate in sequenza. A differenza del breadcrumb gerarchico, che riflette la struttura del sito, questo metodo è più simile alla cronologia del browser, offrendo un riferimento rapido sulle pagine già esplorate.

Questo tipo di breadcrumb è utile per:
Siti che non seguono una struttura rigida, come piattaforme di notizie o cataloghi digitali.
Situazioni in cui gli utenti visitano pagine in modo non lineare e hanno bisogno di un riferimento chiaro.
Applicazioni web in cui gli utenti possono tornare rapidamente a passaggi precedenti, come nei processi di acquisto o nelle configurazioni di prodotti.

Esempio di breadcrumb basato sulla cronologia in un e-commerce:
Pagina iniziale > Offerte del giorno > Smartphone > Dettagli prodotto > Carrello

Questo permette all’utente di tornare rapidamente alle offerte o ai dettagli dei prodotti senza dover cercare nuovamente gli articoli.

Quale tipo di Breadcrumb usare

La scelta della tipologia di breadcrumb dipende dalla struttura del sito web e dal tipo di navigazione che si vuole offrire agli utenti.

Se il sito ha una chiara gerarchia, il breadcrumb gerarchico è la soluzione migliore. Nei siti e-commerce con filtri avanzati, il breadcrumb basato sugli attributi offre un’esperienza più intuitiva. Per siti interattivi e dinamici, il breadcrumb basato sulla cronologia aiuta a mantenere traccia delle pagine visitate.

Implementare il breadcrumb corretto migliora l’usabilità del sito, favorisce la SEO e offre agli utenti una navigazione fluida e senza frustrazione.

Breadcrumb in Joomla

L’uso dei breadcrumb in Joomla è una strategia intelligente per migliorare la navigazione del sito e aumentare la visibilità su Google e altri motori di ricerca. Grazie al modulo integrato, è possibile creare percorsi chiari e intuitivi che guidano gli utenti nella struttura del sito senza complicazioni.

La configurazione è semplice e può essere personalizzata in base alle esigenze del progetto, garantendo un’esperienza di navigazione fluida e una maggiore accessibilità.

Come Funziona il Breadcrumb in Joomla

Joomla offre un modulo specifico per i breadcrumb, che permette di gestire e personalizzare la navigazione gerarchica del sito. Questo modulo crea automaticamente un percorso basato sulla struttura del menu, mostrando la gerarchia delle pagine e consentendo agli utenti di navigare tra di esse con facilità.

Le caratteristiche principali del breadcrumb in Joomla includono la visualizzazione gerarchica della posizione corrente, la possibilità di personalizzazione tramite CSS e la generazione automatica in base alla struttura del menu. Inoltre, il modulo favorisce l'integrazione con le strategie SEO per migliorare la visibilità del sito.

Il breadcrumb può essere utilizzato in qualsiasi tipo di sito Joomla, dai blog agli e-commerce, per offrire una navigazione più intuitiva e migliorare l’accessibilità alle sezioni del sito.

Attivare e Configurare il Breadcrumb in Joomla

Per aggiungere un breadcrumb al tuo sito Joomla, segui questi passaggi:

  1. Accedi al pannello di amministrazione di Joomla.
  2. Vai in Sistema > Moduli sito o Contenuto > Moduli sito
  3. Cerca il modulo "Breadcrumb" tra quelli disponibili.
  4. Attivalo e assegna una posizione visibile nel tuo template (ad esempio sopra il titolo della pagina).
  5. Personalizza le impostazioni del modulo, scegliendo se mostrare la Home, il nome della pagina corrente e la separazione tra le voci.
  6. Salva le modifiche e verifica la visualizzazione nel frontend del sito.

In Joomla, il breadcrumb può essere personalizzato visivamente utilizzando CSS, adattandolo al design del sito per garantirne un’integrazione estetica armoniosa.

Vantaggi del Breadcrumb in Joomla

Implementare un breadcrumb efficace in Joomla porta notevoli benefici, sia per la navigazione che per l’ottimizzazione SEO.

Migliora la User Experience, rendendo la navigazione più fluida e intuitiva. Aumenta la struttura logica del sito, facilitando la comprensione della gerarchia delle pagine. Ottimizza la SEO, offrendo ai motori di ricerca informazioni dettagliate sulla struttura del sito.

Riduce la frequenza di rimbalzo, poiché gli utenti possono esplorare rapidamente sezioni correlate senza abbandonare il sito.

Per ottenere il massimo dai breadcrumb, è consigliabile integrarli con le migliori pratiche di design e SEO, assicurandosi che siano ben visibili, facilmente leggibili e non eccessivamente lunghi.

Il Breadcrumb e gli errori nella Search Console di Google

Recentemente (aprile 2025) alcuni utenti di Joomla hanno segnalato problemi con la Search Console di Google, in particolare con la struttura dei breadcrumb. L’errore più comune riguarda il campo mancante "itemListElement", che impedisce ai breadcrumb di essere riconosciuti correttamente nei risultati di ricerca.

Un altro problema segnalato è legato ai dati strutturati, dove Google potrebbe non accettare alcuni elementi del markup dei breadcrumb, specialmente se l’ultimo elemento della lista non è un link.

Il Team di Joomla sta già lavorato su alcune correzioni per migliorare la compatibilità con Google, e ci sono discussioni attive nella community per risolvere definitivamente questi problemi. In quella che possiamo definire come la discussione risolutrice, viene proposta attualmente una modifica al file modules/mod_breadcrumbs/ tmpl/default.php o, meglio, creare un override e sostituire le poche righe modificate.

La discussione su Joomla Issue Tracker è specifica per il problema con la struttura del breadcrumb che ha causato errori nella Search Console di Google.

Gli sviluppatori hanno identificato che il markup dei dati strutturati non era completamente conforme alle linee guida di Google, in particolare per quanto riguarda il campo "itemListElement", che non correttamente formattato.

La soluzione proposta nella discussione prevede:

Modifiche al codice del modulo breadcrumb per garantire la corretta generazione dei dati strutturati.
Aggiornamenti alla logica di output per assicurare che ogni elemento del breadcrumb sia riconosciuto da Google.
Test e verifiche per garantire la compatibilità con le ultime versioni del CMS e con le richieste dei motori di ricerca.

La patch è attualmente in fase di revisione e, se approvata, verrà implementata nelle prossime uscite di Joomla per risolvere definitivamente il problema.

Puoi seguire la discussione Invalid breadcrumb module json-ld output a questo link. Probabilmente, nella Joomla 5.3.1 la patch verrà implementata.

Articoli Correlati