Home
  1. Informatica
  2. Creare siti web
  3. Cosa sono i dati strutturati, come inserirli nelle pagine HTML

Cosa sono i dati strutturati, come inserirli nelle pagine HTML

Vediamo come s'inseriscono i dati strutturati di schema.org nel formato MICRODATA

Attraverso l'uso di esempi descrittivi, l'articolo ti guida alla comprensione e uso dei dati strutturati schema.org.

   Livello: Iniziale 
 

Foto: Pixabay.com

Veniamo a un argomento molto interessante nella progettazione del sito internet. Scopriamo cosa sono i dati strutturati. La loro funzione e importanza nel sito web e come si implementano in una pagina HTML. Nel presente articolo ci occuperemo in particolare dei dati strutturati di schema.org e del loro uso nella forma dei MICRODATA.

Cosa sono i dati strutturati

Partiamo col definire semplicemente cosa sono i dati strutturati. I dati strutturati sono informazioni "catalogate" in un database o organizzate secondo uno schema di regole ben definite. Si differenziano dai dati non strutturati i quali sono privi di ogni "catalogazione": dati grezzi. Come esempio di riferimento di dati non strutturati, possiamo considerare una pagina con immagini e testo privi di etichette di catalogazione, privi di uno schema di classificazione.

A cosa servono?

I dati strutturati come schema.org o data-vocabulary.org (progetto chiuso e sostituito da schema.org) e altri, servono principalmente ai motori di ricerca per comprendere meglio il contenuto delle pagine web. Arricchire d'informazioni interpretabili le pagine HTML del nostro progetto web, rende un grosso favore ai sistemi informatici che analizzano la tua pagina e cercano di capire di cosa si tratta.

Ciò non vuol dire che otterrai miracoli nel posizionamento delle tue pagine, nei risultati di ricerca organici dei motori di ricerca. Sicuramente è un grande aiuto per una migliore indicizzazione. In alcune specifiche condizioni, il loro uso può diventare un eccezionale aiuto pro SEO per il tuo sito.

Cosa e come si classificano i dati strutturati

I dati strutturati permettono di catalogare le informazioni presenti in una pagina HTML. Puoi catalogare il nome dell'autore che ha scritto l'articolo, il nome e cognome d'una persona citata nell'articolo, il nome di un libro, l'autore del libro, la casa editrice del libro, la data di pubblicazione del libro. E ancora puoi catalogare un monumento citato nell'articolo, la chiesa, la città, la nazione, il nome di un lago, e tantissimi altri oggetti sono classificabili grazie ai dati strutturati.

Gli oggetti, immagini, video e testo, presenti nella pagina web, sono catalogabili con le proprietà dello schema di riferimento. Immagina di scrivere una pagina web che descrive un tuo recente viaggio a San Marino. Usando uno o più schemi appropriati, potrai catalogare i monumenti, le attività commerciali che consiglierai di visitare. Se una sezione dell'articolo tratta la storia di San Marino, potrai classificare i nomi storici menzionati. Sicuramente aggiungerai delle immagini e anche quelle possono essere catalogate, insieme alla loro eventuale didascalia.

Come

I tag che si usano sono:

itemscope="" itemtype="" itemprop="" itemid=""

Cosa è schema.org

I dati strutturati di schema.org sono quelli che consiglio di usare, perché sviluppati direttamente da Google, Microsoft e tante altre grandi aziende del settore ICT. Il progetto data-vocabulary.org ha ceduto lo scettro a quest'ultimo.

Schema.org presenta una costellazione in espansione di schemi, utili per molti campi. Trovi gli schemi per il blog, gli schemi per articoli generici o articoli tecnici o articoli scolastici. Trovi gli schemi per gli e-shop, dedicati alla medicina, ai luoghi, ai monumenti, ai libri, alla musica, alla televisione, alla tua tesi di laurea.

Sono tanti gli schemi disponibili. Molti hanno assunto una struttura stabile e, seppure non è pienamente corretto dire definitiva, essi hanno un elenco di proprietà ben definito.

Come funziona schema.org

Prendiamo uno schema e scriviamo un esempio di pagina HTML con dati strutturati nel formato MICRODATA: il più semplice da usare, per me.

Mettiamo di voler creare un Blog personale generico, nel quale semplicemente raccogliamo le nostre esperienze quotidiane e alcune fotografie. Usiamo lo schema http://schema.org/Blog

<!DOCTYPE html>
<html lang="it" itemscope itemtype="http://schema.org/Blog">
<head>
<title>Pagina del blog</title>
<meta charset="utf-8">
</head>
<body>
<header>
</header>
<nav>
</nav>
<section>
<article>

<p>Data del post: <time itemprop="datePublished" datetime="2016-02-13T13:09+01:00">13 febbraio 2016</time></p>

<h1  itemprop="headline">Titolo dell'articolo</h1>
<h2  itemprop="alternativeHeadline">Sotto titolo del post</h2>
<p  itemprop="description">Descrizione sintetica dell'articolo</p>

<img alt="immagine del post" src="nome-immagine.jpg" width="320" height="240" itemprop="image">

<div itemprop="text">
<p>Questi che seguono sono i paragrafi dell'articolo scritto per il mio Blog personale</p>
<p>Seguono una serie di paragrafi.</p>
</div>

<p itemprop="author" itemscope itemtype="https://schema.org/Person"><span itemprop="name">Nome Cognome</span></p>

</article>
</section>
<footer>
</footer>
</body>
</html>
Spiegazione delle proprietà

Abbiamo definito nel tag <html> lo schema da usare. Quindi abbiamo usato alcune proprietà racchiuse nel tag itemprop="". Indichiamo la data dell'articolo con il tag <time> scrivendolo come nell'esempio. Per identificare il titolo del post si usa la proprietà headline, per i sottotitoli alternativeHeadline. Per definire la descrizione dell'articolo description. Tra titoli e corpo del testo è presente un'immagine, catalogata con la proprietà image. Quindi si classifica il corpo dell'articolo con la proprietà text. In fine il nome e cognome dell'autore è definito secondo lo schema Person, usando la proprietà name.

Tieni presente che all'interno di uno schema è possibile includere altri schemi. Mettiamo che nel post racconti una giornata vissuta in riva al lago di Bomba, in provincia di Chieti. Puoi informare i motori di ricerca, che l'articolo contiene contenuti riferiti a questo luogo geografico come segue:

Domenica sono stato con tutta la famiglia in visita al
<span itemscope itemtype="http://schema.org/LakeBodyOfWater"><span itemprop="name">Lago di Bomba</span></span>
, ubicato nel comune di
<span itemscope itemtype="http://schema.org/City"><span itemprop="name">Bomba</span></span>.

Una miniera di informazioni

Gli schemi a disposizione sono davvero tanti. Devi concentrarti su quelli più utili alle tue esigenze. Inoltre non vanno usati per "barare" con i motori di ricerca. Inutile inserire informazioni fuori dal contesto dell'articolo, solo per attirare qualche contatto utente in più sul sito. I motori di ricerca se ne accorgono e poi declassano l'articolo nei risultati organici di ricerca.

Open Graph è il protocollo usato da Facebook per arricchire i tuoi articolo, quando l'url è condiviso in un post sul social network. L'articolo "Come inserire i dati strutturati Open Graph per Facebook nei post del tuo sito", ti guida nella implementazione.

RIFERIMENTI
Dati strutturati schema.org
Strumenti utili

 

Articoli Recenti

⟩⟩ Il ritorno di Zcash sulla cloud mining HashFlare    ⟩⟩ Biorepair dentifricio notte senza fluoro. Io l'ho comprato e...    ⟩⟩ Le nuove regole della scrittura di Ann Handley. Io l'ho letto    ⟩⟩ Premium cinema anteprima e serie TV di ottobre 2017    ⟩⟩ Il Grand Finale della sonda Cassini Saturno in diretta streaming