Mancanze e difetti più evidenti dei CSS, in un articolo aperto a opinioni e suggerimenti.
Senza dubbio i CSS sono uno strumento essenziale per ogni web designer, ma non sono esenti da difetti. Prendendo spunto da un recente post di Rockholderdesign, ho voluto riassumere quelle che secondo me sono le più gravi mancanze.
Ecco cosa che mi piacerebbe vedere implementato.
Selettori ascendenti
E’ una buona pratica l’uso dei selettori discendenti per evitare l’abbondanza di classi, ma al momento non esiste modo di selezionare il genitore di un particolare elemento.
Posizionamento verticale
Alcune azioni apparentemente intuitive sono fin troppo complicate con i CSS. Ad esempio il posizionamento orizzontale è elementare, ma centrare un elemento verticalmente non è così semplice.
Espressioni matematiche
Non è possibile usare formule per calcolare una dimensione, come ad esempio width: 100% – 5px;
Contenimento dei float
Non esiste una proprietà per far contenere ad un elemento un float (problema noto anche come auto-clear di un div). Ci sono degli hack, ma spesso portano a conseguenze indesiderate.
Background multipli
Attualmente è impossibile specificare una doppia immagine di sfondo su un elemento. La possibilità è prevista nei CSS3, e sarebbe di grande aiuto per evitare markup aggiuntivo.
Angoli arrotondati
I CSS permettono di utilizzare solo forme rettangolari. Sarebbe utile l’introduzione degli angoli arrotondati, così come quella di altre semplici forme facilmente gestibili dal foglio di stile.
Variabili
L’introduzione delle variabili sarebbe un vero passo avanti per i CSS. Poter dichiarare colori, bordi e altri elementi in maniera sintetica agevolerebbe il lavoro. C’è qualche speranza per il futuro, ma è ancora un’ipotesi lontana.
Colonne
Realizzare dei layout con 2, 3 o più colonne è ovviamente possibile, ma anche in questo caso non esistono dei moduli CSS appositi. Sarebbero sicuramente utili delle proprietà su misura per dividere uno spazio in colonne.
Maggiore coerenza tra i browser
Il punto fondamentale, non imputabile direttamente ai CSS. Ciò che crea più problemi tra gli sviluppatori è il differente supporto tra i vari browser esistenti. Alcuni come Safari e Opera si spingono fino ai CSS3, altri come Explorer non arrivano nemmeno alle specifiche dei CSS 2.1. Maggiore coerenza non farebbe male.
Alcuni di questi punti sono caso di studio per le future specifiche dei CSS, altri sono solamente delle ipotesi. Secondo voi cosa altro manca? Poche aggiunte faciliterebbero il compito di chi lavora ogni giorno con i fogli di stile: non sono problemi insormontabili e c’è sempre un modo per aggirarli, ma riuscire ad evitare hacks e markup aggiuntivo sarebbe un sogno.
Daccordissimo su tutti i punti, soprattutto sulle variabili (sarebbero utilissime), background multipli e selettori ascendenti.
Per me manca una certa apertura su certe proprietà multiple (tipo il font) che senza un corretto ordine non funziona. Non è così per tutti.
anch io concordo su tutto, per quanto riguardi i bordi verrano supportati nel prossimo css3 ( http://www.css3.info/preview/ ) come anche l’ ombra sui div o sul testo. un giorno mi piacerebbe poterlo usare come un vero linguaggio di programmazione quindi con variabili, espressioni matematiche, passaggio di parametri, funzioni che generano layout, librerie da poter implementare.. sto sognando troppo?
Io aggiungerei: la possibilità di impostare la dimensione in percentuale per le immagini in modo che siano dinamicamente ridimensionabili a seconda della risoluzione (più o meno come width 100% -Npx) e soprattutto la possibilità di infilare il php nei CSS esterni… farebbero la mia felicità!
Secondo me il css dovrebbe essere maggiormente rigido. Molto spesso vedo, e faccio, degli arrocchi nel css veramente brutti. Ci dovrebbe essere un sistema che mi permettesse di vedere o meglio gestire l’ereditarità degli attributi. Quando lavori su piccoli progetti la cosa è di poco conto ma su grossi progetti rischi di scrivere molto codice in più, quindi inutile.
Forse l’utilizzo delle variabili esula da quello per cui era stato creato. Più che un linguaggio di programmazione io il css l’ho sempre visto come un’insieme di regole e non come un’insieme di funzioni e procedure. Aggiungere un’idea del genere forse portebbe maggior confusione sia dal punto di vista nostro e sia per chi deve implementare tutti i sistemi di controllo per far si che il circo funzioni.
Alla funzione “angoli arrotondati” dico che sarebbe bello poter aggiungere la possibilità di creare gradienti. Per le sfumature bisogna sempre ricorrere a piccole immagini.
Certo la possibilità di mettere due immagini di sfondo sarebbe fantastica. Spesso sono costretto a ricorrere a div vuoti, con margini in negativo (che non sopporto proprio).
Inoltre a mio avviso andrebbero corretti alcuni difetti dei float, delle position:absolute e degli z-index, che spesso annullano il disegno presente sullo sfondo.
Sempre nei position:absolute, sarebbe bellissimo poter posizione un footer in posizione assoluta SEMPRE, ma mi sa che qua le cose si complicano troppo.
@David Terni: se ho capito bene il tuo commento, non mi trovi molto d’accordo sulla prima parte: il codice di un CSS è responsabilità dello sviluppatore, maggiore rigidità sarebbe eccessiva. Per trovare ripetizioni e regole inutili è meglio servirsi di tool online e strumenti simili :)
@Tom Non sono così sicuro: un esempio veramente banale potrebbe essere sull’uso quasi indiscriminato dei px contro gli em o l’uso del %. Tool o strumenti per pulire il codice come sicuramente saprai alle volte non sono LA soluzione andando a peggiorare o modificare il risultato di partenza. Secondo me questo succede perchè ci sono problemi sull’attribuzione dell’ereditarietà degli stili e lo si deve al fatto che il codice non è rigido. Ti servi di qualche tool da consigliare?
@David Terni: ho capito meglio quello che intendi, dipende sicuramente dal tipo di problema che ci si trova ad affrontare. Parlando di regole inutili sui CSS sicuramente una risorsa interessante è Dust-Me Selectors, un’estensione di Firefox, anche se sinceramente la vedo più utile per un’analisi a posteriori su un sito realizzato da altri, piuttosto che su lavori propri.
sarebbe utilissimo poter scrivere vere e proprie funzioni per calcolare, per esempio, i caratteri di una stringa e dare degli effetti particolari solo a certe lettere!
“Angoli arrotondati” – Attualmente sono supportati solo da Firefox e Safari, mi meraviglio che non siano supportati da Opera (nemmeno nella versione 10 alpha!!)
“Colonne” – Si può rimediare con php, in caso di ‘colonnizzazione’ di dati prelevati da db (dipende dai casi ovviamente), oppure con le ‘aimè’ tabelle… ovviamente le tabelle da usarsi per intabellare dati, non per layout!
“Maggiore coerenza tra i browser” – Questo direi di affidarlo agli sviluppatori dei browser…. IE è come sempre un disastro, anche nelle ultimissime versioni.. complimenti a Opera invece, che nella versione 10 alpha supera al 100% l’acid test3
Pienamente d’accordo.
In particolare mi stupisce che semplici variabili di assegnazione dei valori non siano già una realtà. Migliorerebbe l’uniformità dello stile ed il suo aggiornamento. Sarebbero utilissimi anche per cambiare “tema”.