I CSS (Cascading Style Sheets, Fogli di stile a cascata) nascono ufficialmente nel 1996, con il rilascio della versione di livello 1. Tuttavia la loro storia e la genesi dell'idea che portò alla loro realizzazione risalgono ad alcuni anni prima, e precisamente al 1993, quando per la prima volta si cominciò a parlare di stile per le pagine web. All'epoca infatti le pagine web non avevano stili, e la loro formattazione era affidata unicamente alle preferenze del browser. Gli utenti della mailing list www-talk cominciarono così a chiedere agli sviluppatori di permettere agli autori di influenzare la presentazione delle proprie pagine.
Marc Andreessen, sviluppatore a capo di Mosaic, scrive:
"Infatti, per me è stata una constante fonte di piacere durante lo scorso anno sentirmi continuamente dire, da orde (letteralmente) di persone che – tenetevi forte, ci siamo – volevano controllare il layout dei loro documenti in modi che sarebbero banali in TeX, Microsoft Word, e ogni altro comune ambiente di eleborazione testuale,: "Spiacente, sei fregato."
In seguito Marc divenne co-fondatore di Netscape, che soddisfò le richieste degli autori introducendo tag presentazionali nell'HTML. Il 13 ottobre 1994, Netscape annunciò la prima versione beta del loro browser. Il browser Netscape supportava un insieme di nuovi tag HTML presentazionali (per esempio CENTER per centrare il testo) e altri sarebbero seguiti in breve.
A proposito dell'HTML presentazionale, scrive Lie nella sua tesi ([1]):
"Aggiungendo tag presentazionali all'HTML, il linguaggio si evolse dall'essere un linguaggio di marcatura astratto e strutturato dove gli autori marcavano le differenti regole logiche del testo (paragrafi, intestazioni, elenchi e così via) in un concreto linguaggio di presentazione dove l'enfasi è posta sulla presentazione della forma finale dei documenti (font, colori e layout).
Nella tradizionale pubblicazione cartacea, il lettore riceve un prodotto di forma finale. Ogni lettera sulla pagina stampata ha una posizione fissa, forma, dimensione e colore che non possono essere cambiate dal lettore. I documenti elettronici, tuttavia, sono prodotti non finiti che devono essere assemblati prima di poter essere presentati al lettore umano. Nel processo di assemblaggio , meglio noto come formattazione, vengono fatte molte scelte sulla presentazione del documento. Per esempio, il browser deve selezionare i font e i colori da usare quando presenta il documento su uno schermo a colori. Il livello di eleborazione richiesto da un documento elettronico varierà a seconda del formato di documento usato. Come tali, i documenti elettronici sono simili ai mobili: alcuni mobili giungono pre-assemblati, mentre altri vengono comprati in scatole e il proprietario deve eseguire l'assemblaggio finale. Se un formato di documento richiede molta eleborazione, si dice che ha un alto livello di astrazione. Se il formato di documento richiede poca eleborazione, si dice che ha un basso livello di astrazione.
Determinare il giusto livello di astrazione è una parte importante dello sviluppo di un formato di documento. Se il livello di astrazione è alto, il processo di authoring e il compito di formattare il documento divengono più complessi. L'autore deve far riferimento a concetti astratti non-visibili. Dal lato della ricezione, il browser deve trasformare oggetti astratti in oggetti concreti e questo compito è più complesso se gli elementi sono altamente astratti. Il beneficio di un alto livello di astrazione è che il contenuto può essere riutilizzato in molti contesti. Per esempio, un'intestazione può essere presentata a grandi lettere su fogli stampati, e con voce più forte in un sistema di letture vocale del testo.
Di contro, un basso livello di astrazione renderà il processo di authoring e di formattazione più facili (fino a un certo punto). Gli autori possono usare strumenti orientati al WYSIWYG (What You See Is What You Get), e il browser non deve eseguire trasformazioni estese prima di presentare il documento. L'inconveniente di usare formati di documento orientati alla presentazione è che il contenuto non è facilmente riutilizzabile in altri contesti. Per esempio, può essere difficile rendere disponibili documenti orientati alla presentazione per un dispositivo con una diversa dimensione dello schermo, o per una persona con menomazioni visive.
Quando si trasformano i documenti da un formato ad un altro, vi è la possibilità che i due formati siano su diversi livelli di astrazione. In generale, è possibile trasformare documenti da un livello di astrazione più alto ad uno più basso, ma non il contrario. La scala di astrazione viene introdotta in questa tesi come un modo per misurare il livello di astrazione."
Quello che Netscape fece, seguito poi da Internet Explorer, era l'inizio di una nuova era del Web, caratterizzata dalla cosiddetta "guerra dei browser". Ma in questo caso i browser venivano semplicemente a colmare una lacuna, ossia la mancanza di un linguaggio di stile per la formattazione dei documenti web.
Continua Lie:
"L'introduzione dei tag presentazionali in HTML fu un passo indietro nella scala d'astrazione. Diversi nuovi elementi (per esempio BLINK) avevano senso solo per particolari dispositivi di output (come viene visualizzato il testo lampeggiante su un sistema di sintesi vocale?). I creatori dell'HTML volevano che tale linguaggio fosse utilizzabile per molte impostazioni ma i tag presentazionali minacciavano l'indipendenza dal dispositivo, l'accessibilità e il riutilizzo del contenuto.
Lo sviluppo dell'HTML verso un linguaggio orientato alla presentazione cambiò anche l'equilibrio di potere tra autori e utenti. I documenti strutturati devono essere formattati dal browser prima della presentazione, e , in una certa misura, il processo di formattazione può essere influenzato dall'utente. Tuttavia, quando il browser riceve un documento nella sua forma finale, il processo di formattazione è completo e non può più essere influenzato dall'utente.
Gli autori web avevano chiesto più influenza sulla presentazione del documento e accolsero di buon grado questo sviluppo, ma vi era anche una resistenza nella comunità del Web. Molti erano consapevoli del fatto che il Web aveva il potenziale per realizzare pubblicazioni personalizzate dove il lettore aveva il controllo (piuttosto che l'editore) Il contenuto dovrebbe essere selezionabile secondo le preferenze del lettore, e il media e la forma di presentazione dovrebbero anch'essi essere una scelta del lettore. Trasformando l'HTML in un linguaggio di presentazione c'era il rischio di perdere i gradi di libertà necessari a realizzare un modello di pubblicazione incentrato sull'utente."
Sull'origine del termine foglio di stile, è utile ancora una volta attingere dal lavoro di Lie, che si dimostra quanto mai esaustivo:
"I fogli di stile furono proposti come alternativa all'evoluzione dell'HTML da linguaggio strutturale a linguaggio presentazionale. Il termine foglio di stile viene usato nella pubblicazione tradizionale come un modo per assicurare consistenza [Chicago 1993] nei documenti. Nel processo di pubblicazione tradizionale, un manoscritto è accompagnato da un foglio di stile che serve da resoconto corrente delle regole di stile e di uso del linguaggio adottate da un particolare manoscritto [Broemann-Klein&Wood 1992].
Negli anni '80 la pubblicazione cambiò drasticamente con l'introduzione dei personal computer per l'uso nella preparazione dei manoscritti. La pubblicazione elettronica offriva strumenti per semplificare tutte le fasi della pubblicazione, dalla progettazione, all'editazione e alla strampa. Nella pubblicazione elettronica, il termine foglio di stile venne a significare un insieme di regole su come presentare il contenuto, piuttosto che regole su come scrivere il contenuto. I fogli di stile sarebbero stati specificati dal designer e inviati al compositore prima della stampa. Di solito avrebbero descritto il layout visivo di un documento incentrato sul testo, inclusi i font, i colori e lo spazio bianco.
In questa tesi, il termine foglio di stile si riferisce ad un insieme di regole che associano proprietà stilistiche e valori a elementi strutturali in un documento, ossia esprimendo come presentare un documento. I fogli di stile di solito non contengono contenuto, sono collegabili dai documenti e sono riutilizzabili. Questa definizione consente che il termine venga usato per la pubblicazione elettronica dentro e fuori il Web.
I fogli di stile erano disponibili sui sistemi di pubblicazione elettronica sin dal 1980 (si veda il capitolo 2 e 3). Combinati con i documenti strutturati, i fogli di stile offrivano un late binding [Reid 1989] di contenuto e presentazione dove contenuto e presentazione sono combinati dopo che la fase di progettazione è completa. Questa idea attrasse gli editori per due ragioni. Per prima cosa, si poteva raggiungere uno stile consistente attraverso un insieme di pubblicazioni. Secondariamente, l'autore non doveva preoccuparsi della presentazione della pubblicazione ma poteva concentrarsi sul contenuto.
Alcuni autori trovarono liberatorio non doversi preoccupare di dettagli presentazionali nel processo di progettazione [Cailliau 1997]. Tuttavia la maggioranza degli autori finì con l'usare sistemi di progettazione che enfatizzano la presentazione piuttosto che la struttura [Soaard 1996]."
Sinora sembra logico ritenere che il Web avesse bisogno di un linguaggio di stile. Questa motivazione appare più chiara quando si esaminano da vicino le caratteristiche peculiari di questo nuovo tipo di media. Scrive Lie:
"La ricerca ha dimostrato che quando i documenti sono progettati con la copia stampata come obiettivo finale è difficile motivare gli autori a lavorare su un livello logico piuttosto che su uno visuale [Sandahl 1999]. Con l'affermazione del Web, tuttavia, aumentano le possibilità per il riutilizzo del contenuto. Invece di stampare e distribuire i documenti su carta, i documenti web sono trasferiti elettronicamente sul computer dell'utente. Lo spostamento verso la distribuzione elettronica dei documenti ha diverse caratteristiche chiave che influenzano sia il processo di progettazione che i linguaggi di stile.
- Il late binding diviene later binding: sul Web, i documenti sono trasmessi in forma elettronica sul computer dell'utente. Il late binding fra contenuto e presentazione della pubblicazione elettronica diviene later binding sul Web. Il binding [legame, N.d.T.] non ha più luogo nel luogo di pubblicazione ma, piuttosto, nel computer dell'utente. Questo aumenta la libertà di presentazione ma pone anche una nuova sfida di esecuzione, poiché il binding ha luogo quando l'utente è in attesa. Ancora: l'autore non è presente per assicurarsi che la presentazione sia corretta.
- La pubblicazione incetrata sulla carta diviene incentrata sullo schermo: Prima dell'avvento del Web, gran parte dei documenti elettronici finivano come documenti stampati. Erano editati ed elaborati su schermi di computer ma, assai spesso, il tipo di media finale era la stampa. Sul Web, la maggioranza degli utenti vede i documenti sullo schermo.
- Un output singolo si trasforma in output multipli: Sebbene gli schermi siano il tipo di media principale sul Web, esistono molti altri tipi. Gli autori non conoscono il tipo di dispositivo di output che verrà usato da un utente. Non c'è più una sola presentazione di forma finale, ma ve ne sono molte. Perciò è importante che i fogli di stile possano descrivere presentazioni per dispositivi di output multipli.
- Il controllo dell'autore diviene influenza condivisa tra autore e utente: Poiché il legame tra contenuto e presentazione ha luogo sul computer dell'utente, le influenze provenienti da fonti diverse possono essere combinate per formare una presentazione. Data questa libertà, sembra ragionevole che l'utente, come l'autore, dovrebbe poter influenzare la presentazione. Diventano possibili presentazioni basate sui bisogni e le preferenze dell'utente. Ciò si distingue da altri ambienti di pubblicazione, dove gli autori hanno il controllo completo della presentazione.
- Documenti autonomi divengono collegati ipertestualmente: Il Web è un grande insieme di documenti collegati ipertestualmente e l'informazione precedentemente espressa come riferimenti testuali può ora essere espressa come ipercollegamenti attivi.
- La distribuzione sicura diviene incerta: Le risorse web sono distribuite su molti computer interconnessi e la possibilità che una risorsa non sia disponibile è considerevole. Un altro cambiamento sta nel fatto che è più probabile che il Web fallisca rispetto ai sistemi di pubblicazione tradizionali. È naturale rendere disponibile il foglio di stile sul Web, ma la risorsa può non essere sempre disponibile per l'utente.
Così, con l'introduzione del Web, il campo dei fogli di stile si è spostato dall'essere uno strumento per gli autori nel processo di progettazione all'essere uno strumento per il riutilizzo del contenuto dopo la sua generazione. I fogli di stile sul Web sono potenzialmente più importanti di quelli della pubblicazione incentrata su carta poiché la possibilità del riutilizzo del contenuto è maggiore. Come la natura dei fogli di stile è cambiata dalla pubblicazione cartacea a quella elettronica, così la natura dei fogli di stile è cambiata nuovamente per la pubblicazione web."
Una rozza forma di fogli di stile fu inserita nel primo WWW client implementato sulla macchina NeXT al CERN. Tuttavia, non fu scritta alcuna specifica per i fogli di stile e non fu proposta alcuna sintassi per un linguaggio di stile; si considerò un problema di ciascun browser decidere come far visualizzare le pagine agli utenti.
Ricorda Lie:
" I potenziali benefici dell'uso di fogli di stile sul Web sono significativi. Un meccanismo di foglio di stile ben sviluppato fornirebbe agli autori un vocabolario stilistico più ricco rispetto all'evoluzione possibile dell'HTML. Ancora: l'HTML rimarrebbe un linguaggio di marcatura strutturato che funziona su un'ampia gamma di dispositivi."
Per questi motivi, molte persone sulla mailing list www-talk [www-talk], che era il luogo di incontro elettronico della prima comunità web, concordarono che il Web avrebbe tratto beneficio dai fogli di stile. Tuttavia, c'era un disaccordo sul fatto che il Web richiedesse o meno un nuovo linguaggio di stile oppure se fosse più adatto uno già esistente, concepito principalmente per la pubblicazione cartacea.
Diversi linguaggi di stile per il Web furono proposti nel 1993 (si veda il capitolo 4 della tesi di Lie: proposte di fogli di stile per il Web) ma nessuno prese slancio. Ciò era principalmente dovuto alla carenza di supporto nei browser; poiché Mosaic, di gran lunga il browser più popolare dei suoi tempi, non supportò i fogli di stile, gli autori erano poco motivati a scriverli. Ancora: nesssuna delle proposte raggiunse lo stato di stabilità. Un linguaggio di stile di successo per il Web doveva essere abbastanza convincente per essere implementato dagli sviluppatori di browser e per essere usato dagli autori.
Lie ricorda così la genesi dei fogli di stile:
" Tre giorni prima che Netscape annunciò il suo nuovo browser, l'autore pubblicò la prima proposta sui CSS (denominata Fogli di stile a cascata per l'HTML: una proposta) [Lie 1994] sul Web. Oltre a descrivere font, colori e layout di documenti (già fatto in precedenza da diverse proposte) i CSS introducevano una nuova funzionalità per tener conto delle differenze di pubblicazione imposte dal Web. Il concetto di cascata consentiva sia agli autori che agli utenti di influenzare la presentazione di un documento:
Lo schema proposto fornisce al browser un elenco ordinato (cascata) di fogli di stile. L'utente fornisce il foglio iniziale che può richiedere un controllo totale della presentazione, ma, più verosimilmente, gestisce l'influenza sui fogli di stile che si riferiscono al documento fornito.
Il negoziato tra i bisogni e i desideri dei lettori e degli autori era una delle principali ambizioni dei CSS. In caso di successo, gli autori avrebbero avuto la loro influenza sulla presentazione e non si sarebbero sentiti costretti a usare l'HTML presentazionale e altri trucchi. I lettori, da parte loro, avrebbero avuto dei documenti in una forma in cui potevano scegliere se accettare la presentazione suggerita dall'autore o specificarne una propria.
In molti casi non vi sarebbe stato conflitto tra autore e lettore. Nessuno dei due, ad esempio, potrebbe v oler specificare la presentazione del documento. In questi casi, è importante che il browser abbia un foglio di stile predefinito che descriva la presentazione predefinita dei documenti HTML. I CSS, dunque, definiscono tre fonti possibili per i fogli di stile: autori, lettori e browser. I CSS sono in grado di combinare i fogli di stile da queste tre fonti per formare la presentazione di un documento. Il processo che combina diversi fogli di stile (e risolve i conflitti se questi ricorrono) è conosciuto come cascata."
La prima proposta sui CSS fu diffusa nello spirito del libero scambio di idee su come il Web avrebbe dovuto svilupparsi, e le discussioni ebbero luogo sulle mailing list pubbliche. Un certo numero di sviluppatori rispose alla proposta e la bozza fu ulteriormente sviluppata. Durante il 1995, furono pubblicate circa otto revisioni. L'ultima, del dicembre 1995, fu dichiarata stabile e i produttori di browser furono incoraggiati a usarla come base per le implementazioni.
Con qualche piccola eccezione, la sintassi della bozza del dicembre 1995 è rimasta stabile e la prima sezione delle specifiche può ancora servire da introduzione ai CSS:
"Sviluppare semplici fogli di stile è facile. C'è solo bisogno di conoscere un pò di HTML e la terminolgia di base della pubblicazione desktop. Per esempio, per impostare il colore del testo degli elementi 'H1' sul blu, si può scrivere:
H1 { color: blue }
L'esempio consiste di due parti principali: il selettore ('H1') e la dichiarazione ('color: blue'). La dichiarazione ha due parti, proprietà ('color') e valore ('blue')."
Le specifiche CSS1 divennero una Raccomandazione W3C nel dicembre 1996. Nel maggio 1998 i CSS2 divennero una Raccomandazione W3C. Il capitolo 6 della tesi di Lie (Fogli di stile a cascata) descrive lo sviluppo delle Raccomandazioni con maggiori dettagli.
Undici anni dopo la pubblicazione della prima proposta CSS, tutti i maggiori browser supportano i CSS e la maggioranza della pagine web li usa. Permangono ancora dei problemi di interoperabilità tra i browser, ma con il rilascio della versione 7 di Internet Explorer questi problemi si avviano ad una conclusione positiva.