Il Framework CSS ideale

I Framework CSS sono fogli di stile con regole già pronte, che teoricamente dovrebbero servire per tutte le esigenze. In realtà per me non è così, il mio CSS di base è costruito su misura.

CSS Edit LogoIn questi giorni ho ottimizzato il CSS di base che utilizzo come partenza per tutti i miei lavori. Scartare a priori l’idea di utilizzare un qualsiasi Framework CSS, come Blueprint, è stata la prima cosa che ho fatto.

Per chi non lo sapesse i Framework CSS sono fogli di stile con regole già pronte, che teoricamente dovrebbero servire per tutte le esigenze, ma che almeno nel mio caso complicano solo il lavoro. Spesso proprio questa generalità implica un’inutile mole di codice, che nella maggior parte dei casi non viene utilizzato.

Queste soluzioni non potranno mai essere universali: ognuno è abituato ad utilizzare un metodo diverso, e CSS Reset a parte tutto il resto ha comunque bisogno di essere personalizzato.

E’ appunto solo il CSS Reset di Eric Meyer che uso come punto di partenza, perchè consente di avere una buona coerenza tra i vari browser senza i problemi del reset con il selettore universale “*”.

Nel mio caso ho eliminato i selettori che non utilizzo per alleggerire il codice, ma la base è sempre quella di Eric.

Inoltre una comoda aggiunta per la quale ho rubato l’ispirazione a Piotr, è l’inserimento di una sezione dedicata ai colori utilizzati, all’inizio del CSS. Un comodo riferimento durante lo sviluppo, anche per eseguire al volo dei copia-incolla dei codici esadecimali.

Il risultato finale è un CSS che potete vedere a questo indirizzo, ma che non è pensato per essere adatto a tutti, l’ho realizzato esclusivamente per me.

Il mio consiglio è di ispirarsi alle varie soluzioni che offre la rete, ma costruirsi un CSS di base secondo le proprie esigenze. Solo così potrete ottimizzare i tempi nella scrittura di un foglio di stile.

Vuoi far crescere il tuo progetto online?

Tommaso Baldovino

UX/UI Designer, professionista del web con più di 15 anni di esperienza su WordPress. Sono disponibile a seguire nuovi progetti dall'ideazione alla realizzazione finale. Scrivo ogni 2 settimane la mia newsletter.

7 commenti su “Il Framework CSS ideale”

  1. Diciamo che la tua è un’idea piuttosto diffusa ormai. Il campo “design” si sta sempre più fondendo con numerose altre discipline – come normale che sia?!? – e da ciò non può esistere nella pratica un framework ideale, solo quello che si avvicina di più alle tue idee e ai tuoi progetti. Piuttosto potrebbero esistere dei framework gà pronti basati parzialmente su uno stile o su uno schema (o semplicemente su quello che io chiamo mezzo-layout, a torto o a ragione). In genere però, chi ama sviluppare prima o poi finisce per sviluppare un framework personale e personalizzato. Ad esempio, per i miei temi wordpress già utilizzo almeno tre livelli di framework ognuno adatto ad una particolare idea. Il tuo articolo mi ha dato l’ispirazione di teorizzare le mie idee. Quindi, a presto!

  2. Io utilizzo un Framework che mi serve solo per applicare i reset, per il resto il codice è scritto per quello che mi serve e non contiene elementi di troppo.
    Il tuo Tom è essenziale e ben fatto, magari si può pensare di crearne uno modulare, in base agli elementi che utilizzeremo nel sito.

  3. @kiko: allora aspetto di vedere le tue idee messe in pratica :)

    @Salentino: concordo, i framework CSS modulari sono sicuramente i migliori, in modo da poter eliminare le parti superflue. Purtroppo non è detto che ciò che resta sia perfetto.

  4. Tom, bell’articolo (anche se vecchio).
    Personalmente sto sperimentando 960 Grid system come Framework.

    Credo che il framework sia utile quando più persona lavorano allo stesso progetto. Chi disenga il layout un PSD non rischia di farmi impazzire cone strane misure o costringendomi a prendere misure.

    In questo modo guardo le guide e scelgo la classe giusta, ho dimezzato il tempo.

    Ad oggi usi ancora il sistema dell’articolo o hai trovato soluzioni super ninja? :-)
    Ciao

  5. @Sebastian per i CSS uso ancora una soluzione simile, anche se negli anni si è evoluta a seconda delle esigenze. In diversi progetti in HTML5 ho anche cambiato la parte di reset, per tutti i nuovi elementi (nav, header, footer, section, ecc…).

  6. Ciao Tom, ottimo articolo, Credo che il framework sia utile quando più persona lavorano allo stesso progetto. Chi disenga il layout un PSD non rischia di farmi impazzire cone strane misure o costringendomi a prendere misure.