14 novembre 2011

[Code] Rendere il CSS più semplice e potente

Giusto un paio di anni fa Google ha lanciato i closure tool, strumenti che fornivano agli sviluppatori nuove modalità di organizzazione e ottimizzazione del codice JavaScript e HTML.
A due anni di distanza Google Code introduce un nuovo strumento dedicato a rendere la vita degli sviluppatori un po' più semplice.
Questa è la volta del CSS.

I CSS, o Cascading Style Sheets, sono nati nel 1996 con lo scopo di definire la formattazione di una pagina web, tenendo questa parte separata dalla programmazione HTML.
Per quanto utili però i CSS non possono certo essere definiti eleganti e violano infatti uno dei principi cardini del buon sviluppo software: il principio DRY o "don't repeat yourself" o DIE "duplicate is evil" o ancora SPT "single point of truth".
Se per esempio un colore viene usato in diverse classi del foglio di stile esso deve necessariamente essere copiato e incollato diverse volte perché il CSS non ha il concetto di variabile.
Inoltre se c'è un valore in un foglio di stile che è derivato da altri valori non c'è modo di esprimerlo perché il CSS non possiede il concetto di funzione.
Ogni blocco che contiene proprietà simili deve essere ripetuto più e più volte, cosa che naturalmente contribuisce ad avere un codice caotico, poco leggibile e difficile da manutenere.
Per mettere per così dire una pezza a queste carenze del CSS, il team di Google Code ha appena rilasciato Closure Stylesheet, un'estensione al CSS che aggiunge variabili, funzioni, condizioni e mixin al CSS standard.
Vediamo un esempio di definizione di variabili (e variabili a partire da altre variabili) da utilizzare più volte.


@def BG_COLOR              rgb(235, 239, 249);
@def DIALOG_BORDER_COLOR   rgb(107, 144, 218);
@def DIALOG_BG_COLOR       BG_COLOR;

body {
  background-color: BG_COLOR;
}
.dialog {
  background-color: DIALOG_BG_COLOR;
  border: 1px solid DIALOG_BORDER_COLOR;
}

L'add-on può essere scaricato come Java jar e necessita Java per essere avviato.
Questo tool porta una ventata d'aria fresca nel caos del CSS.
Se siete sviluppatori di siti web fateci sapere cosa ne pensate di questo utile, a nostro avviso, strumento.

Nessun commento:

Posta un commento