ottimizzare pagine web Server Side Include SSI

Col termine SSI (Server Side Include), o più spesso con la sigla SSI, si indica una serie di comandi che possono essere utilizzati in una pagina web per richiedere un’elaborazione del documento prima che esso venga inviato al browser dell’utente. I comandi vengono interpretati dal software installato come server web, e quindi hanno sintassi e funzionalità differenti a seconda del tipo di software. In questa occasione si parlerà dei comandi che possono essere usati con Apache (www.apache.org), ovvero il web server in assoluto più diffuso su Internet (oltre il 63% dei domini, contro circa il 28% di Microsoft IIS o PWS).

Visti da dentro
L’effettivo funzionamento degli SSI dipende dal modo in cui è configurato il web server Apache. Per evitare di controllare ogni file HTML alla ricerca di comandi da interpretare, Apache di norma cerca i comandi SSI solo nei documenti con suffisso .shtml. Questa funzione non è sempre attiva. Se si ha il controllo sulla configurazione di Apache bisognerà aprire (con un editor di testo) il file httpd.conf e cercare le righe:

Controllate anche che ci sia, da qualche parte:

Options +Includes

Se non lo trovate, inseritelo su una riga vuota. Nel caso in cui le righe indicate fossero precedute da un cancelletto (#) questo significherebbe che gli SSI non sono attivi. Occorrerà allora togliere il cancelletto dall’inizio della riga e riavviare Apache. I vostri documenti contenenti comandi SSI dovranno quindi avere il suffisso .shtml. Non è obbligatorio, è solo una convenzione: volendo, potete cambiare il suffisso .shtml con quello .html nelle righe sopra, e tutti i documenti con suffisso .html verranno prelavorati da Apache.

L’importante è essere coscienti del fatto che d’ora in poi ogni documento con questo suffisso non sarà inviato all’utente prima di essere analizzato alla ricerca di comandi SSI, con un certo dispendio di lavoro. I comandi di attivazione degli SSI possono essere limitati  a una singola directory, inserendoli in un file di nome .htaccess posizionato all’interno della directory da attivare, senza coinvolgere quindi tutto il resto del sito e del server. Per verificare se tutto funziona si può cominciare creando una pagina HTML di questo tipo:

Caricate il file in locale e vedrete solo la scritta:

Ultima modifica:

Se invece la caricate sul vostro sito web e poi vi accedete tramite Internet, la pagina verrà interpretata da Apache e otterrete qualcosa del genere:

Ultima modifica: Wednesday, 23-Jan-2013 01:38:32 CEST

I comandi SSI non sono un vero e proprio linguaggio come PHP o ASP, ma nonostante siano abbastanza limitati offrono una vasta gamma di utilizzi che semplificano non poco la vita del web designer.

La pagina a pezzi
Le pagine di un sito hanno spesso una struttura simile:
una testata, una barra di menu, il corpo del testo. Il web designer si trova quindi a ripetere su ogni documento porzioni di HTML uguali che, se poi devono subire modifiche o correzioni (per esempio una nuova voce da  aggiungere al menu), comportano il lavoro ripetitivo di intervenire su ogni singolo documento.

Usando gli SSI è possibile estrarre i pezzi di codice  HTML che rimangono fissi su tutte le pagine salvandoli in un documento a parte, e sostituendoli nel codice HTML del documento con un comando di inclusione che  dica al server di andare a prendere il file che contiene il  pezzo di codice e inserirlo al suo posto nel documento  HTML prima di inviarlo all’utente che l’ha richiesto. Per fare un esempio, potrete togliere da ogni documento HTML tutta la tabella contenente il menu, salvarla in un file che chiamerete menu.shtml e al suo posto, nelle
pagine HTML, inserirete il seguente comando SSI:

Il browser da ottimizzare
Un altro uso molto semplice e molto utile degli SSI è quello di inserire nella pagina contenuti ottimizzati a seconda del browser dell’utente. Il tipo di browser che ha richiesto la pagina viene memorizzato nella variabile http_USER- _AGENT, che potete mostrare usando il comando SSI:

Usando le condizioni “if” offerte dal semplice linguaggio SSI è possibile decidere quali porzioni di HTML verranno inviate all’utente. Nell’esempio qui sotto l’espressione cerca nella stringa di identificazione del browser la  parola “MSIE” (che identifica Microsoft Internet Explorer) e se la trova invierà all’utente il testo “Questo è Explorer”, mentre non invierà gli altri.

Naturalmente, al posto della frase “Questo è Explorer” poteva esserci qualsiasi cosa, per esempio un altro comando SSI per includere una parte di HTML ottimizzata per Explorer, oppure il link per collegare il documento a un foglio stile CSS.

Il menu intelligente
Utilizzando una tecnica simile a quella descritta sopra potete creare un “menu” per il vostro sito un po’ più intelligente, capace di disabilitare da solo il link alla pagina in cui effettivamente ci si trova. Immaginate il menu:

Ora volete togliere questo pezzo di HTML e metterlo in un file a parte, per inserirlo nelle varie pagine usando un include. Il bello stile, però, vorrebbe che nella pagina 1 il link alla pagina 1 fosse disabilitato, sia perché non ha senso,  sia per indicare all’utente che si trova nella pagina 1. Ma visto che il menu è in un documento unico che viene incluso così com’è in tutte le pagine, come adattarlo a ogni singola pagina? Potete risolvere il problema con qualche piccolo comando SSI. Per esempio:

 Esso dice: se il nome del file richiesto dall’utente (DOCUMENT_NAME), cioè la pagina in cui effettivamente ci si trova, è uguale a pag1.html, allora stampa il nome della pagina in grassetto; altrimenti, se ci si trova in  una pagina diversa stampa il link alla pagina 1. Ripetendo il procedimento per tutte le pagine avrete un  menu che si adatterà, presentandosi in modo diverso in ogni pagina pur restando separato in un unico documento. Tutta la documentazione sugli SSI è reperibile sul sito del progetto Apache Httpd, all’URL