Fondazione 6 - 10 fantastiche nuove funzionalità

Gli sviluppatori del framework di front-end della Fondazione non si sono semplicemente seduti sugli allori, mentre il team Bootstrap ha lavorato alla loro impressionante nuova major release. L'anno scorso hanno fatto un fantastico World Tour per condividere le loro conoscenze con i loro utenti e chiedere loro come stavano usando Foundation nel loro lavoro nella vita reale.

Dopo essere tornati ai loro banchi, hanno aggregato i bisogni e i desideri dei loro utenti e si sono impegnati a pianificare la nuova versione principale del framework: Foundation 6.

È ancora in fase di sviluppo, ma i piani sono molto promettenti. Le funzioni in arrivo si concentrano su 3 aree principali: prestazioni, personalizzazione e accessibilità. Diamo un'occhiata a 10 di queste funzionalità ora.

1. Flusso di lavoro semplificato

In base alle esperienze degli utenti, il team della Fondazione ha sviluppato un nuovo slogan, ovvero “Prototipo alla produzione”, per Foundation 6. Ciò significa un nuovo flusso di lavoro semplificato che consentirà a progettisti e sviluppatori passare direttamente dal prototipo alla produzione.

L'obiettivo della nuova Foundation 6 è di fornire un framework flessibile e facilmente personalizzabile che consenta di farlo scrivere codice pulito e semantico fin dall'inizio. La versione attuale, Foundation 5 consente anche la prototipazione rapida, ma possiamo aspettarsi un'ulteriore ottimizzazione del flusso di lavoro nella prossima versione.

2. Processo di installazione semplificato per la versione Sass

Una delle cose più straordinarie del framework Foundation è che è costruito con il linguaggio di stile Sass, quindi è possibile personalizzare rapidamente le regole di stile predefinite in base alle nostre reali esigenze.

Il processo di configurazione di Sass è stato un po 'intimidatorio per molti utenti, quindi la nuova major release lo sarà ottenere un processo di installazione semplificato per la versione Sass. Ciò significa che l'installazione di Sass lo farà richiedono molte meno dipendenze di prima. Ovviamente, se preferisci la versione CSS vanilla, puoi comunque optare per quello.

3. Uno stack di setup nuovo e memorizzato per i Maximalists

Oltre alla normale versione di Sass, la Foundation 6 arriverà con un souped up Versione di Sass che fornirà agli sviluppatori potenti opzioni di personalizzazione.

ZURB, il creatore di Foundation aprirà il proprio stack di sviluppo per il pubblico, incluso il proprio generatore di siti statici, live-reload server e un sacco di tecniche di ottimizzazione interne inclusa l'integrazione di UnCSS per la rimozione di stili inutilizzati e UglifyJS per la compressione JavaScript.

Quindi fondamentalmente saremo in grado di lavorare nello stesso ambiente di sviluppo che ZURB utilizza internamente.

4. Tempo di caricamento della pagina diminuito

Il team della Fondazione ha dovuto affrontare alcune critiche costruttive che affermavano che nella maggior parte dei progetti della Fondazione, circa il 90% del codice CSS è inusitato. Questo non era vero solo per Foundation, ma anche per altri importanti framework CSS come Bootstrap e TopCoat. Come parte della loro risposta, Zurb ha deciso di ridurre in modo significativo le dimensioni del file del CSS emesso implementando una riduzione del codice di circa il 40-50%.

È interessante notare che cercano di distinguersi da Bootstrap affermando "La fondazione non è una struttura che avrà margine di stile stilistico e riempimento o arrotondamento e raggio(Per riferimento vedi le nuove classi di utilità di Bootstrap 4 nel nostro post precedente).

5. Stili di base che fungono da wireframe

L'altra parte dello sforzo di miglioramento delle prestazioni è crea uno stile di base che funge da wireframe anziché da un progetto finale. Questo porta principalmente a un tema più leggero, ma ha anche un altro grande vantaggio. Man mano che più regole di stile verranno spostate in singoli componenti, gli sviluppatori avranno la possibilità di farlo più facilmente stile il loro design.

Spero che ciò significhi che i siti basati sulla Fondazione lo faranno avere meno di un aspetto simile, standardizzato, e i designer avranno più spazio per esperiment con solut bello e unicoioni che confutano le recenti preoccupazioni su un web dall'aspetto noioso.

6. Importazione selettiva facilitata

Foundation 5 consente agli sviluppatori di scegliere solo i componenti che desiderano utilizzare. La Fondazione 6 porterà questo sforzo al livello successivo di spostando la funzione di importazione selettiva nel file Sass di _settings.scss.

In questo modo _settings.scss sarà un file di configurazione veramente universale, in quanto non solo saremo in grado di personalizzare funzioni come la larghezza delle righe o i caratteri predefiniti con il suo aiuto, ma anche con facilità optando per i componenti di cui non abbiamo bisogno. Se lo facciamo, possiamo ottenere un ulteriore miglioramento delle prestazioni.

7. Leaner e Cleaner Sass

Nel processo di riprogettazione, il team della Fondazione ha ripensato ogni aspetto del framework, così anche loro cambiato il modo in cui hanno usato il linguaggio del foglio di stile Sass. Hanno scoperto che in alcuni casi hanno abusato di Sass che ha portato al superflua complicazione dell'output CSS. Con l'obiettivo di avere una base di codice più snella e pulita nella loro mente, hanno anche razionalizzato la loro struttura Sass.

Possiamo fare in Foundation 6 aspettarsi una nidificazione e una specificità ridotte, query media ottimizzate (hanno unito il codice ripetitivo) e mixin componenti ridimensionati. Quest'ultimo significa che ci saranno meno mixin di componenti, e quelli restanti avranno meno parametri, che porteranno a un codice più semplice e più logico

Se ami i mix, non preoccuparti, ogni componente li avrà ancora, è solo che saranno riprogettati per essere più efficienti e utili di quanto non lo siano attualmente.

8. Mix di griglia migliorati

Durante il taglio dei mixin dei componenti, verrà fornito Foundation 6 mixin griglia migliorata che ci permetterà di creare una griglia più personalizzata.

Zurb promette che potremo facilmente costruito come complicato sistema a griglia come vogliamo, incluso righe personalizzate più sofisticate e griglie annidate, e la capacità di convertire le classi predefinite in markup semantico. I mixin di griglia migliorati renderanno la corrente creazione della griglia ancora più intuitiva, flessibile e veloce.

9. Perfetta integrazione di plugin JavaScript personalizzati

La Foundation 5 attualmente ha molti componenti JavaScript come dialoghi modali, tooltip, barra di navigazione appiccicosa, lightbox e molti altri di cui un sito web moderno ha bisogno, ma la prossima importante release ci consentirà di scrivi i nostri plugin JavaScript personalizzati approfittando del nucleo della Fondazione. È un enorme passo avanti in entrambi facilità d'uso e prestazioni.

In futuro, saremo in grado di accedere ai metodi di inizializzazione integrati, attiva i trigger e punti di interruzione, e utilizzare tutte le altre funzionalità del JavaScript globale di Foundation.

10. Completa accessibilità

Probabilmente la caratteristica più sorprendente della nuova Foundation 6 è che sarà completamente accessibile. Ogni componente e lo snippet di codice verrà fornito con gli attributi WAI-ARIA appropriati e i ruoli principali. Inoltre, gli sviluppatori lo saranno anche fornito con una guida per l'utente di come usare gli standard web di a11y.

Quindi, se vogliamo fornire al nostro cliente un sito web completamente accessibile, non dobbiamo fare nient'altro che costruire il nostro design con Foundation 6. Notare che avremo ancora bisogno di aggiungi le regole ARIA appropriate alle nostre pagine HTML da sole, anche se la prossima guida per l'utente di Zurb faciliterà sicuramente il processo di apprendimento.