Dati strutturati di breadcrumb (BreadcrumbList
)
Una traccia di breadcrumb in una pagina indica la posizione della pagina nella gerarchia del sito e può semplificare la comprensione e la navigazione del sito da parte degli utenti. Un utente può navigare completamente nella gerarchia del sito, un livello alla volta, a partire dall'ultimo breadcrumb nella traccia di breadcrumb.
![lI breadcrumb mostra la gerarchia e la classificazione del sito web Breadcrumb visualizzato in una pagina web](https://developers-dot-devsite-v2-prod.appspot.com/static/search/docs/images/breadcrumb.png?authuser=6&hl=it)
Come aggiungere dati strutturati
I dati strutturati sono un formato standardizzato per fornire informazioni su una pagina e classificarne i contenuti. Se non li hai mai utilizzati, scopri di più su come funzionano i dati strutturati.
Ecco una panoramica su come creare, testare e rilasciare i dati strutturati. Per una guida passo per passo su come aggiungere dati strutturati a una pagina web, consulta il codelab sui dati strutturati.
- Aggiungi le proprietà obbligatorie. In base al formato che utilizzi, scopri dove inserire i dati strutturati nella pagina.
- Segui le linee guida.
- Convalida il codice utilizzando lo strumento di Test dei risultati avanzati e correggi eventuali errori critici. Prendi in considerazione anche la possibilità di correggere eventuali problemi non critici che potrebbero essere segnalati nello strumento, in quanto possono contribuire a migliorare la qualità dei tuoi dati strutturati (tuttavia, questo non è necessario per l'idoneità per i risultati avanzati).
- Implementa alcune pagine che includono dati strutturati e utilizza lo strumento Controllo URL per verificare come Google vede la pagina. Assicurati che la pagina sia accessibile per Google e che non venga bloccata da file robots.txt, tag
noindex
o requisiti di accesso. Se la pagina non presenta problemi, puoi chiedere a Google di ripetere la scansione degli URL. - Per tenere Google informata delle future modifiche, ti consigliamo di inviare una Sitemap. Puoi automatizzare questa operazione con l'API Search Console Sitemap.
Esempi
La Ricerca Google utilizza il markup di tipo breadcrumb nel corpo di una pagina web per classificare le informazioni dalla pagina nei risultati di ricerca. Spesso, come illustrato nei seguenti casi d'uso, gli utenti possono arrivare a una pagina da tipi molto diversi di query di ricerca. Se da un lato ogni ricerca può restituire la stessa pagina web, dall'altro il breadcrumb
classifica i contenuti nel contesto della query della Ricerca Google. L'elemento
ancillaryjustice.html
della pagina potrebbe visualizzare tracce di breadcrumb diverse
a seconda del contesto di ricerca.
Traccia di breadcrumb singola
Una query di ricerca relativa a un anno e un premio dedicato a un genere specifico, ad esempio "romanzo premio Nebula 2014", può generare il seguente breadcrumb:
Libri › Fantascienza › Vincitori del premio
JSON-LD
Ecco un esempio in formato JSON-LD per supportare il breadcrumb:
<html> <head> <title>Award Winners</title> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Books", "item": "https://example.com/books" },{ "@type": "ListItem", "position": 2, "name": "Science Fiction", "item": "https://example.com/books/sciencefiction" },{ "@type": "ListItem", "position": 3, "name": "Award Winners" }] } </script> </head> <body> </body> </html>
RDFa
Ecco un esempio in formato RDFa per supportare il breadcrumb:
<html> <head> <title>Award Winners</title> </head> <body> <ol vocab="https://schema.org/" typeof="BreadcrumbList"> <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books"> <span property="name">Books</span></a> <meta property="position" content="1"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books/sciencefiction"> <span property="name">Science Fiction</span></a> <meta property="position" content="2"> </li> › <li property="itemListElement" typeof="ListItem"> <span property="name">Award Winners</span> <meta property="position" content="3"> </li> </ol> </body> </html>
Microdati
Ecco un esempio in formato Microdati per supportare il breadcrumb:
<html> <head> <title>Award Winners</title> </head> <body> <ol itemscope itemtype="https://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href="https://example.com/books"> <span itemprop="name">Books</span></a> <meta itemprop="position" content="1" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemscope itemtype="https://schema.org/WebPage" itemprop="item" itemid="https://example.com/books/sciencefiction" href="https://example.com/books/sciencefiction"> <span itemprop="name">Science Fiction</span></a> <meta itemprop="position" content="2" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <span itemprop="name">Award winners</span> <meta itemprop="position" content="3" /> </li> </ol> </body> </html>
HTML
Di seguito è riportato un esempio di blocco di breadcrumb all'interno della pagina HTML come parte del design visivo.
<html> <head> <title>Award Winners</title> </head> <body> <ol> <li> <a href="https://www.example.com/books">Books</a> </li> <li> <a href="https://www.example.com/sciencefiction">Science Fiction</a> </li> <li> Award Winners </li> </ol> </body> </html>
Tracce di breadcrumb multiple
Se esistono diversi modi per accedere a una pagina del tuo sito, puoi specificare tracce di breadcrumb multiple per una singola pagina. Ecco una traccia di breadcrumb che porta a una pagina di libri vincitori di premi:
Libri › Fantascienza › Vincitori del premio
Ecco un'altra traccia di breadcrumb che porta alla stessa pagina:
Letteratura › Vincitori di premi
JSON-LD
Ecco un esempio in formato JSON-LD che supporta tracce di breadcrumb multiple:
<html> <head> <title>Award Winners</title> <script type="application/ld+json"> [{ "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Books", "item": "https://example.com/books" },{ "@type": "ListItem", "position": 2, "name": "Science Fiction", "item": "https://example.com/books/sciencefiction" },{ "@type": "ListItem", "position": 3, "name": "Award Winners" }] }, { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Literature", "item": "https://example.com/literature" },{ "@type": "ListItem", "position": 2, "name": "Award Winners" }] }] </script> </head> <body> </body> </html>
RDFa
Ecco un esempio in formato RDFa che supporta tracce di breadcrumb multiple:
<html> <head> <title>Award Winners</title> </head> <body> <ol vocab="https://schema.org/" typeof="BreadcrumbList"> <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books"> <span property="name">Books</span></a> <meta property="position" content="1"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books/sciencefiction"> <span property="name">Science Fiction</span></a> <meta property="position" content="2"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books/sciencefiction/awardwinners"> <span property="name">Award Winners</span></a> <meta property="position" content="3"> </li> </ol> <ol vocab="https://schema.org/" typeof="BreadcrumbList"> <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/literature"> <span property="name">Literature</span></a> <meta property="position" content="1"> </li> › <li property="itemListElement" typeof="ListItem"> <span property="name">Award Winners</span> <meta property="position" content="2"> </li> </ol> </body> </html>
Microdati
Ecco un esempio in formato Microdati che supporta tracce di breadcrumb multiple:
<html> <head> <title>Award Winners</title> </head> <body> <ol itemscope itemtype="https://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href="https://example.com/books"> <span itemprop="name">Books</span></a> <meta itemprop="position" content="1" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemscope itemtype="https://schema.org/WebPage" itemprop="item" itemid="https://example.com/books/sciencefiction" href="https://example.com/books/sciencefiction"> <span itemprop="name">Science Fiction</span></a> <meta itemprop="position" content="2" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href="https://example.com/books/sciencefiction/awardwinners"> <span itemprop="name">Award Winners</span></a> <meta itemprop="position" content="3" /> </li> </ol> <ol itemscope itemtype="https://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href="https://example.com/literature"> <span itemprop="name">Literature</span></a> <meta itemprop="position" content="1" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <span itemprop="name">Award Winners</span> <meta itemprop="position" content="2" /> </li> </ol> </body> </html>
HTML
Di seguito è riportato un esempio di blocco di breadcrumb all'interno della pagina HTML come parte del design visivo.
<html> <head> <title>Award Winners</title> </head> <body> <ol> <li> <a href="https://www.example.com/books">Books</a> </li> <li> <a href="https://www.example.com/books/sciencefiction">Science Fiction</a> </li> <li> Award Winners </li> </ol> <ol> <li> <a href="https://www.example.com/literature">Literature</a> </li> <li> Award Winners </li> </ol> </body> </html>
Linee guida
Devi seguire queste linee guida affinché i tuoi contenuti siano idonei per la visualizzazione con i breadcrumb nella Ricerca Google.
Ti consigliamo di fornire i breadcrumb che rappresentano un percorso utente tipico di una pagina, anziché riprodurre la struttura dell'URL. Alcune parti del percorso dell'URL non aiutano gli utenti a capire come si inserisce la pagina nel tuo sito web. Ad esempio, considerato l'URL
https://example.com/pages/books/catcher_in_the_rye.html
, non aggiungono informazioni né il percorso
pages
nell'URL né l'elemento di primo livello
example.com
.
Definizioni dei tipi di dati strutturati
Per specificare i breadcrumb, definisci un BreadcrumbList
che contenga almeno due ListItems
. Affinché i tuoi contenuti siano idonei per essere visualizzati con i breadcrumb,
devi includere le proprietà obbligatorie.
BreadcrumbList
BreadcrumbList
è l'elemento contenitore che include tutti gli elementi nell'elenco. La definizione completa di BreadcrumbList
è disponibile all'indirizzo schema.org/BreadcrumbList.
Le proprietà supportate da Google sono le seguenti:
Proprietà obbligatorie | |
---|---|
itemListElement |
Un array dei breadcrumb elencati in un ordine specifico. Specifica ogni breadcrumb con un elemento
{ "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Books", "item": "https://example.com/books" },{ "@type": "ListItem", "position": 2, "name": "Authors", "item": "https://example.com/books/authors" },{ "@type": "ListItem", "position": 3, "name": "Ann Leckie", "item": "https://example.com/books/authors/annleckie" }] } |
ListItem
ListItem
contiene i dettagli su un singolo elemento nell'elenco. La definizione completa di ListItem
è disponibile all'indirizzo schema.org/ListItem.
Le proprietà supportate da Google sono le seguenti:
Proprietà obbligatorie | |
---|---|
item |
L'URL della pagina web che rappresenta il breadcrumb. Esistono due modi per specificare
Se il breadcrumb è l'ultimo elemento della traccia di breadcrumb, |
name |
Il titolo del breadcrumb visualizzato per l'utente. Se utilizzi |
position |
La posizione del breadcrumb nella traccia di breadcrumb. La posizione 1 indica l'inizio della traccia. |
Monitorare i risultati avanzati con Search Console
Search Console è uno strumento che consente di monitorare il rendimento delle tue pagine in Ricerca Google. Registrarsi in Search Console non è obbligatorio per essere inclusi nei risultati di Ricerca Google, ma può aiutarti a capire e migliorare il modo in cui Google vede il tuo sito. Ti consigliamo di controllare Search Console nei seguenti casi:
- Dopo aver effettuato il deployment dei dati strutturati per la prima volta
- Dopo aver rilasciato nuovi modelli o aggiornato il codice
- Analisi periodica del traffico
Dopo aver effettuato il deployment dei dati strutturati per la prima volta
Dopo che Google ha indicizzato le tue pagine, cerca i problemi utilizzando il report sullo stato dei risultati avanzati pertinente. L'ideale sarebbe un aumento degli elementi validi e nessun aumento di quelli non validi. Se riscontri problemi nei dati strutturati:
- Correggi gli elementi non validi.
- Controlla un URL pubblicato per verificare se il problema persiste.
- Richiedi la convalida utilizzando il report sullo stato.
Dopo aver rilasciato nuovi modelli o aggiornato il codice
Quando apporti modifiche significative al tuo sito web, monitora l'aumento degli elementi non validi dei dati strutturati.- Se vedi un aumento di errori, forse hai reso disponibile un nuovo modello non funzionante oppure il tuo sito interagisce con il modello esistente in modo nuovo, ma non corretto.
- Se noti una diminuzione degli elementi validi (non associata a un aumento di quelli non validi), forse non stai più incorporando dati strutturati nelle tue pagine. Utilizza lo strumento Controllo URL per scoprire la causa del problema.
Analisi periodica del traffico
Analizza il traffico di Ricerca Google utilizzando il rapporto sul rendimento. I dati mostrano la frequenza con cui la pagina viene visualizzata nei risultati multimediali nella Ricerca, la frequenza con cui gli utenti fanno clic e qual è la posizione media che visualizzi nei risultati di ricerca. Puoi anche estrarre automaticamente questi risultati con l'API Search Console.Risoluzione dei problemi
Se hai difficoltà con l'implementazione o il debug dei dati strutturati, ecco alcune risorse che potrebbero esserti utili.
- Se utilizzi un sistema di gestione dei contenuti (CMS) o un'altra persona si sta occupando del tuo sito, chiedile di aiutarti. Assicurati di inoltrarle gli eventuali messaggi di Search Console che illustrano il problema.
- Google non garantisce che le funzionalità che utilizzano dati strutturati vengano visualizzate nei risultati di ricerca. Per un elenco delle cause comuni per cui i tuoi contenuti potrebbero non essere mostrati da Google in un risultato avanzato consulta le linee guida generali sui dati strutturati.
- I tuoi dati strutturati potrebbero contenere un errore. Consulta l'elenco degli errori nei dati strutturati e il report sui dati strutturati non analizzabili.
- Se i dati strutturati della tua pagina sono interessati da un'azione manuale, i dati strutturati sulla pagina verranno ignorati (sebbene la pagina possa ancora essere visualizzata nei risultati della Ricerca Google). Per risolvere i problemi relativi ai dati strutturati, utilizza il report Azioni manuali.
- Consulta nuovamente le linee guida per verificare se i tuoi contenuti non sono conformi. Il problema può essere causato dall'utilizzo di contenuti di spam o di markup di spam. Tuttavia, il problema potrebbe non riguardare la sintassi e perciò non essere identificato dal Test dei risultati avanzati.
- Risolvi i problemi relativi a risultati avanzati mancanti o a un calo del numero totale di risultati avanzati.
- Lascia del tempo per le nuove operazioni di scansione e indicizzazione. Ricorda che possono passare diversi giorni dopo la pubblicazione di una pagina prima che Google la rilevi e la sottoponga a scansione. Per domande generali sulla scansione e sull'indicizzazione, consulta le Domande frequenti (FAQ) relative alla scansione e all'indicizzazione della Ricerca Google.
- Pubblica una domanda nel forum di Google Search Central.