Foundation 6 - 10 fantastiske nye funksjoner

Utviklere av stiftelsens rammeverk har ikke bare satt på laurbærene sine, mens Bootstrap-teamet har jobbet med sin imponerende nye store utgave. I fjor gikk de på en fantastisk verdenstur for å dele sin kunnskap med sine brukere og spørre dem om hvordan de bruker Foundation i deres virkelige arbeid.

Etter å ha kommet tilbake til deres arbeidsplasser, samlet de behovene og ønskerne til brukerne, og begynte å planlegge den nye store utgivelsen av rammen: Stiftelsen 6.

Det er fortsatt under utvikling, men planene er svært lovende. De kommende funksjonene fokuserer på tre hovedområder: ytelse, tilpassbarhet og tilgjengelighet. La oss ta en titt på 10 av disse funksjonene nå.

En strømlinjeformet arbeidsflyt

Basert på brukerens erfaringer utviklet stiftelseslaget et nytt slagord, nemlig “Prototype til produksjon”, for Foundation 6. Dette betyr en ny, strømlinjeformet arbeidsflyt som gjør det mulig for designere og utviklere gå rett fra prototype til produksjon.

Målet med den nye stiftelsen 6 er å gi et fleksibelt og lett tilpassbart rammeverk som gjør det mulig å skriv ren og semantisk kode fra begynnelsen. Den nåværende versjonen, Foundation 5 tillater også rask prototyping, men vi kan Forvent ytterligere arbeidsflytoptimalisering i den kommende utgivelsen.

2. Forenklet oppsettprosess for Sass-versjonen

En av de mest fantastiske tingene om stiftelsens rammeverk er at den er bygget med Sass-stilarket, så det er mulig å Tilpass raskt standardstilene til våre faktiske behov.

Sass-oppsettprosessen har vært litt skremmende for mange brukere, men den nye store utgivelsen vil få en forenklet installasjonsprosess for Sass-versjonen. Dette betyr at Sass-oppsettet vil krever langt færre avhengigheter enn før. Selvfølgelig, hvis du foretrekker vanilje CSS-versjonen, kan du fortsatt velge det.

3. En ny, Souped Up Setup Stack for Maximalists

I tillegg til den vanlige Sass-versjonen, kommer Foundation 6 med en suppe Sass-versjonen som gir utviklere kraftige tilpasningsalternativer.

ZURB, skaperen av Stiftelsen vil åpne sin egen utviklingsbunke for publikum, inkludert deres egne statisk nettsted generator, live-reload server og masse indre optimaliseringsteknikker inkludert integrering av UnCSS for fjerning av ubrukte stiler, og UglifyJS for JavaScript-komprimering.

Så i utgangspunktet vil vi være i stand til å jobbe i samme utviklingsmiljø som ZURB internt bruker.

4. Redusert sideopplastingstid

Stiftelsen holdet måtte møte noen konstruktiv kritikk som hevdet at i de fleste Foundation-prosjekter, om 90% av CSS-koden går uutnyttet. Dette var ikke bare sant for Foundation, men også for andre store CSS-rammer som Bootstrap og TopCoat. Som en del av svaret bestemte Zurb seg for å kutte filstørrelsen til den utgitte CSS betydelig ved å implementere en om lag 40-50% kode reduksjon.

Det er interessant å merke seg at de prøver å skille seg fra Bootstrap ved å si "Stiftelsen er ikke et rammeverk som vil ha stilistiske klasser margin og polstring eller runde og radius". (For referanse se Bootstrap 4s nye Utility Classes i vårt forrige innlegg).

5. Basismodeller Fungerer som Wireframes

Den andre delen av forbedringsarbeidet er å lage en basestil som fungerer som en wireframe i stedet for en endelig design. Dette fører primært til et lettere tema, men har også en annen stor fordel. Som flere stilregler vil bli flyttet inn i individuelle komponenter, vil utviklere ha muligheten til å lettere utforme deres design.

Forhåpentligvis betyr dette at nettsteder basert på Foundation vil har mindre av et lignende, standardisert utseende, og designere vil ha mer plass til experiment med vakker og unik oppløsningioner som vil motbevise de siste bekymringene om en kjedelig utseende.

6. Facilitert selektiv import

Stiftelsen 5 tillater utviklere å bare velge komponentene de vil bruke. Stiftelse 6 vil ta denne innsatsen til neste nivå av flytter den selektive importfunksjonen til _settings.scss Sass-filen.

Denne måten _settings.scss blir en virkelig universell konfigurasjonsfil, som vi ikke bare vil kunne tilpasse funksjoner som radbredde eller standardfonter med hjelp, men også enkelt velger ut komponenter som vi ikke trenger. Hvis vi gjør det, kan vi oppnå en ytterligere ytelsesforbedring.

7. Leaner og Cleaner Sass

I redesignprosessen gjenkjente Foundation-teamet alle aspekter av rammen, så de også Endret måten hvordan de har brukt Sass-stilarket. De fant at de i noen tilfeller har overnyttet Sass som fører til unødvendig overcomplication av CSS-utgangen. Med målet om en slankere og renere kodebase i deres sinn har de rasjonalisert deres Sass-struktur også.

I Stiftelse 6 kan vi Forvent redusert nesting og spesifisitet, strømlinjeformede medieforespørsler (de slått sammen repeterende kode), og nedskalert komponentblandinger. Sistnevnte betyr at det vil være mindre komponentblandinger, og de resterende vil ha færre parametere, noe som vil føre til en enklere og mer logisk kode

Hvis du elsker mixins, ikke bekymre deg, hver komponent vil fortsatt ha dem, det er bare at de vil bli redesignet for å være mer effektive og nyttige enn de for øyeblikket er.

8. Forbedret Grid Mixins

Under kutting av komponentblandinger vil Foundation 6 komme med forbedrede rutenettblandinger som vil tillate oss å Lag et mer tilpasset rutenett.

Zurb lover at vi skal kunne enkelt bygge som komplisert rutenett system som vi vil, inkludert mer sofistikerte tilpassede rader og nestede rister, og evnen til å konvertere standardklassen til semantisk markup. De forbedrede gittermixinene vil gjøre gjeldende nettverksskaping enda mer intuitiv, fleksibel og raskere.

9. Sømløs integrering av tilpassede JavaScript-pluginprogrammer

Stiftelsen 5 har for øyeblikket mange JavaScript-komponenter, for eksempel kule modal dialoger, verktøytips, klebrig navigasjonslinje, lysbokser og mange andre som et moderne nettsted trenger, men den kommende store versjonen gjør det mulig for oss å skriv våre tilpassede JavaScript-plugins dra nytte av stiftelsen. Det er et stort skritt fremover i begge deler brukervennlighet og ytelse.

I fremtiden vil vi kunne få tilgang til de innebygde initialiseringsmetodene, bytt utløser og stoppunkter, og bruk alle de andre funksjonene i Stiftelsens globale JavaScript.

10. Full tilgjengelighet

Sannsynligvis den mest fantastiske funksjonen i den nye stiftelsen 6 er at den vil være fullt tilgjengelig. Hver komponent og kodebit vil komme med de riktige WAI-ARIA attributter og landemerke roller. Dessuten vil utviklere selv være utstyrt med en brukerhåndbok handle om hvordan du bruker webnettene a11y.

Så hvis vi ønsker å gi kunden vår et fullt tilgjengelig nettsted, trenger vi ikke å gjøre noe annet enn å bygge vår design med Foundation 6. Vær oppmerksom på at vi fortsatt trenger å legg til de riktige ARIA-reglene på våre HTML-sider på egen hånd, Selv om Zurb kommer en ny brukerveiledning, vil det sikkert lette læringsprosessen.