未加星标

Foundation 6.3: Latest Updates and What’s Coming in 2017

字体大小 | |
[前端(javascript) 所属分类 前端(javascript) | 发布者 店小二05 | 时间 2017 | 作者 红领巾 ] 0人收藏点击收藏

The folk at ZURB and Foundation’s community of developers have been hard at work, pushing towards releasing a big update of Foundation for Sites. Let’s dive in, see what’s going on right now, and ask the team what’s coming!

What’s New?

Foundation 6.3 brings about some solid changes to the framework, whilst staying true to what makes it so darn good.

UI Cards

Cards are gaining more and more popularity as a pattern on the web; they’re a really good way of showing your users condensed pieces of information, and they work great for responsive websites. Not only that, they’re intuitive too, as long as you use them correctly !

There was some debate about putting cards into Foundation is it a component you actually need in a responsive framework, or should you build your own cards with the tools you’re given? The bottom line is that Foundation is also a rapid prototyping tool and for me, the inclusion of cards means I can prototype that much faster. Even when going to production, these cards are a welcome addition to the force.


Foundation 6.3: Latest Updates and What’s Coming in 2017
Flexbox Helpers

Flexbox is great, because it allows us to make more (you’ve guessed it!) flexible layouts in our designs. Flexbox aims to provide a more efficient way of laying out and distributing space among items in your webpage, even (and this is the great part) when the size of those items is dynamic and unknown.

Foundation 6.3 provides us with helpers that make Flexbox more accessible and easier to prototype with. For example, floats and clearfix are hacks; means to an end. To replace those we use Flexbox Helpers.


Foundation 6.3: Latest Updates and What’s Coming in 2017

“Flexbox is an important part of modern web design and we want to stay on top of that.” Kevin, Foundation Community Manager

A Completely New Off-Canvas

Some would say this might have been overdue, but, it has been done at last. The Off-Canvas element has had a rework and it is awesome. You don’t even have to change any mark-up as it is backwards compatible.


Foundation 6.3: Latest Updates and What’s Coming in 2017

The mark-up of the new Off-Canvas is even more simplified; we now have the ability to use Off-Canvas as an overlay and open from top or bottom, instead of only pushing the content away. Even that is now more polished than ever, so be sure to check out the Off-Canvas in the Foundation for Sites docs .

Accordion to Tabs: Responsive Magic

Ever fiddled with tabs that are useful on big screens but become a complete mess on mobile devices? No more! With “responsive accordion to tabs” you can switch your UI based on screen size and provide a better user experience for your mobile visitors. It’s easy to implement and the benefits are massive!


Foundation 6.3: Latest Updates and What’s Coming in 2017
Vertical Rhythm to Dance to

Implementing a solid vertical rhythm in your type can greatly improve the look and feel of your website. Foundation has always made it easy for us to manipulate the different sizes of header and body text, but with the Foundation 6.3 update, the configuration of typography sizing, line height, and margins have all been made accessible in a single compact setting. Ease of use at its best.

Observe, Observe.. Mutation Observers

Sometimes small tasks can become tedious, but then there are those updates that will take that pain away. This is the case with the new mutation observers, which work behind the scenes and automatically detect DOM changes and trigger updates in components. This saves you manually having to reflow elements to trigger changes in things like reveal modals, sticky bars, equalizer, and more. Awesomeness.

Deep Linking to Tabs

Deep linking plays an important part when getting your users to the right page especially important on eCommerce websites and mobile apps. With Foundation 6.3 you can easily direct your users to specific content you’ve placed in tabs and thus make use of deep linking yourself.


Foundation 6.3: Latest Updates and What’s Coming in 2017
Print Styling

Up until this latest update from Foundation, you’ve had to set up your own custom print stylesheets for webpages. Foundation would only show the mobile screen, whilst other frameworks wouldn’t even do that, meaning you had get your hands dirty and do the work yourself.

Those days are a thing of the past thanks to Foundation 6.3, because you can now specify exactly which breakpoint you want your print page to mirror, and Foundation will figure out the rest. Nice.


Foundation 6.3: Latest Updates and What’s Coming in 2017
ZURB: the Interview

We wanted some inside information about how the framework has reached its current position. We also asked what we can expect from Foundation in 2017. This is what the ZURB team had to say:


Foundation 6.3: Latest Updates and What’s Coming in 2017

What were the biggest challenges to overcome in 2016?

That would have been how browsers would handle certain CSS selectors and our grids. They all work nicely now, but it took some time for modern browsers to catch up with all the web has to offer.

Our CSS grid needed (and needs) to become more versatile and become a core component of Foundation. We need to see what that core value offers and how it benefits anyone using our framework.

What are you expecting to accomplish in 2017?

One of the things we’re working on, and what we will most certainly accomplish in 2017 is reworking our javascript for Foundation. We’re going to take more advantage of the modern tools out there and also make it easier for our users to plugin their own custom components.

One more thing would be reworking the menu components. They’re already really powerful, but, when you take them outside their norm, they’re still a bit fragile. We’ll be working hard on it to get to the point that you can customize them however it suits your project.

What is the main priority for 2017?

We will definitely be looking at the ease of use of the framework, things like reusable building blocks and a more plug-gable Foundation, so that people can add their own twist to it. Making it more plug-gable allows for more versatile components and reusable blocks will let use prototype even faster and cleaner.

What are some new things coming up in 2017?

We’ll want to do more with SVGs as they keep playing a greater roll in flexible and responsive web design. We want to see how we can implement and manipulate SVGs for different states and screen sizes. One thing we’ll be looking at is an easier way to make and integrate SVGs into your project using Foundation for Sites.

Are you afraid Foundation is becoming too bloated?

This is always something to be keen about. On the one hand, having lots of components helps us prototype and develop faster. On the other hand, more components can mean unused code, which makes a lean project too bloated. We’re optimizing how things can be integrated and making it so that you can choose to work in additional components for your specific project. One thing we keep a sharp eye on is keeping the core compact and strong.

How is Motion UI coming along?

That’s a great question! We’re actually quite busy and it’s about to be reframed to make it more accessible. We’re also going to go into more

本文前端(javascript)相关术语:javascript是什么意思 javascript下载 javascript权威指南 javascript基础教程 javascript 正则表达式 javascript设计模式 javascript高级程序设计 精通javascript javascript教程

主题: CSSJavaScriptJava
分页:12
转载请注明
本文标题:Foundation 6.3: Latest Updates and What’s Coming in 2017
本站链接:http://www.codesec.net/view/533142.html
分享请点击:


1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责;
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性,不作出任何保证或承若;
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
技术大类 技术大类 | 前端(javascript) | 评论(0) | 阅读(9)