Leggendo su un altro forum mi sono imbattuto nel mondo dei CSS Frameworks. Quello che ho esaminato in particolare è BluePrint . Mi chiedevo se qualcun altro si fosse imbattuto in framework CSS, suggerire quale è il migliore e se ne vale la pena?
Leggendo su un altro forum mi sono imbattuto nel mondo dei CSS Frameworks. Quello che ho esaminato in particolare è BluePrint . Mi chiedevo se qualcun altro si fosse imbattuto in framework CSS, suggerire quale è il migliore e se ne vale la pena?
Risposte:
I "framework" CSS mancano completamente del punto.
CSS non è come JavaScript, in cui è possibile includere una libreria / framework di base e quindi chiamare funzioni e oggetti da esso per svolgere un lavoro di livello superiore. Tutto ciò che un framework CSS può darti sono regole dichiarative: alcune cose predefinite di reimpostazione delle regole del browser, alcuni stili di classe a cui forzare l'autore della pagina e regole di layout che usano 'float' e 'clear'. Puoi scriverlo tu stesso in poche righe di CSS invece di inserire le centinaia di regole del framework.
Le cose del "layout a griglia", in particolare, risalgono ai vecchi tempi in cui si mescolava la presentazione nel markup. 'div class = "span-24"' non è migliore di una tabella, dovrai tornare lì e cambiare il markup per influenzare il layout. E tutti i framework che ho visto sono basati su scatole flottanti a pixel fissi, rendendo impossibile creare un layout liquido accessibile su una vasta gamma di dimensioni di finestre.
È l'authoring all'indietro, utile solo per qualcuno troppo spaventato per scrivere una regola CSS.
Quindi, nessuno ha ancora risposto a questa domanda (anche se ho visto alcuni voti positivi), quindi Cercherò almeno di affrontare la seconda domanda in questo suggerimento.
I framework CSS sono fantastici; come qualsiasi altro framework, riducono i tempi di sviluppo e ti consentono di lavorare immediatamente su design e CSS specifici del sito. Pensano a decisioni difficili, quindi non devi.
Sfortunatamente, ci sono due svantaggi nell'utilizzo di un framework (in generale):
Il framework determina la struttura generale e i meccanismi del codice CSS. Ora, non sto parlando di un reset CSS (questi sono utili di per sé, ma non sono veri framework); Sto parlando di un framework da onesto a buono, che ha già preso le decisioni su quali tag semantici utilizzerai nel tuo documento, ecc. In quanto tale, sei reso dipendente dal framework e quando c'è un bug nel framework, dovrai più comunemente aggiustarlo da solo.
I framework non sono una scusa per essere ignari dei problemi di cross-browser / CSS avanzati. Li incontrerai invariabilmente, proprio come faresti con un framework PHP o JavaScript. E devi sapere come affrontarli. C'è un detto comune secondo cui dovresti scrivere il tuo framework prima, prima di usare quello di qualcun altro.
Dando una rapida occhiata a Blueprint, non lo definirei davvero un framework; forse un ripristino con alcune chicche extra in cima.
Ho esaminato BluePrint e pochi altri e l'unico "framework" CSS che consiglierei è YUI Grids
Professionisti:
Contro:
Come altri hanno pubblicato, non ci sono veri "framework" per i CSS. Reimpostare i fogli di stile aiuta molto anche con il layout. Di solito mi attengo a un foglio di stile di ripristino e vado da lì. Ma se non hai molta esperienza con CSS, YUI Grids potrebbe farti risparmiare un po 'di tempo.
Prenditi il tempo per studiare e capire (capire davvero!) Alcuni framework CSS come BluePrint e YUI e resettaggi CSS come Eric Meyer. Quindi, prenditi il tempo per mettere insieme il tuo ripristino e / o il tuo framework in base ai tuoi metodi di lavoro e al tipo di siti che crei.
Personalmente, utilizzo la maggior parte del ripristino di Eric Meyer con alcune classi e ripristini personali, oltre ad alcune idee di BluePrint e YUI.
Recentemente ho visto Eric Meyer fare una presentazione su CSS Frameworks in cui ha posto la domanda: "quindi qual è quello giusto per me?" Ha quindi risposto alla domanda mostrando una diapositiva vuota. Il suo punto era che ci sono certamente alcuni concetti utili incorporati nella maggior parte dei reset e dei framework, ma quello che ti si addice meglio è quello che scrivi per te stesso (ne vale la pena).
Perché usare i "framework" CSS?
Se sei sotto pressione per il tempo.
Se non conosci css e non conosci qualcuno che possa scriverlo per te.
Se non sei eccessivamente prezioso riguardo agli standard, ecc.
Conosco programmatori che sono stati davvero felici di usare blueprint o 960, in quanto consente loro di mettere insieme un layout da soli, senza rivolgersi a uno sviluppatore front-end. Questo è l'ideale per progetti personali o startup con risorse limitate.
Se hai già una discreta conoscenza dei CSS, presumibilmente hai già una discreta libreria di layout stock, quindi chiaramente non avrai bisogno di un framework.
Tuttavia, se sei un principiante e hai solo bisogno di installare qualcosa e funzionante, potresti rivolgerti a un framework, poiché rende il layout di base molto più semplice e affronta anche la compatibilità del browser.
Detto questo, molti framework fuori dagli schemi fanno uso di nomi di classi orribili ecc. Conosco alcuni siti web che hanno preso un framework come punto di partenza e poi lo hanno personalizzato con la propria classe e tag di identificazione. Ma chiaramente c'è anche un po 'di lavoro coinvolto in quella riscrittura. Usare qualcosa come Compass, come accennato in precedenza, aiuta a aggirare il problema.
Quindi, i framework CSS: possono farti risparmiare tempo, a scapito della semantica. Potrebbero anche danneggiare la tua conoscenza dei CSS, ma dipende più da quanto investi nell'apprendimento della materia in generale. Dipende da te decidere se farne uso.
Dovresti chiederti quanto siano efficaci i framework disponibili nel risolvere i tuoi problemi. Soddisfano le tue esigenze?
Utilizzando un framework, puoi impostare alcune regole o dettagli a livello di pixel e dedicare il resto del tuo tempo all'implementazione e alla produzione. È un enorme aumento della produttività. Se ti ritrovi a passare del tempo ad aggiustare le cose di pochi pixel in ritardo nel progetto (micro gestione del design), è un segno che un framework può essere utile.
Suggerimento n. 17 in The Pragmatic Programmer dice: "Programma vicino al dominio del problema". L'utilizzo di uno strato di astrazione può avvicinarti alla risoluzione dei problemi reali del layout. Ad esempio: potresti essere in grado di concentrarti sul miglioramento dell'esperienza utente con il tempo extra che hai piuttosto che con piccoli aggiustamenti dei pixel.
Questo non vuol dire che devi sacrificare la qualità per la quantità. Si tratta di efficienza.
In un progetto recente, ho creato il mio framework perché avevamo risorse molto limitate e i framework popolari non facevano quello che volevo. Quindi, ho impostato i PSD del team di progettazione in modo che si aggancino alla stessa griglia che ho distribuito.
Un framework non deve essere una particolare implementazione dei CSS. Non deve essere qualcosa di gonfio che hai scaricato da Internet o qualcosa che implementa idee obsolete. È solo una tecnica per portare a termine un lavoro. Non sarei sorpreso se alcuni programmatori avessero già i propri framework e non lo sapessero nemmeno. In effetti, se consideri il DOM come un insieme di elementi predefiniti che estendi con CSS, allora questo è un framework per definizione.
In realtà ho passato una buona parte delle ultime 24 ore a indagare da solo, eh. La mia conclusione è stata che un bel reset (ho usato YUI Reset ), e forse qualcos'altro per impostare le cose di base (i caratteri YUI erano utili nel mio caso; forse le "chicche extra" di BluePrint sarebbero state nel tuo) è una buona idea. Ma un "framework" --- che generalmente è qualcosa come le griglie YUI --- è troppo restrittivo, costringendoti a usare i loro nomi di classe, ID, ecc. E raramente si adattano al tuo sito come farebbero i CSS fatti a mano.
Quindi, in breve: i ripristini sembrano piuttosto belli; è bene eliminare tutte le variazioni, ad esempio, del margine rispetto alla spaziatura interna per gli elenchi, della spaziatura dei paragrafi o altro. Ma questo è quanto mi piacerebbe.
Non l'ho usato sì, ma penso che emastic possa essere una buona alternativa che vale la pena controllare. è simile al progetto in ambito, ma supporta anche layout elastici (da cui il nome) e puoi specificare valori in px, em o% e persino mescolarli.
La bussola penso sia fantastica. Assicurati di vedere lo screencast .
Sto usando 960.gs per alcuni siti web e lo trovo molto semplice e facile e ne vale la pena. Mi fa risparmiare molto lavoro sul layout. Assicurati di controllare il generatore CSS personalizzato che va via con la larghezza fissa di 960 pixel.
Penso che questo video di presentazione del CEO di Site Point Kevin Yank risponderà alla tua domanda. Consiglio vivamente di guardarlo.
Compass ti consente di rinominare le classi e gli ID del tuo framework con i tuoi nomi semantici, quindi potresti voler controllare. Fornisce anche accesso a cose che non si ottengono con CSS semplici come i mixin.
Sono sbalordito dai cosiddetti "esperti CSS" che criticano questi strumenti senza averli realmente scavati e usati. Sono essenziali? No. Se ti piace il tuo framework (ne hai uno tuo, giusto? Un framework CSS è solo una libreria accuratamente definita - tutti dovrebbero usarne uno) allora con ogni mezzo, continua a usarlo. Nessuno ti costringe a usare altri framework e non vedo persone che usano framework dire ai puristi CSS che stanno "facendo male".
Criticare le strutture da un simile punto di vista rivela solo un'insicurezza e un'ignoranza. Ad esempio, l'idea è ridicola che una persona utilizzerebbe uno strumento come Compass senza conoscere CSS. Ti rendi conto, vero, che un framework generalmente non scrive tutto il tuo CSS per te? Puoi ancora suddividere e scrivere il tuo CSS nel contesto della maggior parte dei framework. In effetti, se non conosci i CSS potresti sentirti frustrato rapidamente.
Per quanto mi riguarda, apprezzo avere un framework perché è già documentato, testato da centinaia di altri utenti e posso applicare le mie classi e i miei ID tramite Compass. Se ho bisogno di qualcosa per cui il framework non è adatto, codificherò il mio.
Matt Raible di AppFuse ha tenuto un concorso CSS Framework qualche tempo fa per sviluppare CSS Frameworks per AppFuse. I risultati sono pubblicati qui . Ci sono alcune varianti e io ne ho usate alcune perché uso AppFuse e le trovo molto buone.
Aggiungo che questi framework CSS funzionano bene perché vengono utilizzati in applicazioni a tema. Cioè, se ti attieni alle regole, passare da uno a quello successivo è semplice come cambiare un valore in un file delle proprietà.
Ho usato BluePrint con molto successo su un sito (potrei menzionare il sito qui ma sono sicuro che il post sarebbe stato contrassegnato come spam!). Non sono sicuro se lo userò in futuro, perché una delle idee di CSS che pensavo fosse quella di non avere la logica di layout codificata. Non dovresti avere elementi CSS chiamati span-24 e span-12 per definire il layout ma qualcosa come searchBox e mainContent. Almeno è così che la vedo.
Buon collegamento che ho trovato: i 12 migliori framework CSS e come capirli
Ecco il mio post sul blog sui framework CSS Quando utilizzare il framework CSS?
L'unico modo che conosco per utilizzare un framework CSS e conservare il markup semantico è utilizzare un'astrazione di livello superiore. Al momento, Compass è l'unico di cui sono a conoscenza che è abbastanza maturo da poter essere usato, ma Nicole Sullivan sembra fare cose interessanti con il suo progetto "Object-Oriented CSS".
Trovo che l'uso intelligente di Compass dei mixin Sass sia brillante e un grande passo verso il Sacro Graal del markup semantico mantenibile. Non penso che vorrei utilizzare un framework come Blueprint o YUI senza un'astrazione come Compass per mantenere le classi di presentazione fuori dal markup.
A proposito, c'è un bel framework CSS chiamato Elastic che sembra abbastanza buono che sto considerando di aggiungerlo a Compass.
Credo che CSS riguardi la semplicità. L'obiettivo è avere uno o due posti da controllare quando fai riferimento tra l'HTML e il tuo foglio di stile. L'aggiunta di più righe, e specialmente righe che non avete scritto e con cui probabilmente non avete familiarità, aumenterà esponenzialmente la complessità e quindi la volatilità del codice CSS.
Suggerirei i tuoi layout mentre li scrivi e sviluppi un sistema di modelli generico da quello. Anche se amo rendere i CSS più modulari, spesso ea seconda del design, il tuo CSS potrebbe essere molto specifico per il caso e per niente modulare.
Ho utilizzato Blueprint su alcuni siti una tantum e ha sicuramente risparmiato tempo, principalmente nei test cross-browser.
Sicuramente fa schifo aggiungere codice di presentazione al tuo markup, anche se il lato positivo è leggibile. Anche se adoro il concetto di "puoi riprogettare senza toccare il markup", se stai producendo un sito in cui ciò non accadrà comunque e hai solo bisogno che sia fatto ieri, Blueprint è qualcosa da guardare.
Tuttavia, esistono anche dei compromessi sui tipi di layout che può creare. Se esegui il wireframe del sito dall'inizio su una griglia rigida, sarà molto più facile trasporre nel framework con il minimo sforzo.
Ho usato BluePrint e YUI ma mi sento sempre frustrato con alcuni dei nomi che danno al loro ID e alle classi.
A ciascuno il suo, ma preferisco fare le cose da zero, ma dopo un po 'sviluppi un processo in cui utilizzerai il tuo lavoro precedente e lo applicherai a nuovi progetti e apporterai solo alcune modifiche per rendere il sito web come vorresti piace.
Assicurati di utilizzare una buona convenzione di denominazione, nel caso in cui qualcun altro in futuro entri per modificare il css, allora avranno una buona idea a cosa si riferisce ogni nome di stile.
Brama,
Compass è quello che stai cercando: ti permette di rinominare le tue classi CSS Blueprint come "span-24" con i tuoi nomi. Espande anche la funzionalità CSS con variabili e mixin. In verità, quelli che giudicano prematuramente i framework senza aver controllato Compass "perdono il punto". È un po 'come quelle persone che ci hanno detto anni fa che ci manca il punto usando CSS invece di tabelle HTML per i nostri layout.
-Opaco
controlla http://www.ez-css.org/ . uno dei framework CSS più facili e leggeri su cui lavorare. :)
Dai un'occhiata a questa demo: http://www.richstyle.org/demo-web.php Questo framework si basa sull'idea che "i tag HTML dovrebbero essere sufficienti". Penso che la riutilizzabilità sia il fattore più importante per la scelta di un componente software, incluso un framework web. Per gli sviluppatori di framework web, più ti impegni per gli standard, più garantisci la riusabilità.