Variabili CSS: perchà© aspettare?

La recente introduzione delle variabili CSS in Webkit ha reso certamente felici e speranzosi molti web designer, ma nessuno sa se (e quando) arriverà  il giorno in cui soluzioni di questo tipo potranno essere utilizzate quotidianamente diventando cioè standard ed essendo adeguatamente supportate dai vari browser in circolazione.

Per chi, come il sottoscritto, non volesse attendere, esiste una valida alternativa da aggiungere a quelle già  citate un'anno fa qui su Edit: parlo di CSS Cacheer.

Cacheer, realizzato da Shaun Inman, è un pre-processore CSS scritto in PHP che, come funzionalità  di base, permette di definire e richiamare costanti e blocchi di dichiarazioni CSS nelle varie regole di un foglio di stile.

Per esempio, è possibile scrivere:

@constants{ /* Dichiarazione di costanti */
    pageWidth: 760px;
    colWidth: 100px;
}
@base(colonna){  /* Blocco di dichiarazioni di nome 'colonna' */
    overflow: hidden;
    width: const(colWidth);
}
div#container{
    width: const(pageWidth);
    margin: 0 auto;
    /* Regole annidate */
    div#rightCol{
        based-on: base(colonna);
        float: right;
    }
    div#leftCol{
        based-on: base(colonna);
        float: left;
    }
    div#content{
        margin-left: const(colWidth);
        margin-right: const(colWidth);
    }
}

Lo script entra in azione al momento della richiesta del file, processandolo e sostituendo i riferimenti alle costanti con i rispettivi valori: il risultato sarà  quindi un normale foglio di stile interpretabile da ogni browser che supporti i CSS 2.1.

Unica mancanza dello script è forse un metodo per gestire gli header HTTP che controllano il funzionamento delle cache e che si rivelano molto utili nel caso di file statici come, appunto, i fogli di stile.

Cacheer è comunque facilmente estendibile ed alcuni dei plugin forniti permettono di definire regole annidate, @import lato server e, cosa molto interessante, di ridurre il numero di richieste HTTP per le immagini includendole nel foglio di stile stesso tramite un data URI (questo solo per i browser che lo supportano).

Tutto cià senza attendere lunghi processi di standardizzazione, di implementazione e, soprattutto, senza problemi di supporto da parte dei browser.

Quindi... perché aspettare? :-)