Foundation 6 is bijna klaar om bèta te verlaten, en het is beter dan zijn voorgangers op bijna elke denkbare manier: het is meer gestroomlijnd, het is eenvoudiger en toch op de een of andere manier geavanceerder. ZURB hebben zichzelf overtroffen.
Zoals u zult zien wanneer u het eindelijk geïnstalleerd krijgt - eenvoudig genoeg op OSX of Linux, maar op Windows, kan Node lastig zijn - Foundation 6 kan tegenwoordig alleen worden geïnstalleerd via pakketbeheer. Ik voel me alsof ik oud word, dromend van de goede oude tijd toen CSS-frameworks in .zip-bestanden verschenen, en niet van een terminal-commando.
Toch loog ik niet toen ik zei dat Foundation 6 geweldig is. Wel, ik zou 'Foundation for Sites' moeten noemen, omdat Foundation niet slechts één framework meer is. Naast Stichting voor apps, is Zurb ook bezig geweest met het maken van een paar hulpmiddelen om de ontwikkeling te versnellen.
Deze release draaide allemaal om prestaties ... je kunt sites sneller bouwen, die sites zullen sneller worden gedownload en het JavaScript zal sneller werken.
Ten eerste is er de Stichting CLI , die elke versie van Foundation voor u kan installeren, compleet met startersprojecten. De vooraf gecompileerde CSS in Foundation for Sites is beschikbaar om afzonderlijk te downloaden bij de definitieve release. Voor nu is de CLI echter de manier om deze te krijgen en om up-to-date te blijven met eventuele wijzigingen voorafgaand aan de definitieve release.
En dan is er Panini , een statische paginacompiler met Handlebars-templating en verschillende andere functies waarmee u snel statische prototypen en / of sites kunt bouwen. Het compileert de Sass, plaatst alle JavaScript in één bestand, het kan al uw code comprimeren, en meer.
Krijg nu niet het idee dat deze versie van Foundation minder vervuld is met features - het heeft nog steeds alles wat je nodig hebt en meer - maar het moet opgemerkt worden dat sommige elementen die beter geschikt waren voor apps dan sites verwijderd waren. Die elementen maken er nu deel van uit Stichting voor Apps .
De rest van het werk in deze versie had alles te maken met het wegwerken van overtollige code en het stroomlijnen van alles wat er nog over was.
In plaats van drie verschillende menuonderdelen te maken voor drie verschillende menuontwerpen, is er maar één menuonderdeel, met verschillende variaties. Voor de persoon die de HTML schrijft, is er weinig verschil: voeg een klas toe en je hebt een menu; verander een paar klassen, en je hebt een menu dat er heel anders uitziet.
In feite zullen, voor alle verschillen, veel van de klassen en opmaak er heel vertrouwd uitzien, zo niet hetzelfde. Het is allemaal gebouwd op Sass, dus je kunt het zoals altijd aanpassen.
Deze release ging helemaal over prestaties. Als je eenmaal weet hoe, kun je sneller sites bouwen, die sites sneller downloaden en het JavaScript sneller werken. Fundering in nu ongeveer de helft zo zwaar als het was in termen van bestandsgrootte. Half .
Oudere versies ondersteunden RTL-talen (van rechts naar links) zoals Arabisch tot op zekere hoogte; maar ze hadden wat aanpassingen nodig. Stichting 6 heeft ondersteuning ingebouwd.
Het Flex-raster is precies wat u denkt dat het is: het is de rastercomponent die opnieuw is gemaakt met Flexbox. Aan de ene kant geeft dit het een aantal functies en opties die een regulier float-gebaseerd netwerk niet aankan. Aan de andere kant is het waarschijnlijk niet zo goed ondersteund, met name door IE. Het is een afweging.
Een aantal coole verbeteringen werden toegevoegd voor typografie op de website-stijl. Concreet zijn er helperklassen die zijn ontworpen om typografische lay-outs net iets gemakkelijker te maken te maken:
Zoals hierboven vermeld, zijn alle vorige navigatiecomponenten samengevoegd tot één grote flexibele component. Dit betekent dat alle navigatietypes goed met elkaar zullen spelen. Het betekent ook dat u verschillende soorten navigatie kunt kiezen voor verschillende schermformaten.
Wilt u een drilldown-navigatie op een smartphone en een horizontale balk op een bureaublad? Gemakkelijk gedaan met de schermformaat-specifieke klassen. Wil je je "Topbar" terug? Voeg gewoon een wrapper div toe rond de standaard menucomponenten.
Maar hoewel het over het algemeen eenvoudiger te gebruiken is, zit het nog steeds vol met functies. Bekijk de documentatie over menu's en navigatie .
Ken je die kleine cirkels of vierkanten - meestal geplaatst op of vlakbij iconen van een bepaald soort - met kleine cijfers erin? Zoals wanneer je Facebook-meldingen hebt? Dat worden badges genoemd.
Je leert elke dag iets nieuws. Ook heeft Foundation ze nu.
Wilt u iets op het scherm laten blijven terwijl de gebruiker scrolt? Wil je het op een bepaald punt laten stoppen? Kleverig is jouw plug-in! Dit is ook handig als u wilt dat het Magellan-menu werkt zoals in Foundation 5.
Als dropdowns, accordeons, drilldowns, tooltips en modals niet genoeg voor je zijn, is dit een algemene manier om dingen te laten verschijnen of verdwijnen. Het is een eenvoudige op JavaScript gebaseerde wisselgebeurtenis die op vrijwel alles kan worden toegepast.
Ik stel me voor dat het voor die momenten is waarop geen van de andere componenten aan het doel voldoet, of dat het te veel van het goede zou zijn. Het integreert de Motion UI-bibliotheek, zodat u de verdwijnende handeling op elke gewenste manier kunt animeren.
Nou, de naam klinkt alsof het een element is waar je een video- of Flash-object (bah) kunt insluiten, en dat zou je volgens mij kunnen doen. Waar het voor bedoeld is, is het weergeven van elk media-object, zoals een afbeelding, naast tekstinformatie.
U kunt bijvoorbeeld de avatar van een gebruiker naast zijn gebruikersnaam en zijn opmerking plaatsen in een opmerkingengedeelte. Of u kunt het gebruiken om de releasedatum van een film, hoofdacteurs en andere metagegevens naast een recensie van de film te plaatsen. Raadpleeg de documentatie bijvoorbeeld.
Elke functie is bijgewerkt of herschreven. Veel zijn echter functioneel ongewijzigd. Controleer de documentatie om er zeker van te zijn dat u de juiste klassen heeft, bekijk enkele van de upgrades en ga. Hier zijn deze min of meer dezelfde functies, in alfabetische volgorde:
JEP. De hernieuwde aandacht voor bouwlocaties (in tegenstelling tot een raamwerk dat probeert te voorzien in de behoeften van zowel sites als apps) is verfrissend en verkleinde afmetingen zijn altijd een pluspunt.
Ik kijk er naar uit dat het heel snel live gaat.