I fogli di stile

Webtraining

Prossimo, Precedente, Sommario

Hai trovato un errore ? Un dato vecchio o superato ?
Aiutaci a tenere aggiornata questa guida.
Clicca qui

Nuovi standard - I fogli di stile - CSS
Iniziamo la nostra rassegna sulle ultime novità nella gestione dei documenti su Web dagli ultimi sviluppi del linguaggio HTML e dalla formalizzazione del linguaggio per fogli stile Cascading Style Sheet (CSS).
Nel dicembre del 1997 è stata rilasciata ufficialmente l'ultima versione del linguaggio HTML, la numero 4 (le specifiche in inglese sono disponibili all'indirizzo http://www.w3.org/MarkUp/). HTML 4.0 aggiorna notevolmente la precedente versione 3.2, ed accoglie molte novità che erano precedentemente parte dei vari dialetti proprietari (ad esempio la tecnologia dei frame, che permette di suddividere la finestra del browser in sottofinestre contenti file diversi).
Ma le caratteristiche più rilevanti di questa versione sono senza dubbio l'attenzione dedicata alla internazionalizzazione e l'integrazione del linguaggio HTML con un sistema di fogli di stile, in modo da distinguere la struttura astratta del documento dalla sua presentazione formale.
HTML 4.0 è formalmente basato su Unicode ed è in grado di rappresentare sistemi di scrittura che hanno direzioni di scrittura diverse da quella occidentale (ad esempio gli arabi scrivono da destra verso sinistra). Dunque, potenzialmente, esso permette la redazione e distribuzione di documenti redatti in ogni lingua ed alfabeto e di documenti multilingua.
L'altra innovazione importante di quest'ultima versione del linguaggio HTML è l'integrazione dei fogli di stile CSS. Fino ad oggi, nell'architettura di World Wide Web, le regole di formattazione e la resa grafica di un documento sono state codificate nel codice del browser. Il controllo sull'aspetto della pagina da parte dell'autore è molto limitato, e peraltro si basa su un insieme di marcatori HTML che possono introdurre inconsistenze strutturali nel documento. L'introduzione dei fogli di stile risolve entrambi i problemi poiché:

consente una cura dettagliata del progetto grafico di una pagina Web
separa la specificazione della grafica dalla struttura logica del contenuto.

Il concetto di foglio di stile nasce nell'ambito delle tecnologie di word processing e desktop publishing. L'idea è quella di separare il contenuto testuale di un documento elettronico dalle istruzioni che ne governano l'impaginazione, le caratteristiche grafiche e la formattazione. Per fare questo è necessario suddividere il testo in blocchi etichettati ed associare poi ad ogni blocco uno specifico stile, che determina il modo in cui quella particolare porzione del testo viene impaginata sul video o stampata su carta. Ad esempio, ad un titolo di capitolo può essere associato uno stile diverso da quello assegnato a un titolo di paragrafo o al corpo del testo (lo stile titolo di capitolo potrebbe prevedere, poniamo, un carattere di maggiori dimensioni e in grassetto, la centratura, un salto di tre righe prima dell'inizio del blocco di testo successivo; a un blocco di testo citato potrebbe invece essere assegnato uno stile che prevede un corpo lievemente minore rispetto al testo normale, e dei margini maggiori a sinistra e a destra per poterlo centrare nella pagina). Per chi usa un moderno programma di scrittura come Microsoft Word o Wordperfect questo meccanismo, almeno ad un livello superficiale, dovrebbe risultare alquanto familiare.
I fogli di stile facilitano la formattazione dei documenti, permettono di uniformare lo stile di diversi testi dello stesso tipo, e semplificano la manutenzione degli archivi testuali. Infatti la modifica delle caratteristiche formali di uno o più documenti non richiede di effettuare un gran numero di modifiche locali. Se, ad esempio, una casa editrice decide di cambiare il corpo tipografico dei titoli di capitolo nelle sue pubblicazioni, sarà sufficiente modificare il foglio di stile per quella porzione di testo, ed automaticamente tutti i testi erediteranno la nuova impostazione grafica.
Il meccanismo dei fogli di stile si presta facilmente ad essere applicato ai documenti in formato HTML, e in generale ad ogni documento codificato con linguaggi SGML. Questo tipo di linguaggi, infatti, si basa proprio sulla esplicitazione degli elementi strutturali di un testo attraverso i marcatori. È sufficiente dunque definire una notazione che permetta di associare ad ogni marcatore uno stile. Naturalmente è poi necessario che il browser sia in grado di interpretare questa notazione, e di applicare le relative istruzioni di formattazione. Una notazione di questo tipo è un linguaggio per fogli di stile.
Il linguaggio che è stato sviluppato nell'ambito del W3 Consortium per associare fogli di stile a documenti HTML si chiama Cascading Style Sheet. Ideato originariamente da Håkon Lie alla fine del 1994, è divenuto una raccomandazione ufficiale dell'organizzazione nel dicembre 1996. Il testo definitivo, con il titolo Cascading Style Sheets, level 1, è disponibile al sito Web del W3C, all'indirizzo http://www.w3.org/TR/REC-CSS1-961217.html.
La caratteristica fondamentale del CSS, dalla quale deriva il nome, è la possibilità di sovrapporre stili in cascata; in questo modo l'autore può definire una parte degli stili in un foglio globale che si applica a tutte le pagine di un sito, e un'altra parte in modo locale per ogni pagina, o persino per singoli elementi HTML all'interno della pagina. Le regole per risolvere definizioni conflittuali, esplicitate nelle specifiche, fanno sì che lo stile definito per ultimo prenda il sopravvento su tutte le definizioni precedenti. In teoria, se il browser lo consente, anche il lettore può definire i suoi stili.
La sintassi CSS è molto semplice, almeno al livello base. Ad esempio, per indicare che i titoli di primo livello debbono usare un font Times con dimensione di 16 punti tipografici in stile grassetto è sufficiente scrivere quanto segue:
H1{font-type: "Times"; font-size: 15pt; font-weight: bold}
Per collegare un foglio di stile ad un documento HTML 4.0 sono previsti tre metodi: si può definire il foglio di stile in un file esterno, e collegarlo al file che contiene il documento HTML (mediante l'elemento <LINK>); si possono inserire le direttive CSS direttamente all'interno del file HTML, usando l'istruzione speciale <STYLE>; e infine si possono associare stili ad ogni elemento usando l'attributo style.
Un parziale supporto ai fogli di stile CSS livello 1 è stato implementato sia in Microsoft Internet Explorer (a partire dalla versione 3) sia (con minore completezza) in Netscape Navigator e Communicator (versione 4), e sono sempre di più gli sviluppatori professionali che ne fanno uso per esprimere la grafica dei loro siti. L'adozione di questa tecnologia potrà auspicabilmente porre fine alla corsa per estendere HTML con inutili e confusionarie istruzioni proprietarie, dando agli sviluppatori di siti Web un reale strumento di design grafico.
Attualmente è in fase di definizione la seconda versione del linguaggio (CSS level 2), le cui specifiche (allo stato di working draft) sono disponibili all'indirizzo http://www.w3.org/TR/WD-css2. Questa versione contiene alcune importanti innovazioni; in particolare ricordiamo: il trasferimento dinamico dei tipi di carattere sulla rete, in modo tale da garantire che l'aspetto di una pagina sia esattamente quello progettato anche se l'utente non ha i font specificati sul suo sistema locale; la specificazione di appositi stili orientati ai software di conversione vocale e ai display per disabili; l'estensione delle capacità di controllo del layout e la capacità di gestire diversi supporti di impaginazione per un medesimo documento (ad esempio la visualizzazione su schermo e la stampa su carta).

Prossimo, Precedente, Sommario

Questo sito © 1996-2010 Informex srl P.IVA 12516810152
Sede:Via M. Macchi, 32 Milano Reg. Imp.: MI-1998-176833 Capitale sociale: 60.000,00 Euro
Meglio visualizzato 800x600 TrueColor
Ultimo aggiornamento 18/01/2005 13:45
Privacy Condizioni d'uso