III.12. OUTPUT HTML

vedi: appendice 4

Dopo l'analisi della produzione di un output HTML per i metadati dell'Header TEI, passiamo ora ad esaminare il foglio di stile XSLT mediante il quale abbiamo trasformato in HTML il sorgente XML dell'edizione elettronica del romanzo di Matteo Collura, oggetto del nostro lavoro. Anche in questo caso, in appendice forniamo il codice completo del foglio di stile XSLT adoperato per l'elaborazione.

Nella parte iniziale il codice ricalca da vicino quello del file, già visto, per la trasformazione dell'Header. Come di consueto il primo template che incontriamo è quello dell'elemento radice, che definisce i tag principali del nostro file HTML. Salta subito all'occhio la presenza nell'<head> HTML di una serie di istruzioni di formattazione incluse dentro il marcatore <style type="text/css">, si tratta dei comandi di un foglio di stile CSS incorporato dentro il file HTML[180]. Come già detto, CSS è un linguaggio di rappresentazione con cui associare delle norme di visualizzazione ai tag HTML (o XML).

Le istruzioni di formattazione CSS hanno una sintassi molto semplice, composta da due blocchi principali, a sinistra troviamo il selettore, il quale serve a definire a quale parte del documento verrà applicata la regola, a destra, racchiusa tra parentesi graffe, si trova invece il blocco delle dichiarazioni il quale contiene le norme di rappresentazione da associare all'elemento definito dal selettore.

Ad esempio se prendiamo la prima istruzione CSS del nostro foglio di stile:

p { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12pt;
text-align: justify;
text-indent: 25pt;
line-height: 2em;}

vediamo a destra il selettore p, il quale associa le regole di riproduzione definite nel blocco delle dichiarazioni a tutti gli elementi <p> del documento HTML, in pratica al testo contenuto dentro i tag <p> ... </p> nel file HTML. A sinistra entro parentesi graffe il blocco delle dichiarazioni definisce le istruzioni di formattazione sotto forma di coppie proprietà:valore; la proprietà, separata dal suo valore dai due punti, definisce una caratteristica dell'elemento da modificare; le varie coppie proprietà:valore sono separate tra di loro dal punto e virgola. Riprendendo il nostro esempio notiamo che la prima proprietà definita (font-family) riguarda il tipo di carattere con cui deve essere reso graficamente il testo, i suoi valori stabiliscono che esso dovrà essere riprodotto usando il carattere Verdana oppure, in caso di assenza del carattere in questione nel sistema in cui verrà visualizzato il documento, con il font Geneva, oppure Arial e così via. Le altre istruzioni stabiliscono che il carattere debba avere una dimensione di dodici punti, che il testo presenti un allineamento di tipo giustificato, che la prima riga di ogni paragrafo sia rientrata di venticinque punti e che l'interlinea abbia un valore di due em[181].

Continuando ad esaminare il CSS incorporato nel nostro file HTML, notiamo che un certo numero di selettori è preceduto da un punto ed ha nomi non corrispondenti con quelli abituali dei tag HTML, si tratta dei selettori di classe. I selettori di classe specificano lo stile di quegli elementi nel documento aventi un attributo class[182] corrispondente con il nome del selettore di classe, ad esempio il selettore di classe .italic {font-style: italic;} stabilisce che tutti gli elementi in cui si trovi un attributo class="italic" presentino il testo in corsivo, non limitandosi ad una determinata categoria di tag; potremo quindi avere: <p class="italic">, <span class="italic">, <div class="italic"> etc. e tutti si atterranno alle istruzioni di visualizzazione definite dal selettore di classe italic {font-style: italic;}.

Tornando al foglio di stile XSLT, subito dopo il modello per l'elemento radice incontriamo il template del <teiHeader>: <xsl:template match="teiHeader"/>; questo modello non ha alcun contenuto in modo tale da escludere dall'elaborazione, (come già visto con il foglio di stile per l'Header TEI) l'elemento in questione con tutti i suoi figli, infatti in questo caso non desideriamo un output anche per i metadati del documento, avendo noi deciso di inserirli in un file separato, illustrato nelle pagine precedenti.

Per agevolare il lettore nella consultazione dell'output HTML di Baltico abbiamo ritenuto utile porre all'inizio del file un indice con collegamenti ipertestuali ai capitoli; così come l'intero documento anche l'indice dei capitoli è stato generato dinamicamente grazie al foglio di stile XSLT. Per fare ciò ci siamo giovati principalmente della possibilità offerta dal linguaggio XSLT di applicare i modelli secondo determinate modalità. Mediante le modalità, che come vedremo fra poco, sono specificate usando l'attributo mode, non vengono solamente selezionati i nodi a cui si devono applicare le regole ma anche la modalità con cui devono essere trattati. In pratica la modalità costituisce un sottoinsieme di template, consentendo così di definire modelli diversi che utilizzano gli stessi elementi, anche se in modo differente. Sostanzialmente grazie alle modalità il documento viene percorso più volte dal processore, ed in ognuna di queste elaborazioni vengono applicate le differenti regole agli elementi secondo le modalità specificate nei diversi template.

Quanto ci apprestiamo ad illustrare di seguito costituisce una ulteriore riprova dell'utilità della codifica dichiarativa e della potenza di XSLT nel trattamento informatico dei testi; questi strumenti, infatti, consentono di manipolare e gestire i dati testuali secondo modalità ed approcci diversi, in risposta a differenti esigenze, anche all'interno di un medesimo documento. Nello specifico per la produzione dell'indice HTML di Baltico abbiamo operato nel modo seguente. Si ricorderà che nel sorgente XML del testo ogni capitolo è racchiuso dentro un elemento <div1> contraddistinto da alcuni attributi, ad esempio: <div1 type="cap" n="2" id="I.2">, in particolare l'attributo id costituisce un identificatore che definisce in modo univoco ogni capitolo e che quindi ben si presta alla realizzazione di un sistema di ancore e riferimenti ipertestuali; presupposto su cui abbiamo fondato l'impostazione della programmazione di questa porzione del foglio di stile.

L'elaborazione effettiva del nostro indice parte dal nodo <text>, elemento che nella sintassi TEI, come sappiamo, ospita il contenuto testuale vero e proprio dell'opera:

<xsl:template match="text">
<xsl:apply-templates mode="index"/>
<xsl:apply-templates/>
</xsl:template>

come vediamo il codice di questo modello presenta due <xsl:apply-templates> il primo dei quali contraddistinto dall'attributo mode="index", grazie a questa sintassi abbiamo istruito il processore a percorrere per due volte il documento elaborando i dati secondo modalità differenti, una prima volta applicando i template caratterizzati dall'attributo mode="index", ed una seconda volta, una volta conclusa la modalità "index", eseguendo invece i modelli privi di questo attributo. Così facendo, modelli diversi trovano corrispondenza con gli stessi nodi e producono differenti output. I modelli di tipo "index" creano la "copertina" del documento ed un indice dei capitoli; sostanzialmente, per quanto riguarda l'indice operano così: l'albero del documento viene percorso mandando in output soltanto i pochi elementi necessari alla costituzione dell'indice ed escludendo gli altri, in particolare, cuore della realizzazione del nostro indice è il modello

<xsl:template match="head" mode="index">
<a href="#{../@id}"><xsl:value-of select="."/></a><br/>
<xsl:apply-templates mode="index"/>
</xsl:template>

Questo template, durante l'elaborazione in modalità "index", seleziona tutti i titoli dei capitoli, che come sappiamo sono racchiusi dentro il tag <head>, e ne manda in output il valore racchiudendolo in un link HTML (<a href="destinazione">...</a>), il link punta ad un'ancora HTML (<a name="nome destinazione">), che viene generata durante l'elaborazione standard (ossia quella non in modalità "index") dal modello delle intestazioni di capitolo di tipo ordinale:

<xsl:template match="head[@type='ord']">
<a name="{../@id}"/>
<h2>
<xsl:apply-templates/> </h2>
</xsl:template>

Come vediamo sia il nome dell'ancora (che costituisce la destinazione del link), sia la destinazione del link vengono generati grazie ad un espressione XPath "../@id" che seleziona in modo relativo l'attributo id dell'elemento padre del nodo contesto e lo manda in output[183] sia nell'attributo name dell'ancora, producendo così il nome dell'ancora, sia nell'attributo href (attributo che indica la destinazione del collegamento ipertestuale) del link. Per aiutare a comprendere meglio riportiamo una spiegazione empirica del funzionamento del foglio. Prendiamo, ad esempio, nel sorgente XML il codice dell'inizio del secondo capitolo:

<pb n="18"/>
<div1 type="cap" n="2" id="I.2">
<head type="ord">II</head>
<head type="tem">Quando e come i contadini incubarono il malanno</head>
<p>
Evocazione di visionari o fatalità del caso, fatto è che, ad un certo momento, [. . .]
</p>

Allorché l'elemento <head type="ord">II</head> viene raggiunto dal modello dell'<head> in modalità index (<xsl:template match="head" mode="index">), viene prodotto questo codice HTML:

come vediamo è stato creato un collegamento ipertestuale, che punta ad un'ancora nel documento il cui nome è "I.2",l'ancora sarà generata nel prosieguo dell'elaborazione dal template:

<xsl:template match="head[@type='ord']">
<a name="{../@id}"/>
<h2>
<xsl:apply-templates/>
</h2>
</xsl:template>

Il modello in questione non appartiene più come possiamo notare alla modalità index, ma fa parte dell'elaborazione, per così dire, principale la quale si occupa della produzione dell'output del contenuto testuale vero e proprio del documento. Questo è l'output HTML creato dal modello:

Abbiamo creato dei riferimenti incrociati, in cui, il valore sia del link, sia dell'ancora è generato dinamicamente sulla base della posizione del nodo contesto nell'albero del documento, a partire dal valore dell'attributo id del nodo padre dell'elemento contesto[184], che nello specifico è I.2.

Dopo aver esaminato la generazione dinamica dell'indice poco altro resta da esaminare nel foglio di stile, buona parte dei template ricalcano nella sintassi quelli già visti per l'elaborazione dell'Header TEI e si limitano ad inserire dentro opportuni tag HTML le varie parti del testo.

Merita di essere menzionato il modello per il trattamento delle citazioni, che nel sorgente, come forse il lettore ricorderà, sono identificate dal marcatore <q> accompagnato dall'attributo type='citazione'. Nel testo di riferimento le citazioni presentano caratteristiche grafiche diverse, alcune sono rese in corsivo, altre invece sono messe in risalto mediante l'inserimento in un blocco di testo graficamente autonomo, altre ancora non sono contraddistinte da alcuna evidenziazione tipografica particolare. Nella codifica, grazie all'attributo rend, si è registrato, ove necessario, in che modo è riportata la citazione nella fonte materiale, i valori usati nell'attributo per far ciò sono stati: bloc per le citazioni dentro blocchi di testo graficamente autonomi ed italic per le citazioni in corsivo. Tale distinzione è stata naturalmente mantenuta anche nel template per il trattamento dei nodi di citazione il cui codice riportiamo di seguito:

<xsl:template match="q[@type='citazione']" priority="1">
<xsl:choose>
<xsl:when test="@rend='bloc'">
<blockquote>
<xsl:apply-templates/>
</blockquote>
</xsl:when>
<xsl:when test="@rend='italic'">
<cite class="italic">
<xsl:apply-templates/>
</cite>
</xsl:when>
<xsl:otherwise>
<cite>
<xsl:apply-templates/>
</cite>
</xsl:otherwise>
</xsl:choose>
</xsl:template>

Come si vede adoperiamo anche in questo caso una elaborazione condizionale per rendere nell'output in modi differenti l'elemento, in base alle indicazioni sulle caratteristiche di evidenziazione grafica dello stesso registrate nell'attributo rend. Nel caso, in cui il testo della citazione marcata da <q> presenti un attributo rend='bloc', questa nell'output sarà racchiusa dentro l'opportuno tag <blockquote>, ove invece nel sorgente la citazione sia associata all'attributo rend='italic', sarà marcata grazie all'elemento <cite class="italic">[185], in tutti gli altri casi invece si adotterà semplicemente il marcatore <cite>. Si sarà notato che il modello appena descritto dispone di un attributo priority="1"; la sua funzione è quella di impostare una priorità di elaborazione per il modello a cui è associato nell'eventualità in cui più modelli (all'interno però di una medesima modalità) trovino corrispondenza con uno stesso elemento. Nel foglio XSLT immediatamente dopo il template per le citazioni incontriamo due modelli che con questo potrebbero collidere durante l'elaborazione:

<xsl:template match="*[@rend='bloc']">
<div class="bloc">
<xsl:apply-templates/>
</div>
</xsl:template>
<xsl:template match="*[@rend='italic']">
<span class="italic"><xsl:apply-templates/></span>
</xsl:template>[186]

Mediante l'impostazione di una priorità[187] elevata abbiamo fatto in modo che con i nodi <q type='citazione'> anche se accompagnati da un attributo rend intervenga sempre il primo modello, mentre in tutti gli altri casi troveranno corrispondenza i modelli generici definiti successivamente.

Il foglio di stile appena illustrato è stato in più casi alquanto personalizzato per l'elaborazione specifica dell'edizione XML del romanzo di Collura; tuttavia, si è sempre cercato durante la sua programmazione di aver cura di mantenerlo il più possibile generico ed universale[188], in modo da poterlo eventualmente in futuro adoperare anche con un corpus di testi dalle caratteristiche di codifica omogenee ed analoghe al nostro, nella speranza così di offrire un primo, minimo, contributo alla costituzione di un archivio digitale della Cattedra di Filologia e Letteratura Siciliana dell'Università di Messina.

Concludendo, vorremmo dire che nella produzione dell'output HTML si è cercato di "reinterpretare" graficamente il testo di Baltico adattandolo al nuovo medium, pur sforzandosi di mantenere una certa coerenza estetica con l'edizione di riferimento; è, comunque, bene tener presente che quella da noi proposta è soltanto una delle possibili forme di riproduzione del testo, come vedremo meglio nelle prossime pagine, i formati di rappresentazione possono venir modellati ed impostati in modo tale da attagliarsi alle esigenze più disparate.

[180] Abitualmente si preferisce non inserire direttamente dentro il file HTML il foglio di stile CSS, ma piuttosto connetterlo ad esso mediante il collegamento ad un file esterno, in questa sede per esigenze di trattazione abbiamo preferito non adottare questa pratica.

[181] L'em (em-height) è una unità di misura relativa ai font uguale all'altezza del box del carattere del font. Pertanto impostare il line-height a 2em corrisponde a stabilire una interlinea doppia rispetto alla dimensione del font.

[182] Così come ID, class è un attributo globale che può ricorrere in tutti gli elementi HTML.

[183] Quando negli attributi di un output HTML o XML si vuole inserire un valore estratto da un nodo del documento XML di origine, non si può usare l'elemento 'xsl:value-of'; al suo posto si usano delle parentesi graffe.

[184] Abbiamo optato per una sintassi relativa facente riferimento in modo generico al nodo padre (../@id) e non ad una sintassi assoluta come ad esempio div1/@id, per far si che i templates fossero efficaci con qualsiasi <head>, anche con quello, ad esempio della nota finale nel <back> del documento, dove l'elemento non è figlio di un nodo <div1> bensì semplicemente di un nodo <div>.

[185] Di default nei browser il testo contenuto dentro l'elemento <cite> è reso graficamente in corsivo, tuttavia mediante il foglio di stile CSS incorporato all'inizio del file HTML abbiamo ridefinito le caratteristiche di visualizzazione di questo tag stabilendo che il testo non sia riprodotto in corsivo ma normalmente. Abbiamo proceduto così per distinguere graficamente le citazioni anche nell'output HTML, ove necessaria la rappresentazione in corsivo del testo è stata specificata nel tag <cite> per mezzo di una apposita classe CSS (italic) da noi definita nel foglio di stile.

[186] La funzione di questi modelli è quella di elaborare tutti i nodi cui sia associato un attributo rend con valore italic oppure bloc. Si ricordi, infatti, che rend è un attributo globale che può ricorrere in pressoché tutti gli elementi TEI.

[187] Le priorità di default dei modelli non superano mai il valore di 0.5.

[188] In tal senso si spiega la decisione di omettere dall'elaborazione automatica le dediche ed epigrafi iniziali. Dediche ed epigrafi si possono presentare con caratteristiche tipografiche e di disposizione assai diverse nei testi, poco proficuo e sensato riteniamo sarebbe stato il cercare di prevedere tutte le possibili forme in cui queste possono apparire in un testo, nell'impostazione di una elaborazione di tipo batch quale quella XSLT, considerando anche la loro spesso esigua dimensione nei testi. Pertanto si è ritenuto più utile inserirle "manualmente" nell'output.