Siamo pronti a fare a meno di un framework CSS?

Inutile dire che il titolo del mio talk era volutamente provocatorio e ha sollevato parecchie discussioni e domande, a favore e contro dell'approccio proposto.

Ci tengo a precisare che non ho niente contro i framework CSS e sono perfettamente consapevole che in determinati contesti possono avere un senso. La mia era una critica riguardante prevalentemente l'utilizzo di questi per la realizzazione di un sito, spesso e volentieri utilizzandone solo il sistema di griglia.

Voglio provare a riassumere in qualche modo quelle che sono state bene o male le domande, o principali preoccupazioni, da parte di chi non era giustamente d'accordo con il mio punto di vista per cercare di rifletterci su e vedere se siamo veramente pronti a fare a meno di un framework CSS.

Non voglio reinventare la ruota ad ogni progetto!

Ogni sito è unico (o dovrebbe esserlo) e il markup che andrete a scrivere non deve essere influenzato da un framework per quanto mi riguarda.

Se invece state creando diversi progetti derivati uno dall'altro allora una buona idea può essere quella di crearvi una vostra libreria specifica per quei progetti in modo da ottimizzarne il markup e lo sviluppo piuttosto che sovrascrivere mille stili di un framework.

Con il tempo mi sono reso conto che utilizzo sempre le solite funzioni su ogni progetto, come la funzione per stampare una regola per i font, quella per estrarre un colore o il mixin per le media queries. Queste saranno oggetto del prossimo articolo così avrò anche l'occasione di raccontarvi qual'è il mio setup per ogni progetto.

I framework mi danno già una base di accessibilità, perché farne a meno?

Risposta breve
Perché solo facendone a meno imparerete come funzionano veramente le cose.

Risposta lunga
L'accessibilità è una questione delicata e non coinvolge solo lo stile, Bootstrap da parte sua gestisce una piccola parte ma come giustamente fanno notare l'accessibilità riguarda in larga parte il markup che andrete a scrivere e loro non possono prendere una posizione specifica visto che si tratta di componenti generici (stessa cosa vale per i colori).

Ma non basta semplicemente ottimizzare Bootstrap?

Se proprio si vuole usare Bootstrap (o simili) allora una buona strategia può essere quella di ottimizzare la build, essendo interamente basata su SASS, facendo però attenzione a non cancellare a mano delle parti di libreria perché poi diventa molto complesso mantenere la compatibilità con gli aggiornamenti.

Questo comunque è un palliativo, perché di fatto il sistema di griglia, che è anche il più "antiquato" se mi passate il termine, non può essere ottimizzato più di tanto.

Bello CSS Grid, ma se devo supportare ie?

Grid è supportato su IE10 e IE11 ma implementa una vecchia specifica.

Diciamo che a grandi linee le funzionalità principali ci sono, per esempio: grid-template-columns diventa -ms-grid-columns.

Se proprio dovete supportare anche IE9 nel vostro progetto allora probabilmente potrebbe essere una buona idea ricorrere ad un foglio di stile specifico per creare un fallback adeguato, ma non precludetevi la possibilità di utilizzare grid solo perché una piccola fetta della vostra utenza è ancora su vecchie versioni di IE.

Bootstrap però è documentato, come faccio a lavorare con altre persone se creo tutto custom?

Innanzitutto utilizzando una metodologia specifica, come per esempio BEM, OOCSS, SMACSS, ACSS o ITCSS.

Queste metodologie sono ben documentate e se scegliete di utilizzarle automaticamente chi lavorerà con voi saprà come districarsi tra il codice.

Se invece elaborate una vostra metodologia l'unica cosa che potete fare è documentare il codice che andate a scrivere.

Ci vuole tanto tempo per trovare i nomi di classe giusti per gli elementi?

No, anche se all'inizio vi sembrerà lento e tedioso questo processo.

Ringrazio ancora una volta tutte le persone che hanno avuto la pazienza di ascoltarmi e hanno trovato il tempo per confrontarsi con me su questo tema.

Blog