Cos'è il markup?

Questo post, tratto da un mio vecchio articolo sul vecchio Biroblu e a suo tempo inserito in un libro (siam nel 2003…), è dedicato a Maurizio di Cambio il Web, fosse anche solo per la passione “standardistica” che dimostra.

Si sente e si sentirà parlare parecchio di “markup”, oltretutto da distinguere in markup strutturale e markup di presentazione. Ma cosa significa in pratica?
È davvero interessante scoprire come una frase di per sé apparentemente innocua e non proprio chiara possa riassumere tanti concetti e rendere necessarie per la sua applicazione vere rivoluzioni.

I would however, support an assertion in the architecture document that important information SHOULD be stored and (optionally) delivered with markup that is as semantically rich as achievable, and that separation of semantic and presentational markup, to the extent possible, is architecturally sound. Chris Lilley, W3C

La direttiva del W3C invita a separare contenuti e relativa struttura semantica dagli elementi di presentazione. Veramente ermetico. Sono migliaia di anni che alcune religioni discutono di Maya e Arthur Schopenhauer ci ha raccontato del suo velo. Però, un po’ ci assomiglia. Se contenuto e la sua struttura sono l’essenza, la presentazione (il CSS) ne rappresenta la parvenza. Mica facile sta cosa, e presuppone una capacità di astrazione non comune. «Il mondo è una mia rappresentazione», dice Schopenhauer.

Forse in generale è un po’ esagerata, ma visto l’ambito è lecito pensare che la frase del W3C si riferisca a una pagina Web, e abbastanza lecitamente un webmaster potrebbe pensare «Questa pagina è una mia rappresentazione». Mi sembra quasi maieutico.

Apro il browser, carico una pagina e la osservo. Distinguere i contenuti non è difficile: noto facilmente il testo, le immagini e gli altri elementi che compongono la pagina. Con un po’ di immaginazione rendo sfocato il contenuto e cerco di vedere soltanto gli elementi di presentazione: il tipo di carattere, la dimensione del testo, i colori usati per distinguere ed evidenziare i vari elementi. Tutto qui?

Riflettiamo sul significato di questa attività. Prendo in prestito una frase dal libro Struttura e funzioni degli animali, di R. Griffin, Zanichelli 1978, Biologia Moderna:

“I sistemi strutturali presi in considerazione in questo capitolo sono quelli che permettono all’animale di conservare la forma che gli è propria, sia quando è in stato di riposo sia quando è impegnato a svolgere le sue varie attività”.

Quale potrebbe essere lo stato a riposo di una pagina Web? Penso si possa trattare dello stato della pagina quando risiede sul suo server, non consultata da alcun browser. Esiste, contiene certamente delle informazioni, buone o cattive è indifferente, aspetta. La sua forma non è importante, lo sono invece i suoi contenuti, che ne determinano l’appartenenza a una specie piuttosto che a un’altra. Come un fulmine a ciel sereno, tutto mi appare chiaro: una pagina Web è una specie di mostro che vive nella penombra del disco fisso di un server, resta lì quatta quatta e se il mio browser la carica si mostra in tutto il suo splendore. Il titolo va lì, l’immagine dopo, un filetto divide quella parte del testo dall’altra… chiarissimo. Chiarissimo mica tanto: come mai quegli elementi si dispongono proprio in quel modo? Cos’è che fa conservare alla pagina la forma che gli è propria?
Continuiamo con il libro:

“Il protoplasma è costituito per più di due terzi d’acqua, ma gli organismi viventi sono tutt’altro che liquidi: non solo essi conservano una forma abbastanza ben definita, ma mantengono i loro liquidi corporei in uno stato chimico che differisce nettamente dal mezzo in cui vivono”.

Accidenti, che discorso affascinante. Che cosa significa esattamente conservano una forma ben definita, nonostante siano composti per i due terzi di acqua? Come è possibile? Mai vista una palla di acqua. Per dare una forma all’acqua (i nostri contenuti: testo, immagini, suoni, filmati, un oceano di bit) devo fornirgli una struttura che la sostenga, semplice e rigida (l’esoscheletro degli artropodi) o più complessa e flessibile (l’endoscheletro dei vertebrati, pelle, muscoli).
Effettivamente le pagine Web assomigliano in alcuni casi a strani esseri, scommetto che vi è capitato di arrivare su un sito e chiedervi “E questa cosa che cos’è?”, nel bene o nel male.
Ho chiesto consiglio a un amico esperto, e lui mi ha detto di caricare una pagina e selezionare la voce di menu Visualizza>HTML del mio browser, che lì avrei trovato la risposta alle mie domande e capito come viene strutturata la pagina (musica di sottofondo: Peter Gabriel and Shankar – Passion, featuring Nusrat Fateh Ali Khan).

Ora un altro salto, ci vuole ancora un po’ di pazienza e sforzo di astrazione. Siamo degli scribi (di bene in meglio) e con tanta pazienza incidiamo una tavoletta di terracotta con una punta, disponendo su di essa una serie di segni che rappresentano delle informazioni in un linguaggio codificato. L’attività è decisamente complessa e viene resa ancora più complessa dalla tecnologia disponibile: un semplice errore non potrà essere corretto, se non in alcuni casi fortunati, e un colpo appena un po’ più deciso comprometterà l’intera tavoletta. Di conseguenza, la difficoltà di esecuzione implica una presentazione dei contenuti grezza ed essenziale (ma non per questo meno significativa). Saltiamo i papiri e arriviamo direttamente al Medioevo. I segni ora vengono tracciati con dell’inchiostro su una pelle di origine animale, definita pergamena. Essi sono molto più raffinati, ci si possono permettere i colori e grandi fregi definiti capolettera evidenziano l’ordine di lettura o introducono le parti più importanti del testo. Il paragrafo ora non è più indicato da una lineetta marginale fra due righe di scrittura, come nei papiri ellenistici, ma da un simbolo, simile a una q, come questo: ¶ (nel markup del Web, il simbolo è diventato <p>). Accanto al testo l’autore o il redattore pongono dei segni, che marcano quelle sezioni del testo che possiedono qualche speciale significato strutturale o contestuale (ora si chiamano elementi block level e inline). La sezione marcata può arrivare da una sola parola con qualche significato speciale fino all’indicazione della fine di un capitolo e l’inizio di un altro.
La tradizione di marcare i testi risale ai tempi quando i copisti segnavano i loro commenti sui margini del manoscritto, o usavano inchiostri di vari colori per separare certe parole dal resto del testo. Quando un autore scrive, da millenni a questa parte, specifica anche i delimitatori di parola (chiamati spazi), i delimitatori di frase (chiamati virgole) e i delimitatori di periodo (chiamati punti).
La numerazione delle pagine o l’uso dei margini per creare effetti sul contenuto sono noti da centinaia di anni. Eppure, a stretto rigore queste informazioni non fanno parte del testo, ma del markup: nessuno dirà ad alta voce ‘virgola’ o ‘punto’ nel leggere un testo, ma creerà adeguati comportamenti paralinguistici (espressioni, toni, pause) per migliorare in chi ascolta la comprensione del testo. Marcare, il markup … comincio a capire. Una specie di sovrastruttura per ordinare il flusso delle informazioni, sarà così? La prossima mossa della nostra industriosa civiltà è la macchina da stampa, il sig. Gutenberg rende più accessibile la produzione di documenti inventando un sistema di composizione dei testi e una macchina in grado di stamparli in più copie in grandi quantità. Con l’invenzione della stampa, l’edizione dei documenti guadagnò importanza a causa della separazione delle funzioni della stampa e della pubblicazione. Fino a quell’epoca un manoscritto finito era il prodotto di un solo copista (e possibilmente di uno o più “illuminatori”). Con la larga diffusione della stampa, il manoscritto passa molte fasi, nel corso delle quali viene corretto e marcato a mano in una copia di lavoro. Questa copia passa quindi al tipografo, generalmente accompagnata da molti strati di commenti scritti a mano; il tipografo interpreta la marcatura, compone la forma finale del documento e lo invia alla stampa.
Cerchiamo gli elementi comuni in tutte queste situazioni. Per prima cosa, tutte queste notevoli e complesse attività hanno un obiettivo unico: tenere memoria di una informazione su un supporto che non sia volatile, mettere le parole nero su bianco, come si dice oggi. Il contenuto può essere di qualsiasi natura: giuridico, medico, religioso, qualsiasi argomento vi venga in mente. L’attività da svolgere per ottenere il documento stampato, nel senso più ampio, è sempre faticosa, sia per chi redige il testo – che in un primo momento si occupa anche della stampa dello stesso, poiché i momenti della stesura del documento e della stampa coincidono: il manoscritto – sia per chi in seguito con le nuove tecniche si occupa della composizione del testo e della sua stampa: qui avviene una prima separazione analogica di contenuti e forma. Lo sforzo tecnico sembra comunque rivolgersi in una direzione precisa: rendere il più possibile semplice ed economico realizzare documenti da poter distribuire e conservare. Nel corso della storia della stampa e della pubblicazione, si fissano certe tipologie nella presentazione di documenti. Queste tipologie standardizzate sono tanto largamente usate che per lo più non le consideriamo regole e interpretiamo automaticamente il loro senso. Inoltre, si notano degli standard: il testo viene disposto secondo regole generalmente accettate. Le note, per esempio, vengono poste in zone precise della pagina, molti elementi di presentazione sono gestiti secondo un canone comune. Questa modalità operativa dura senza sostanziali cambiamenti di procedura fino a oggi. Alcuni comuni esempi nell’industria editoriale occidentale:

• Uso del corsivo per il titolo di libri, giornali o altri documenti.
• Uso del grassetto o di tipi larghi per titoli di capitoli.
• Rientri dei paragrafi.

Gli elementi di presentazione li abbiamo visti milioni di volte, ma sono così abituali che per notarli è necessario astrarli dal contesto dell’informazione. Sono inglobati, embedded verrebbe da dire, in essa.
Queste regole, comunque, rendono possibile all’editore di un manoscritto il segnare (“mark up”) il contenuto del testo affinché il tipografo sappia come deve presentarlo nella pubblicazione a stampa. L’introduzione del computer, che rende superflua una grande parte del lavoro manuale, rende anche più facile la formattazione del documento, che passa dall’autore alla stampa. Ma per non perdere il controllo della formattazione dei documenti, è necessario introdurre un sistema di segnalazione per indicare al “dispositivo di output” (stampante o monitor che sia) come è strutturato il documento e come debba essere presentato. L’equivalente digitale dei segni dei copisti è il fare clic sul pulsante G di un word processor per ottenere del testo in grassetto: il markup elettronico.
Un copista non può scrivere senza inchiostro, uno scrittore dell’800 altrettanto, una macchina da stampa senza carta e inchiostri è bella a vedersi ma serve a poco. Le miniature nelle quali si rappresenta S. Giovanni che mette per scritto il Libro della Rivelazione, infatti, non di rado illustrano la leggenda del tentativo fatto dal Diavolo di sottrarre all’Evangelista le sue penne ed il calamaio portatile così da impedirgli di terminare la stesura dell’ultimo libro della Bibbia.
A parte facili battute sugli strumenti che S. Giovanni avrebbe potuto usare oggi, sul suo PC portatile e su come l’aspetto diabolico possa essere rappresentato da un noto sistema operativo o dalle batterie che finiscono inevitabilmente sul più bello, è evidente che la possibilità di pubblicare attualmente è ben più ampia: il Web può essere visto come una gigantesca casa editrice, multimediale e multietnica, che lo stampare il proprio libro e renderlo visibile a un pubblico potenzialmente enorme è piuttosto semplice ed economico e che l’inchiostro e la carta sono praticamente inesauribili. Una pagina sul Web non richiederà alcun pigmento o cellulosa, e il lettore potrà decidere di stampare autonomamente su carta i soli contenuti per lui interessanti.
Vorrei porre l’attenzione su una questione: a mio parere erroneamente (si capirà il perché nei paragrafi successivi) si continua ad applicare al Web il paradigma della biblioteca. Il Web non è una biblioteca, è una casa editrice con un catalogo sterminato.

Non ho dimenticato il mondo della biologia, fra poco ci torniamo – l’ho detto fin dall’inizio che quella frase innocua ci avrebbe portato lontano. Separare contenuti e relativa struttura dalla presentazione. Applichiamo la direttiva alla carta stampata. Impossibile. Come separare quel bel capolettera dal resto del testo? L’aspetto grafico è assolutamente legato al contenuto, proprio fisicamente.

Non si può neppure pensare di eliminarlo, poiché è funzionale al testo, serve a rendere maggiormente accessibile il significato. D’altra parte, se si potesse salvare in un qualche modo la quantità di informazione che riguarda il suo aspetto (colore, dimensione, tipo di carattere, le caratteristiche in genere definite grafiche) questo significherebbe poterla riutilizzare anche con altri testi e in altre pagine, per riprodurre lo stesso effetto senza impedire l’accesso al testo base anche senza di essa. Che cosa complicata. Osservo il codice HTML della pagina, come mi ha detto il mio amico, e in effetti noto degli elementi estranei in mezzo al testo comprensibile. Inoltre, quelli sembrano essere disposti secondo delle regole. Certamente, ora capisco:<h1> mi indica l’inizio del testo che nella pagina apparirà come titolo principale. Inoltre, </h1> ne indica la fine, <p>è un paragrafo, </p> la fine dello stesso.

Lo scheletro della pagina sono i tag, la marcatura, che descrivono il significato semantico di ciascun blocco informativo. Essi indicano al browser come disporre e ordinare i contenuti, e rendono possibile la sua elaborazione. Potevo pensarci prima, però. Ora quel che mi si chiede di fare non è indolore: non posso neppure immaginare di togliere la pelle a una creatura per conservarla separatamente dal suo scheletro e il resto degli organi. L’estrarne l’essenza poi ci porta direttamente alla magia nera. Mi rifiuto di pensare di intervenire con un raschietto sulla pergamena.
Che cosa non funziona?

Tutti i paralleli considerati non sono congruenti. Il mondo digitale è un mondo diverso, l’informazione è gestita in modo diverso. L’informazione non è più organica, ma completamente separabile dalla sua forma senza dover ricorrere a dolorosi e truculenti interventi e senza perdere in impatto visivo. La marcatura di presentazione può essere posta in un file ad essa riservato all’esterno del documento senza problemi: verrà utilizzata solo se necessario.

Come una specie di creatura telescopica la pagina Web, quando caricata, uscirà dal suo torpore e si mostrerà secondo le regole di marcatura strutturale e di presentazione indicate. Con la semplice direttiva iniziale arriva anche una novità tecnologica: lo sviluppo di HTML non proseguirà, si passa a XHTML.

Quindi siamo stati bombardati da una selva di acronimi, XML, SVG, CSS e così via. Robe da Web?

No. Un altro termine di cui si sente molto parlare è “accessibilità”, molte volte giustamente in relazione all’handicap, ma non è così obbligatorio. L’equivoco che ci fa pensare al Web come a una biblioteca (e non come a una casa editrice di tanti editori), e ci porta a creare i documenti per il Web come fossero per il mondo della stampa, consiste nella nostra naturale paura per il diverso. Si è portati a cercare l’analogia invece di distinguere la diversità, quasi sempre intesa come elemento negativo e non come possibile ricchezza. Anche in questo caso è successa la stessa cosa e si è cercato di usare il nuovo linguaggio come fosse una semplice estensione del precedente, senza accorgersi invece che era in atto una vera rivoluzione: informazione accessibile significa *anche* che è disponibile a tutti, in senso letterale.

Separare la presentazione da contenuti e relativa struttura logica significa che chiunque, ovunque, potrà leggere quel testo, abbia interesse o meno a vedere i fregi e le decorazioni, che sono senza dubbio importanti ma non indispensabili. Il mondo tipografico del Web ha proposto uno strumento originale e non derivato da un medium esistente adattato al nuovo contesto (nel file generato da un word processor le informazioni relative alla formattazione sono incorporate in codice binario all’informazione), in un formato universalmente comprensibile, poiché si tratta di due file di solo testo – il markup XHTML che struttura e richiama i contenuti e lo stile CSS che gli attribuisce la forma grafica prevista dal progettista.

I CSS sono una modalità operativa che propone nuovi concetti (come il Visual Formatting Model e le sue regole o gli stili aurali) al resto dei media. Siamo usciti dal Medioevo? Non lo so, ma mi sembra che la via sia quella giusta. Infatti, tutti i principali programmi di impaginazione nelle ultime versioni propongono una modalità operativa definita “struttura” e offrono la possibilità di salvare i file nel formato XML, l’altro grande ma ancora incompreso rivoluzionario.

La richiesta per tutta questa trasperenza è una sola: il file deve essere impaginato usando gli stili, ovvero deve essere possibile strutturarlo. I file PDF inoltre, se creati in modalità strutturata, ora possono essere interpretati da un browser vocale o uno screen reader.

Mica male come risultato. Separando i contenuti e il relativo markup strutturale dal markup di presentazione si ottiene quasi automaticamente un formato dei contenuti standard e quasi pronto per l’accessibilità, sia in tipografia sia sul Web. Una solidissima base su cui sarà facile implementare le ulteriori tecniche necessarie per raggiungere una completa accessibilità.

Spero che gli amanuensi non lo vengano mai a sapere.