CSS  »  Articoli  »  Mondo CSS 

In questo articolo ripercorreremo la storia dei CSS attraverso gli articoli e le risorse che maggiormente hanno contribuito alla loro diffusione. Si tratta ovviamente di una selezione personale, in quanto le letture che presenterò sono quelle che hanno avuto una certa importanza per la mia formazione, anche se la loro valenza è comunque universalmente riconosciuta. Cominciamo subito.

Il layout

La vera linea di demarcazione tra il web vecchio stile con tabelle per l'impaginazione e spacer gif da una parte e quello moderno rappresentato dai div e CSS per l'impaginazione corrisponde proprio all'uso dei fogli di stile per il layout.

Tra il 2001 e il 2002, sono moltissime le risorse nate proprio per informare il lettore su questo approccio di impaginazione: tra tutte le più influenti sono state BlueRobot, Glish e Box Lessons. È curioso pensare come all'inizio i posizionamenti assoluti andassero per la maggiore nella realizzazione dei layout, mentre ora i float sono la maniera più diffusa.

Per le risorse in italiano, vale la pena citare i molti layout presenti su Constile di Gianluca Troiani, e tra quelle di casa l'articolo Un sito ridimensionabile con i CSS e la Guida al layout con i CSS, pubblicata a inizio 2004.

Uno scossone decisamente forte al modo di sviluppare siti l'hanno dato nel 2003 due pubblicazioni. La prima è la presentazione Why Tables for layout is stupid , un vero e proprio invito, tra l'altro molto accattivante, ad usare div e fogli di stile per il layout. La seconda è forse la prima risorsa ad offrire layout personalibili e pronti all'uso: Layout-o-Matic. Uno dei meriti più grandi di questo servizio è che è stato in grado di avvicinare molto sviluppatori e appassionati ai Layout con i CSS. Da segnalare in merito un'articolo introduttivo pubblicato proprio qui su HTML.it, ovvero Layout in CSS con Layout-o-matic .

Passando ad approcci più moderni, un passo avanti notevole per il modo di fare layout è stato compiuto con Creating Liquid Layouts with Negative Margins e più tardi con One True Layout. Tecniche quali i margini negativi e Any ordered Columns sono state presentate nella serie Layout Gala su HTML.it di cui è disponibile una pagina indice con i 40 layout presentati nell'articolo.

Liste e menu

La navigazione è un aspetto fondamentale di un sito, e un grosso passo avanti è stato compiuto dai CSS proprio per la natura semantica del codice HTML a monte. Trattandosi di un elenco (o lista che dir si voglia) di link, la marcatura ideale per la navigazione è proprio attraverso una lista non ordinata. L'articolo Taming Lists su A List Apart dà in questo senso il via a questo approccio di codifica, dando un appetitoso assaggio delle potenzialità dei fogli di stile.

Seguono poi diversi tutorial che offrono spunti notevoli: a memoria, quelli che hanno avuto maggior popolarità sono Uberlink CSS Menu, le Minitabs e Navigation Matrix; ma senza dubbio posso affermare che la risorsa più autorevole e completa in fatto di navigazione sia Listamatic seguito da ListaMatic 2. Qui sulle pagine di HTML.it segnalo invece la serie Menu grafici con rollover e preload via CSS e un Menu a tabs con i CSS.

Una menzione particolare va a Pure CSS menu di Eric Meyer. Già nel 2002 uno degli autori più influenti e preparati - se non il più preparato in assoluto - in materia di CSS a livello mondiale, ha elaborato questa tecnica per avere menu dropdown con solo l'impiego dei CSS. A distanza di diversi anni non siamo purtroppo in grado di implementarla senza l'ausilio di Javascript dato che Internet Explorer fino alla versione 6, che detiene tuttora la maggioranza di uso per i browser, non supporta la pseudo-classe :hover su qualcosa di diverso dai link.

Altri articoli

Altre guide

Altre newsletter