hCard, ovvero come imparai a non preoccuparmi e ad amare i microformati

I microformati (o all'inglese microformats) sono informazioni pubblicate in una porzione di codice, create in un particolare formato XML ed immerse (embedded) nella pagina HTML (o meglio XHTML) servita al browser. Il principale obiettivo di questi dati è quello di pubblicare informazioni, che possono anche non essere visualizzate come contenuto sulla pagina, ma sono considerate meta-informazioni (o metadati) interrogabili da remoto.

Volendo usare una felice espressione di Marco Fioretti su PC Professionale, i microformati coincidono con la propria specifica, ovvero si tratta di formati particolarmente semplici da usare, le cui brevi specifiche possono essere implementate nei propri progetti prescrittivamente. Il sito di riferimento per i microformati è sicuramente microformats.org.

Il motivo per cui sono così interessanti, e sempre più conosciuti ed usati, è che contribuiscono a realizzare il cosiddetto Web semantico: sono, come ricordato, dei metadati che non contribuiscono a migliorare la visualizzazione del dato al quale si riferiscono, ma permettono di attribuirgli un significato che contribuisce a far individuare il nostro dato dai motori di ricerca, piuttosto che a renderlo utilizzabile da altre applicazioni. Questo, naturalmente, grazie all'uso di un linguaggio comune (la specifica standard del microformato) che fa sì che chi usa il microformato nelle proprie pagine Web (producer) possa renderlo utilizzabile a chi (consumer) scrive applicazioni che individuano/utilizzano i dati etichettati dal microformato, senza che producer e consumer debbano necessariamente parlarsi, a patto naturalmente di avere implementato entrambi lo standard: è esattamente, se ci pensiamo, quel che accade quando chi scrive pagine Web con codice XHTML standard può visualizzarlo in ogni browser, senza dover contattare Microsoft, Mozilla Foundation, Apple, Google o chiunque produce browser per spiegargli come la pagina deve essere resa all'utente.

Chi usa quella-piattaforma-di-blogging-che-su-un-sito-che-parla-di-Joomla!-non-può-essere-nominata avrà forse dimestichezza con XFN (XHTML Friends Network), un microformato che permette di esprimere relazioni fra esseri umani ("amico", "cugino", "datore di lavoro"...) usando i classici hyperlink di HTML. Voglio qui occuparmi invece di hCard, un microformato che già nel nome riprende, adattato per il Web, lo scopo dello standard vCard, ovvero quello di creare un formato comune per i cosiddetti contatti, la versione informatizzata dei biglietti da visita. Per illustrare, sia come lavora un microformato, che nello specifico hCard, userò un semplice esempio. Prendiamo questa banale stringa: 02/123123123. Un essere umano non ha alcuna difficoltà a riconoscere un numero di telefono di una nota città italiana; questa semplice stringa, però, crea già una bella ambiguità: si tratta di un numero di telefono, o di un fax? Un programma per computer (pensiamo ai bot di Google) non solo non ha alcun modo per discernere che si tratta di un numero di telefono, ma a differenza di un essere umano, scrivere accanto ad esso "Tel." o "Fax" nella pagina HTML, piuttosto che inserire la relativa icona, non lo aiuta, nella maggior parte dei casi, a risolvere nessuna delle due ambiguità. Ancora: di quale telefono/fax si tratta, quello che usiamo a casa, in ufficio, o altrove?

hCard usa invece due elementi HTML, div e span, per attribuire un significato ad una particolare stringa di testo (del resto, la riscrittura di HTML cominciata con le specifiche 4.0 mira proprio ad usare i classici tag per dare un significato ai contenuti, lasciando la loro presentazione ai CSS); nel caso in specie, se vogliamo indicare che la stringa di cui sopra è un numero di telefono che usiamo a casa, inseriremo nel codice HTML:

<span class="tel">
  <span class="type">home</span>
  <span class="value">02/123123123</span>
</span>

La maggior parte delle proprietà usate da hCard, sulla falsariga dell'esempio illustrato, servono a specificare il significato di una stringa: possiamo così suddividere un indirizzo, piuttosto che un nome di persona, nelle loro componenti (indicando ad es. la via, il numero civico, il cognome, il titolo onorifico e così via); altre proprietà, come photo o logo, individuano un significato. La specifica di hCard, come quelle di tutti i microformati, è particolarmente semplice da seguire, ma chi proprio trovasse delle difficoltà può imparare per esempi usando il tool hCard Creator. Si noti come, nell'esempio precedente, non abbiamo risolto le ambiguità per l'essere umano (al quale magari dovremmo fornire qualche altro elemento testuale o iconografico), ma per la macchina: un parser che implementi le specifiche hCard può ora correttamente individuare, senza aiuto umano, tutti i numeri di telefono contenuti in una pagina HTML; si badi bene, a prescindere dal formato in cui sono scritti (avrei potuto ugualmente indicare come telefono di casa "02-123123123" piuttosto che "+392123123123"). Tornando al discorso di cui sopra su producer/consumer, se i consumer di vCard par excellence sono sempre stati i client di posta elettronica, per i microformati ed in particolare hCard cominciano ad essere disponibili una serie di estensioni per Firefox, fra le quali al momento spiccano Operator ed il meno maturo (e noto) Tails Export; anche la promettente Glue usa hCard (ed altri microformati) in maniera embedded, per fornire funzionalità di più alto livello.

Venendo al nostro amato CMS, le specifiche hCard possono essere utilizzate, in maniera abbastanza ovvia, col componente com_contact. Ho postato su Joomlacode una apposita patch per com_contact (che ho anche recentemente sottoposto per l'inclusione nelle future versioni del core, ovviamente come parametro); vista la natura modulare del CMS, è stato necessario modificare due delle viste del componente. La modifica è stata trivial, dato che ho dovuto semplicemente aggiungere del codice HTML wrapper a quello già esistente, seguendo come detto pedissequamente la specifica; rispetto all'esempio riportato sopra, in molti casi ho usato lo stile aggiuntivo display:none; perché il componente di Joomla! non prevedeva di usare alcuna indicazione testuale. Ripeto, hCard e più in generale i microformati forniscono informazione alla macchina, non all'essere umano.

La patch può naturalmente essere usata sostituendo banalmente i file omonimi nella cartella /components/com_contact/views/contact/tmpl/ (fatene sempre un backup, o ad es. aggiungete loro l'estensione .core!), ma per chi usa Joomla! 1.5 una possibilità molto più elegante è offerta dai template override, illustrati da Stefania in un precedente articolo ed utilizzati, a titolo di esempio, dal template Beez. Potete vedere la patch all'opera nella pagina Scrivici del Portale ARBEA. Da questa pagina è possibile verificare come Operator sia in grado di individuare il contatto etichettato tramite hCard e di effettuare su di esso una serie di operazioni.

Ing. Paolo De Nictolis
Progettazione, sviluppo e gestione Portale ARBEA - www.arbea.basilicata.it