Introduzione a RDFa

Questa è la traduzione dell'articolo Introduction to RDFa di Mark Birbek, pubblicato originariamente su A List Apart il 23 Giugno 2010. La traduzione viene qui presentata con il consenso dell'editore (A List Apart Magazine) e dell'autore.

RDFa ("Resource Description Framework in attributes") sta vivendo da un po' il suo momento di celebrità. Google sta iniziando a processare RDFa e i Microformati nella sua opera di indicizzazione del web, usando i dati raccolti per migliorare la visualizzazione dei risultati di ricerca con i cosiddetti "rich snippets". Yahoo!, nel frattempo, aveva iniziato a processare RDFa già da un anno. Con questi due giganti della ricerca che operano sulla stessa traiettoria, un nuovo tipo di web è più vicino che mai.

Il web è stato progettato per essere fruito da esseri umani, gran parte delle informazioni ricche e utili che contiene sono inaccessibili alle macchine. Le persone sono in grado di adeguarsi a tutte le varianti possibili in fatto di layout, ortografia, colore, posizione, etc. continuando ad estrarre il giusto significato dalla pagina. Le macchine, dal canto loro, hanno bisogno di un po' di aiuto.

Un nuovo tipo di web, un web semantico, dovrebbe essere fatto di informazioni marcate in modo tale che un software possa facilmente comprenderle. Prima di considerare il modo in cui poter realizzare un web siffatto, vediamo cosa potremmo essere in grado di fare con esso.

Una ricerca migliorata

Aggiungendo dati adatti ad essere consumati da una macchina in una pagina web possiamo migliorare la nostra capacità di fare ricerche. Immaginate una news che dice più o meno "oggi il primo ministro è partito alla volta dell'Australia", con riferimento al primo ministro della Gran Bretagna, Gordon Brown. L'articolo potrebbe non citare per nome il primo ministro, ma è molto facile supporre che questa notizia comparirà quando qualcuno fa un ricerca per la chiave "Gordon Brown".

Se l'articolo in questione risale al 1940, tuttavia, non vorremmo che questo documento apparisse quando un utente cerca "Gordon Brown", ma quando cerca "Winston Churchill".

Per raggiungere questo obiettivo usando la stessa tecnica vista nell'esempio di Gordon Brown (ovvero mappando un set di parole su un altro), il nostro motore di ricerca dovrebbe conoscere le date di inizio e fine delle presidenze di tutti i primi ministri inglesi, per poi fare dei riferimenti incrociati tra queste e la data di pubblicazione dell'articolo di giornale. Ciò non sarebbe del tutto impossibile, ma cosa avverrebbe se l'articolo fosse un brano di narrativa o se facesse riferimento al primo ministro australiano? In questi casi una semplice lista di date non ci aiuterebbe.

Gli algoritmi di indicizzazione che provano a dedurre il contesto necessario dal testo miglioreranno di certo negli anni a venire, ma un markup aggiuntivo che renda l'informazione non ambigua può solo rendere la ricerca più accurata.

Interfacce utente migliorate

Yahoo! e Google hanno iniziato a usare RDFa per migliorare l'esperienza dell'utente ottimizzando la modalità di visualizzazione dei singoli risultati di una ricerca. Ecco l'approccio di Google:

Ed ecco quello di Yahoo!:

C'è un vantaggio commerciale nell'avere una maggiore "comprensione" da parte del motore di ricerca dei contenuti della pagina indicizzati: annunci pubblicitari più rilevanti possono essere inseriti a fianco dei risultati della ricerca.

Ora che sappiamo perché sarebbe auspicabile inserire dati adatti alle macchine nelle nostre pagine, possiamo chiederci in che modo farlo.

Le funzionalità sui metadati di HTML

Avete sicuramente una certa familiarità con le funzionalità relative ai metadati supportate da HTML. Quelle più usate sono gli elementi meta e link. Alcuni di voi sanno forse che l'attributo @rel usato con l'elemento link può essere usato anche con gli elementi a (uso in questo contesto il termine "HTML" per riferirmi alle "famiglie di linguaggi HTML" dal momento che quanto dirò si applica sia ad HTML sia a XHTML).

Considereremo prima queste funzionalità esistenti perché forniscono le fondamenta concettuali su cui RDFa è stato concepito e realizzato.

L'uso di meta e link nel linguaggio HTML

Gli elementi meta e link risiedono nella sezione head di un documento. Ci consentono di fornire delle informazioni che sono correlate a quelle presenti in quel documento. Per esempio, potrei voler specificare che ho creato il mio documento il giorno 9 maggio 2009, che io sono l'autore e che concedo ad altre persone il diritto di usare l'articolo come meglio credono:

<html>
<head>
  <title>RDFa: Now everyone can have an API</title>
  <meta name="author" content="Mark Birbeck" />
  <meta name="created" content="2009-05-09" />
  <link rel="license" href="http://creativecommons.org/licenses/ »
by-sa/3.0/" />
</head>
.
.
.
</html>

Questo esempio mostra come HTML riservi uno spazio ad hoc ai metadati, uno spazio distinto dal testo del documento stesso. HTML usa la sezione head per i metadati e la sezione body per tutti i tipi di contenuti presenti nella pagina.

HTML ci consente anche di "confondere" queste due aree: possiamo piazzare l'attributo @rel su un link cliccabile continuando a mantenere il significato che esso ha nel contesto dell'elemento link.

Usare @rel

Immaginate che io voglia consentire ai visitatori del mio sito di visualizzare la mia licenza Creative Commons. Per come stanno le cose, l'informazione relativa alla licenza a cui faccio riferimento è nascosta ai lettori perché si trova nella sezione head. Ma la cosa si può risolvere aggiungendo un elemento a nel corpo dl documento:

<a href="http://creativecommons.org/licenses/by-sa/3.0/">
CC Attribution-ShareAlike</a>

Tutto ciò va bene e ci consente di raggiungere i nostri scopi. Prima di tutto abbiamo metadati leggibili da una macchina nella sezione head che descrivono la relazione tra la licenza e il documento:

<link rel="license" href="http://creativecommons.org/licenses/ »
by-sa/3.0/" />

Poi, abbiamo un link nel body che consente a un essere umano di cliccare e leggere la licenza:

<a href="http://creativecommons.org/licenses/by-sa/3.0/">
CC Attribution-ShareAlike</a>

Ma HTML ci consente anche di usare l'attributo @rel dell'elemento link su un elemento a. In altre parole, consente che metadati che appaiano normalmente nella sezione head di un documento appaiano nel body.

Con questa tecnica tanto potente possiamo inserire sia i metadati per le macchine sia i link cliccabili per gli esseri umani in un unico posto:

<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">
CC Attribution-ShareAlike</a>

Questo semplice metodo di arricchire il markup con metadati non è usato spesso nelle pagine web, ma rappresenta di fatto il cuore di RDFa. Con questo infatti arriviamo al primo principio chiave di RDFa.

Regola 1

Gli elementi link e a implicano che vi sia una relazione tra il documento corrente e altri documenti; l'attributo @rel ci consente di fornire un valore che descriverà al meglio tale relazione.

Non dimenticate: usando @rel con l'elemento a traiamo vantaggio di una caratteristica di HTML già esistente, caratteristica su cui RDFa richiama poi la sua attenzione.

Applicare diverse licenze alle immagini

L'esempio precedente fornisce informazioni sulle licenze rispetto alla pagina che le contiene. Ma cosa fare in cui una pagina contenga più item, ognuno dei quali con una sua licenza specifica? Non ci vuole molto a immaginare scenari in cui ciò potrebbe accadere, basti pensare a una pagina con i risultati di una ricerca svolta su Flickr, YouTube o SlideShare.

RDFa prende la semplice idea che sta dietro all'uso di @rel (esprimere una relazione tra due cose) e su di essa si fonda, consentendo all'attributo di essere applicato all'attributo src dell'elemento img.

Così, per esempio, immaginate una pagina di risultati su Flickr:

<img src="image1.png" />
<img src="image2.png" />

Diciamo che la prima immagine è distribuita con una licenza Creative Commons di tipo Attribution-ShareAlike, mentre la seconda usa una licenza Attribution-Noncommercial-No Derivative Works. Come opereremo?

Se avete pensato che basterà usare nel modo giusto l'attributo @rel sul tag img avete indovinato. Per esprimere due diversi tipi di licenza, uno per ciascuna immagine, facciamo semplicemente così:

<img src="image1.png"
  rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/" />
<img src="image2.png"
  rel="license" href="http://creativecommons.org/licenses/ »
 by-nc-nd/3.0/" />

Nell'esempio appena visto potete vedere in azione il principio chiave, basato sulle funzionalità relative ai metedati già presenti in HTML. È una cosa che semplifica la vita a quanti vogliono approcciare RDFa partendo da concetti già noti derivati da HTML.

Regola 2

Gli attributi @rel e @href non sono più limitati agli elementi a e link, ma possono essere usati anche sul tag img per indicare una relazione tra l'immagine e altri elementi.

Aggiungere proprietà al body

Nella nostra illustrazione delle caratteristiche di HTML abbiamo anche visto che possiamo aggiungere proprietà testuali relative al documento:

<meta name="author" content="Mark Birbeck" />
<meta name="created" content="2009-05-01" />

Questo snippet di codice ci dice chi ha creato il documento e quando, ma può essere usato solo nella head del documento. RDFa consente, basandosi su tale concetto, di usarlo nell'elemento body; @content non è più quindi confinato al tag meta, ma può apparire su qualunque elemento.

Fine prima parte.

Regola 3:

Di norma, in un documento HTML, le proprietà sono definite nella sezione head del documento stesso, usando @content con il tag meta. Nei documenti HTML con RDFa, @content può essere usato per definire proprietà su qualsiasi elemento.

C'è però un picco cambiamento rispetto al modo in cui @content è usato nella sezione head. Dal momento che l'attributo @name è già usato per uno scopo differente in altri parti del codice HTML, potrebbe portare a una certa confusione usarlo per rappresentare la proprietà name nel body. RDFa, dunque, fornisce un nuovo attributo, chiamato @property, che svolge questa funzione.

Regola 4:

Supponiamo che la data di pubblicazione del nostro documento e il nome dell'autore siano all'interno della sezione head, e che le stesse informazioni si trovino in una forma leggibile per gli umani nel body del documento:

<html>
<head>
  <title>RDFa: Now everyone can have an API</title>
  <meta name="author" content="Mark Birbeck" />
  <meta name="created" content="2009-05-09" />
</head>
<body>
  <h1>RDFa: Now everyone can have an API</h1>
  Author: <em>Mark Birbeck</em>
  Created: <em>May 9th, 2009</em>
</body>
</html>

Con RDFa possiamo unire questi due insiemi di informazioni in modo tale che i metadati siano collocati nello stesso punto del testo leggibile:

<html>
<head>
  <title>RDFa: Now everyone can have an API</title>
</head>
<body>
  <h1>RDFa: Now everyone can have an API</h1>
  Author: <em property="author" content="Mark Birbeck">
    Mark Birbeck</em>
  Published: <em property="created" content="2009-05-09">
    May 14th, 2009</em>
</body>
</html>

Vedremo presto come questo esempio possa essere migliorato. Per ora dobbiamo solo comprendere come, sia che siano scritti nella head, sia che siano scritti nel body, i metadati significano la stessa cosa; si tratta, praticamente, dell'equivalente della tecnica basata su @rel che HTML già usa per stabilire relazioni nel contesto del body del documento.

Usare i vocabolari

A questo punto dobbiamo fare una piccola digressione. Possiamo smettere di usare @name="author" nella sezione head del documento perché anche se la proprietà "author" non è definita in nessuna specifica, negli anni la gente ha iniziato ad aspettarsi di poterla utilizzare. Ma RDFa consente (e richiede) molta più precisione. Quando usiamo un termine come "autore" o "creato", dobbiamo indicare da dove quel termine proviene. Se non lo facciamo, non abbiamo modo di sapere se ciò che voi intendete per "autore" sia la stessa cosa che intendo io.

Ciò potrebbe sembrare non necessario. Dopo tutto, come si potrebbe confondere un termine così ovvio come "autore"? Ma immaginate che il termine sia "country" ("paese, campagna") su un sito che parla di vacanze ("holyday"); il termine definisce il paese in cui si svolge la vacanza, oppure che la vacanza si svolge in campagna e non in città? Molte altre parole hanno differenti significati in differenti contesti, e se aggiungete la possibilità che siano presenti altre lingue, capirete presto che se vogliamo davvero ricavare qualcosa dai nostri dati, è necessario essere precisi. Significa che dobbiamo indicare da dove un certo termine proviene.

In RDFa facciamo questo indicando che vogliamo usare una certa collezione di termini, detta vocabolario. È facile: basta specificare l'indirizzo del vocabolario insieme ad una mappa in forma abbreviata, come questa:

xmlns:dc="http://purl.org/dc/terms/"

Se sapete qualcosa di XML, riconoscerete di certo che si tratta della sintassi usata nella dichiarazione di un namespace.

Questo esempio ci fornisce l'accesso alla lista dei termini del vocabolario Dublin Core, per mezzo del prefisso "dc". Dublin Core comprende molti altri termini, i due che useremo nel nostro esempio sono "creator" e "created". Per implementarli dobbiamo inserire il prefisso davanti a ciascuno di essi, così:

dc:creator
dc:created

Ora è tutto chiaro: "dc:creator" non è la stessa cosa di "xyz:creator".

Notate che il prefisso che fa da mappatura deve essere inserito in alto nel documento, sopra la posizione in cui verrà usato. Nel nostro esempio potrebbe essere inserito a livello dell'elemento body o dell'elemento html. L'esempio completo è così:

<html xmlns:dc="http://purl.org/dc/terms/">
 <head>
  <title>RDFa: Now everyone can have an API</title>
 </head>
 <body>
  <h1>RDFa: Now everyone can have an API</h1>
  Author: <em property="dc:creator" content="Mark Birbeck">
    Mark Birbeck</em>
  Published: <em property="dc:created" content="2009-05-09">
    May 9th, 2009</em>
 </body>
</html>

Ci sono tanti altri vocabolari da cui scegliere, farò una lista nel secondo articolo di questa serie. Ovviamente, nulla vi impedisce di creare il vostro vocabolario perché sia usato nel contesto della vostra azienda, organizzazione o gruppo di interesse. Ma badate ad una cosa che spesso sorprende le persone: non c'è un'organizzazione centralizzata che manterrà il vostro lavoro. Ci sono best practices da seguire. Tuttavia, con il potere arriva la responsabilità, così cercate di saperne il più possibile prima di procedere al lavoro su un nuovo vocabolario.

Prima di tornare al nostro esempio dovrei aggiungere qualcosa riguardo i vocabolari; vi starete certamente chiedendo perché @rel="license" non ha subito lo stesso trattamento di @property="author" e richiede un prefisso. La risposta è che HTML ha già alcuni valori predefiniti per @rel, come "next" e "prev"; RDFa ne aggiunge alcuni altri. Uno di quelli aggiunti da RDFa è appunto "license".

Ma una volta che usciamo da questa lista dei valori (per esempio, se usiamo il termine "replaces" dal vocabolario Dublin Core oppure "knows" dal vocabolario FOAF) allora dobbiamo usare un prefisso e una tecnica di mappatura esattamente come per @property.

Per esempio, supponiamo che il nostro articolo non solo abbia una licenza Creative Commons come visto in precedenza, ma che rimpiazzi altri documenti, un tipo di relazione che possiamo esprimere tramite il termine "replaces" del Dublin Core. Esprimiamo così le due relazioni:

<html xmlns:dc="http://purl.org/dc/terms/">
 <head>
  <title>RDFa: Now everyone can have an API</title>
 </head>
 <body>
  <h1>RDFa: Now everyone can have an API</h1>
  Author: <em property="dc:creator" content="Mark Birbeck">
    Mark Birbeck</em>
  Created: <em property="dc:created" content="2009-05-09">
    May 9th, 2009</em>
  License: <a rel="license" href="http://creativecommons.org/licenses/ »
by-sa/3.0/">
    CC Attribution-ShareAlike</a>
  Previous version: <a rel="dc:replaces" href="rdfa.0.8.html">
    version 0.8</a>
 </body>
</html>

Bene, ora che abbiamo finito con i vocabolari possiamo tornare al nostro esempio principale.

Usare testo in linea per impostare il valore di una proprietà

Nell'esempio precedente, la duplicazione del testo "Mark Birbeck" nell'attributo @content e nel testo presente nel corpo del documento potrebbe avervi confuso. Se così è, state iniziando ad essere coinvolti nella logica di RDFa. Possiamo in effetti rimuovere il valore @content se il testo inserito nel corpo del documento conserva il valore che vogliamo usare per il matadato:

Author: <em property="dc:creator">Mark Birbeck</em>

Regola 5:

Se non è presente un attributo @content, allora il valore di una proprietà sarà definito usando un testo in linea su uno specifico elemento.

Sebbene la tecnica basata su @content sia derivata dall'elemento meta di HTML, pensate all'esempio precedente come alla modalità di default per impostare una proprietà. Fornire un valore per @content può essere un modo per superare il valore definito nel testo in linea se esso non dice esattamente ciò che volete. Consente anche agli autori una maggiore libertà nel testo che poi l'utente leggerà, dal momento che potranno essere più precisi nei dati incorporati. La data di pubblicazione illustra bene tutto ciò; tutte le date in questi esempi hanno lo stesso significato, eppure sono presentate in modo diverso all'utente:

<span property="dc:created" content="2009-05-14">May 14th, 2009</span>
<span property="dc:created" content="2009-05-14">May 14th</span>
<span property="dc:created" content="2009-05-14">14th May</span>
<span property="dc:created" content="2009-05-14">14/05/09</span>
<span property="dc:created" content="2009-05-14">tomorrow</span>
<span property="dc:created" content="2009-05-14">yesterday</span>
<span property="dc:created" content="2009-05-14">14 Mai, 2009</span>
<span property="dc:created" content="2009-05-14">14 maggio, 2009</span>

Regola 6:

Se l'attributo @content è presente, esso supera e si sovrappone a quello definito nel testo in linea per impostare il valore della proprietà.

Vedremo nella prossima parte come si aggiungono proprietà ad un'immagine e come aggiungere metadati ad ogni item.