Il 27 Luglio 2013 è stato rilasciato Boostrap 3RC1, la versione semi definitiva del nuovo front-end framework più in voga del momento.
Come citato sul blog, tutto è cambiato dalla versione 2, con oltre 1600 commit, circa 72000 nuove aggiunte ed eliminazioni e circa 300 file modificati. Sono state introdotte nuove funzioni, rimosse alcune caratteristiche e soprattutto ripulito e fatto ordine nel codice.
Mobile first
La novità che salta subito all’occhio è la caratteristica dell’essere ora “mobile first“. Con Bootstrap 2, erano presenti nel foglio di stile direttive opzionali per rendere l’interfaccia mobile-friendly. Con Bootstrap 3, è stato riscritto l’intero progetto per essere mobile-friendly già dall’inizio.
E’ stato seguito infatti l’approccio del “mobile-first“, ovvero si è partiti dallo sviluppare Bootstrap per dispositivi mobili, aggiungendo via via le direttive css per rendere il framework compatibile anche per tablet e desktop. Quindi invece di inserire a posteriori nel codice la compatibilità per il mobile, è stato introdotto già nel nucleo del progetto primordiale. Per questo motivo Bootstrap 3 è definito “mobile-first”. Gli stili per il mobile si trovano ora sparsi su tutta la libreria invece che su un file separato (vd. bootstrap-responsive.less).
Grid System
Altra novità è la riscrittura del grid-system, ovvero è cambiato il modo con cui vengono creati gli spazi che contengono gli elementi della pagina web.
Non esiste più la differenza tra .row (colonne divise staticamente con dimensione fissa) e .row-fluid (colonne divise in modo dinamico in base allo spazio a disposizione), ma ora è tutto confluito in .row che equivale alla vecchia .row-fluid.
Il cambiamento più consistente sta nella dichiarazione delle colonne. Il vecchio .spanX è sostituito dalle classi .col-lg-X per i desktop, .col-sm-X per i tablet e .col-X per i mobile. Il sistema diventa più versatile così da poter avere piena padronanza di come sarà visualizzata la pagina nei tre tipi di dispositivi.
Flat Design
La tendenza del design in questa determinata fase del web, ci conduce ad un design meramente al servizio della fruizione dei contenuti, chiamiamolo pure “design autentico“. Gli orpelli decorativi non hanno più senso di esistere e il design è diventato uno strumento per presentare i contenuti su un determinato dispositivo. Lo scheuomorfismo, ovvero l’ornamento grafico che richiama le caratteristiche estetiche di un oggetto reale, è definitivamente morto. Ora si osserva il dispositivo utilizzato e si cerca di estrarne tutte le potenzialità attraverso design.
Anche Bootstrap segue lo zeitgeist, e i bottoni a rilievo vengono ora sostituiti da bottoni piatti (flat) le barre di navigazione con gradiente ora hanno campiture a tinta unita.
Miglioramenti
Tra le nuove aggiunte trovo interessante l’aggiunta dei Panels, ovvero elementi racchiusi in box, utili per creare widget nelle zone secondarie, come per esempio nelle sidebar.
Inoltre l’introduzione dei List Group lo fanno sempre più avvicinare ad un framework per disegnare GUI per mobile.
E’ stato riscritta la gestione delle griglie di thumbnail, prima fuori standard e ora molto più comprensibile. Anche il Carousel si presenta più ordinato e il nuovo restyling con i bottoni di navigazione più piccoli e gli indicatori di posizione a pallini, gli conferisce più eleganza.
Conclusioni
Sono davvero contento Bootstrap 3 perchè mi fornisce sempre maggiori opportunità di design e mi garantisce stabilità e compatibilità di visualizzazione. Come quando si cambia il proprio computer per prenderne uno più potente, anche con il cambio di release avremo un miglioramento nel nostro modo di lavorare.