Stichting 6 - 10 geweldige nieuwe functies

Ontwikkelaars van het front-end framework van de Foundation hebben niet alleen op hun lauweren gezeten, terwijl het Bootstrap-team aan hun indrukwekkende nieuwe grote release heeft gewerkt. Vorig jaar gingen ze op een geweldige World Tour om hun kennis te delen met hun gebruikers en hen te vragen hoe ze Foundation gebruikten in hun echte werk.

Nadat ze teruggekeerd waren naar hun bureau, verzamelden ze de behoeften en wensen van hun gebruikers en begonnen ze aan de planning van de nieuwe belangrijke release van het framework: Foundation 6.

Het is nog in ontwikkeling, maar de plannen zijn veelbelovend. De komende functies richten zich op 3 hoofdgebieden: prestaties, aanpasbaarheid en toegankelijkheid. Laten we nu eens naar 10 van deze functies kijken.

1. Gestroomlijnde workflow

Op basis van de ervaringen van hun gebruikers heeft het Foundation-team een ​​nieuwe slogan ontwikkeld, namelijk “Prototype tot productie”, voor Foundation 6. Dit betekent een nieuwe, gestroomlijnde workflow waarmee ontwerpers en ontwikkelaars kunnen werken Ga direct van prototype naar productie.

Het doel van de nieuwe Foundation 6 is om een ​​flexibel en gemakkelijk aanpasbaar kader te bieden dat dit mogelijk maakt schrijf vanaf het begin schone en semantische code. De huidige versie, Foundation 5 maakt ook snelle prototyping mogelijk, maar we kunnen dit wel verwacht verdere workflow-optimalisatie in de komende release.

2. Vereenvoudigd installatieproces voor de Sass-versie

Een van de meest geweldige dingen over het Foundation-raamwerk is dat het is gebouwd met de Sass-stylesheet-taal, dus het is mogelijk om snel de standaardstijlregels aanpassen aan onze werkelijke behoeften.

Het installatieproces van Sass was voor veel gebruikers echter een beetje intimiderend, dus de nieuwe belangrijke release zal dat wel zijn krijg een vereenvoudigd installatieproces voor de Sass-versie. Dit betekent dat de Sass-instelling dit zal doen vereisen veel minder afhankelijkheden dan voorheen. Natuurlijk, als u de vanille CSS-versie verkiest, kunt u er nog steeds voor kiezen.

3. Een nieuwe, gesoupeerde setup-stack voor maximalisten

Naast de reguliere Sass-versie, komt Foundation 6 met een gerust hart Sass-versie die ontwikkelaars krachtige aanpassingsmogelijkheden biedt.

ZURB, de maker van Foundation, zal zijn eigen ontwikkelingsstapel voor het publiek openen, inclusief die van henzelf statische site generator, live-herlaad server en Heel veel interne optimalisatietechnieken inclusief de integratie van UnCSS voor het verwijderen van ongebruikte stijlen en UglifyJS voor JavaScript-compressie.

In principe zullen we dus kunnen werken in dezelfde ontwikkelomgeving die ZURB intern gebruikt.

4. Verminderde laadtijd van de pagina

Het Foundation-team moest een aantal constructieve kritieken tegemoet zien die beweerden dat bij de meeste Foundation-projecten ongeveer 90% van de CSS-code ongewijzigd blijft. Dit gold niet alleen voor Foundation, maar ook voor andere belangrijke CSS-frameworks zoals Bootstrap en TopCoat. Als onderdeel van hun antwoord besloot Zurb de bestandsgrootte van de uitgevoerde CSS aanzienlijk te verminderen door een codebeperking van ongeveer 40-50% in te voeren.

Het is interessant om op te merken dat ze zichzelf proberen te onderscheiden van Bootstrap door te zeggen:Stichting is geen raamwerk dat stilistische klassen marge en opvulling of ronde en straal heeft"(Zie de nieuwe Utility Classes van Bootstrap 4 in onze vorige post).

5. Basistijlen handelen als wireframes

Het andere deel van het streven naar prestatieverbetering is om maak een basisstijl die fungeert als een draadframe in plaats van een definitief ontwerp. Dit leidt vooral tot een lichter thema, maar heeft ook nog een groot voordeel. Naarmate meer stijlregels worden verplaatst naar afzonderlijke componenten, krijgen ontwikkelaars de kans om dit te doen gemakkelijker hun ontwerp vormgeven.

Hopelijk betekent dit dat sites op basis van Foundation dat wel zullen doen hebben minder een vergelijkbare, gestandaardiseerde uitstraling, en ontwerpers zullen meer ruimte hebben om te expandereneriment met mooie en unieke solutionen die recente zorgen over een saai uitziend web zullen weerleggen.

6. Facilitated Selective Import

Met Foundation 5 kunnen ontwikkelaars alleen de componenten kiezen die ze willen gebruiken. Stichting 6 zal dit streven naar een hoger niveau tillen door de selectieve importfunctie verplaatsen naar het Sass-bestand _settings.scss.

Op deze manier is _settings.scss een echt universeel configuratiebestand, omdat we niet alleen functies zoals rijbreedte of standaardlettertypen kunnen aanpassen met de hulp, maar ook gemakkelijk afmelden voor de componenten die we niet nodig hebben. Als we dat doen, kunnen we een verdere prestatieverbetering bereiken.

7. Slanker en schoner Sass

In het herontwerpproces heeft het Foundation-team elk aspect van het framework heroverwogen, dus ook zij veranderde de manier waarop ze de Sass-stylesheet-taal hebben gebruikt. Ze ontdekten dat ze in sommige gevallen Sass hebben overgebruikt die tot de onnodige overcomplicatie van de CSS-uitvoer. Met het doel van een slankere en schonere codebasis in hun hoofd, hebben ze hun Sass-structuur ook gerationaliseerd.

In Stichting 6 kunnen we dat verwacht afgenomen nesting en specificiteit, gestroomlijnde mediaquery's (ze hebben herhaalde code samengevoegd), en teruggeschroefde componentmixins. Dit laatste betekent dat er minder componentmixins zullen zijn en dat de resterende minder parameters hebben, wat zal leiden tot een eenvoudiger en logischer code

Als je van mixins houdt, maak je geen zorgen, elk onderdeel zal ze nog steeds hebben, het is alleen dat ze opnieuw worden ontworpen om efficiënter en nuttiger te zijn dan ze op dit moment zijn.

8. Verbeterde Grid Mixins

Bij het terugdringen van componentmixins komt Foundation 6 met verbeterde grid-mixins dat zal ons toestaan maak een meer op maat gemaakt raster.

Zurb belooft dat we dat zullen kunnen eenvoudig bouwen als een gecompliceerd rastersysteem zoals we willen, inclusief meer verfijnde aangepaste rijen en geneste rasters, en de mogelijkheid om de standaardklassen te converteren naar semantische markup. De verbeterde grid-mixins zullen de stroom vormen Gridcreatie nog intuïtiever, flexibeler en sneller.

9. Naadloze integratie van aangepaste JavaScript-plug-ins

Foundation 5 heeft momenteel veel JavaScript-componenten, zoals coole modale dialogen, tooltips, een sticky navigatiebalk, lichtbakken en vele andere die een moderne website nodig heeft, maar de komende grote release zal ons in staat stellen om schrijf onze aangepaste JavaScript-plug-ins profiteren van de kern van de Foundation. Het is een enorme stap voorwaarts in beide gebruiksvriendelijkheid en prestaties.

In de toekomst zullen we dat kunnen toegang krijgen tot de ingebouwde initialisatiemethoden, schakel triggers in en breekpunten, en maak gebruik van alle andere functies van Foundation's wereldwijde JavaScript.

10. Volledige toegankelijkheid

Waarschijnlijk de meest verbazingwekkende eigenschap van de nieuwe Foundation 6 is dat deze volledig toegankelijk zal zijn. Elk onderdeel en codefragment krijgt de juiste WAI-ARIA-kenmerken en landmarkrollen. Bovendien zullen ontwikkelaars dat zelfs zijn voorzien van een gebruikershandleiding wat betreft hoe de a11y webstandaarden te gebruiken.

Dus als we onze klant een volledig toegankelijke website willen bieden, hoeven we niets anders te doen dan ons ontwerp met Stichting 6 te bouwen. Houd er rekening mee dat we nog steeds voeg de juiste ARIA-regels toe aan onze HTML-pagina's op onze eigen, hoewel de komende gebruikershandleiding van Zurb zeker het leerproces zal vergemakkelijken.