Dati strutturati: markup e rich snippet con schema.org

Duro il lavoro dei motori di ricerca al giorno d’oggi, con la mole di siti e informazioni in essi contenute. I crawler di Google, Bing e Yahoo scansionano continuamente la rete, trovano i siti e cercano di interpretare il loro contenuto per catalogarli. Non sempre questa operazione risulta facile, con il risultato che i motori di ricerca non riescono a indicizzare correttamente tutti i siti web, a meno che non vengano utilizzati i dati strutturati.

Da qualche anno a questa parte, proprio per ovviare a questi inconvenienti, i principali motori di ricerca si sono accordati per l’utilizzo dei dati strutturati. Un vocabolario di markup da inserire nelle pagine web dal quale attingere per mostrare informazioni arricchite (rich snippet) e catalogare le pagine stesse grazie a schema org.

IL VOCABOLARIO SCHEMA.ORG

Questo vocabolario di dati strutturati si chiama schema.org e non è altro che un database che contiene tutte le parole utili a descrivere una pagina web, divise per categoria.

Le categorie sono veramente tante ed in linea di principio dovrebbero coprire tutte le esigenze dei webmaster, che possono individuare i markup corretti per descrivere una determinata pagina. Questa ad esempio è la categoria per marcare una pagina di notizie:

La lista completa è disponibile sul sito schema.org a questo indirizzo ed è organizzata secondo una gerarchia delle proprietà come puoi vedere nella immagina che segue:

gerarchia_schema.org

Ricordo che schema.org è un vocabolario, non è un linguaggio di programmazione, per cui per marcare la categoria all’interno della tua pagina web, devi fare riferimento a microdata.

MICRODATA E RICH SNIPPET

Microdata è una sintassi che utilizza tag HTML per nidificare dati strutturati che descrivono una pagina (metadata) e vengono inseriti all’interno del codice html della pagina stessa.

Per cui grazie a microdata e schema.org sarai in grado di far sapere a Google e compagni di cosa tratta la tua pagina web. Inoltre potrai fare in modo che nella pagina di ricerca vengano mostrate agli utenti delle informazioni aggiuntive (rich snippet).

I dati strutturati sono infatti informazioni extra che i crawler utilizzano per migliorare i risultati nella pagina di ricerca (SERP).

Questi miglioramenti sono a vantaggio dell’utente finale che, non solo avrà dei risultati più precisi, ma avrà anche dei contenuti più ricchi e delle informazioni aggiuntive direttamente disponibili nella pagina di ricerca. Puoi vedere un esempio di rich snippet nella immagine seguente:

rich snippet

Ma vediamo nel dettaglio quali sono questi tags html (microdata) da inserire nel codice della tua pagina web per implementare i dati strutturati con schema.org:

Itemscope indica al motore di ricerca che stai per indicare dei dati strutturati che verranno meglio specificati dopo.

Itemtype specifica il tipo di elemento da selezionare nel vocabolario schema.org (Event – Person – CreativeWork).

Itemprop indica le proprietà dell’elemento specificato.

ESEMPIO DI MICRODATA

<div itemscope itemtype=”http://schema.org/CreativeWork/Article>

<span itemprop=”name”>Dati strutturati: markup e rich snippet con schema.org</span>

<span itemprop=”description”>un articolo per capire cosa sono i dati strutturati</span>

<meta itemprop=“datePublished” content=“2016-07-17”>Jul 17, 2016

</div>

Per cui vediamo che con la prima riga dichiaro che sto per fornire dei dati strutturati e che saranno inerenti la categoria Article che sta dentro la categoria CreativeWorks del vocabolario schema.org. Nella seconda riga dichiaro il nome (una proprietà) di questo articolo, nella terza riga la descrizione e nella quarta la data di pubblicazione.

Proprietà come “name”, “description” e “dataPublished” sono presenti nella categoria “Article” di schema.org, nella lista completa puoi trovare tutte le proprietà che devono essere utilizzate per essere digeribili dai motori di ricerca.

Per quanto riguarda i tag html, <div indica quando l’elemento inizia e finisce con </div>, il testo compreso fra i tag <span> e </span> sarà inserito nella pagina ma senza modificarne il layout. Infine <meta> serve a nascondere alcune informazioni agli utenti, ma che saranno lette dai motori di ricerca. Attenzione a non esagerare con dati non visibili agli utenti, non sono visti di buon occhio da Google.

ASSISTENZA PER IL MARKUP

Abbiamo visto come scrivere il codice che serve a comunicare ai motori di ricerca i dati strutturati, esiste poi uno strumento molto utile che serve a generare in automatico il codice da incollare nella tua pagina.

Sto parlando dello strumento di assistenza per il markup di Google, che ti permette di inserire la categoria e  l’Url della pagina in cui vuoi inserire i dati, infine di evidenziare i dati direttamente sulla tua pagina con un semplice clic.

Con lo strumento di test dei dati strutturati di Google è invece possibile inserire l’Url della pagina in cui risiedono i dati da testare e verificarne il corretto funzionamento.

Lascia un commento