When Foundation 6 launched in November 2015, it brought some significant, forward-thinking changes to the framework including a 50% code reduction, a Flexbox based grid, and a complete A11y friendly rewrite of all of its components.
Since that initial release, the framework has turned five, a few significant additions like ECMAScript 2015 have been added, and loads of bug squashing updates have been released. Because it’s used directly by ZURB themselves in their design consultancy business, the updates come pretty regularly and are often focused on optimizing the performance of the framework.
This latest update is different, and in a good way. For one, it’s the biggest one yet, adding some helpful new tools and adding many features the community has been asking for. It’s also the most community driven of any Foundation release.
A core group of Foundation’s most passionate fans have been designated the Yetinauts, and have a key role and say in the framework’s development. Many of the new features in the 6.3 release came from these individual contributors, supported by the Foundation team at ZURB.
In addition to new components, several of the existing components have been rewritten to add new functionality. Here are a few of the standouts of Foundation 6.3:
- The Off-Canvas has been completely reworked: The new off-canvas implementation in 6.3 now opens from the top, bottom, left, and right, can overlap or push your content, and works with sticky menus. It’s seriously better than anything out there!
- Responsive Accordion to Tabs: Always a frontrunner in responsive web design, this update adds a key responsive pattern that’s been gaining a lot of popularity, responsive accordions to tabs AKA ‘Tabcordion.’ Switch from tabs on larger screens to accordions on small screens and back again automatically to provide the best experience for your users.
- Cards: Cards have been a mainstay of the web for a few years now, and Foundation’s new cards component allows you to get up and running with them quickly and easily. The most exciting possibilities come from using them with Foundation’s optional Flex mode and helper classes to make your UI really sing.
- Mutation observers: a fresh update that most users won’t really notice. Mutation observers work in the background to automatically detect DOM changes and triggers updates in components. No more manually reflowing and reinitializing components needed.
- Deep linking to Tabs: A straightforward but hugely helpful new addition, link users to a specific tab and have it open.
- Print Styling: Foundation 6.3 allows you to now specify exactly which breakpoint you want your print page to mirror.
- Vertical Rhythm: Typography sizing, line height, and margins are all accessible in a single compact setting.
These new additions add a lot of key features that that users have been asking for and make it even easier to code up a beautiful responsive website.
Looking ahead to 2017, the ZURB team have put out their roadmap and invited the community to help chart the course of the framework moving forward. So far they’ve expressed interest in exploring the possibilities of CSS-grid, device specific microinteractions and location/context awareness.
Check out the new Foundation 6.3 update here.
- 50 Free Bootstrap Web Templates & Themes
- 20 Free Bootstrap Admin & Dashboard Templates
- CSS Flexbox Toolbox – Learning Guides, Tools & Frameworks
- 10 Popular Web Typography Frameworks & Libraries
- 20 Responsive & Lightweight CSS Frameworks
- 25 Free CSS Animation Tools & Frameworks
- 10 Free Material Design Web Frameworks Worth Considering
- 50 of Our Favorite CSS Libraries, Frameworks and Tools from 2017