Foundation 5 was released a few days back. It is a fully responsive framework for front-end developers. The Foundation framework is made by Zurb and it was first released in 2011. Foundation 5 claims to be “The most advanced responsive front-end framework in the world”, used by millions of developers and sites including National Geographic, Mozilla, The Washington Post and others. Foundation was considered the first fully responsive framework when it was released in 2011.
Foundation 4 was released about nine months ago and now Zurb has released the latest version 5 with many new features and improvements. Foundation 5 is the fastest and best build yet. It is packed with features to help you code and learn faster than ever before. So says the Foundation team.
Foundation is a fully responsive framework, which helps developers and designers to create fully responsive and beautiful websites with Semantic code. Foundation uses a mobile first approach, so you can design sites that will not only work well on small devices but also on large screens.
What’s new in Foundation 5
The latest version is faster for users, faster to code and faster to learn. Foundation’s interchange plug-in allows you present different content, when the screen size reaches to a certain point. For example you can present large image file on desktop and small optimized image on small devices. Foundation 5 offers some new features for its millions of users. Let’s have a look at some new features.
New Documentation, Forum and Foundation Business
Foundation is also faster to learn with new documentation, detailed code examples, new start-up guide and a new discussion forum. You can quickly learn how to get started with Foundation 5 and how it works.
Getting Started Guide
Getting started With Foundation 5 is easy. The Foundation teams has created entirely new sections with new and more detailed code examples. They have also written a new “Getting Started” Guide, to help you learn all about Foundation 5. You can also try Foundation in the browser at Codepen. If you are coming from Foundation 4, you can visit the Foundation Migration Guide.
New Official Foundation Forum
You can now also visit the new official Foundation Forum dedicated to questions, answers and dialog with the design community.
If you are an enterprise user, you can now rely on Foundation Business, where you will get professional support, consulting, tools and training for all your company projects. Individual and Business plans are available for premium support.
Full Support For Medium Grid
By popular request, Foundation 5 now includes Medium Grid. It was an experimental feature of Foundation 4.3. So, now you have a Large, Medium and Small Grid to use.
New starter templates
With shiny new starter templates, you can jump start your next Foundation 5 project in seconds. The Foundation team has created 13 layouts for you to start from and build on. It is very simple and easy to use these simple HTML templates, just grab the code and drop it between the
<body> tags of a Foundation page. Starter templates are available for Blog, Feed, Banner Home, Contact, Marketing, and Store. You can learn more at How to Use Foundation Templates.
Interchange in Foundation uses media queries to dynamically load responsive content appropriate to different devices. Now you can use Interchange to pull in HTML partials, meaning you can load entirely different sections, content (images, CSS and other content) of your web page for small, medium and large devices. You can use this feature to load mobile friendly content on small devices and large components on desktops.
Faster with jQuery 2, fast-click.js, GPU Acceleration and more …
Goodbye Zepto, hello jQuery 2
Foundation 5 uses many features to make it faster. Foundation switched to Zepto (with a jQuery option) for its smaller file size and faster load time but Zepto had some performance issues. So now Foundation 5 uses jQuery 2.
Fast Click for Mobile users
With the integration of fastclick.js in Foundation 5 mobile users will have a snappier experience. FastClick is used for eliminating the 300ms delay between a physical tap and the firing of a click event on mobile browsers. The aim of fast-click.js is to make your application feel less laggy and more responsive while avoiding any interference with your current logic.
Learn PHP for free!
Make the leap into server-side programming with a comprehensive cover of PHP & MySQL.
RRP $11.95 Yours absolutely free
Improved GPU Acceleration
With GPU Acceleration, Animation will perform significantly better and sleeker in Foundation 5. The Off Canvas feature provides a powerful way to build navigation into screens. You can position Off Canvas menus outside of the viewport and slide them in when activated.
More Powerful Forms
Forms have also been improved in Foundation 5. Foundation features an easy to use, powerful and versatile form layout system. A combination of form styles and the Foundation grid means you can do almost anything.
New command line Tool, Bower and LibSass
Foundation team has written their own CLI wrappers so you can quickly spin up new projects. Just use ‘foundation new project-name’ and off you go.
New projects will now use Libsass, a back-end Sass compiling library that will dramatically speed up how long it takes for your SCSS changes to load. Libsass is used to run the code locally (i.e. to compile your stylesheets).
Foundation has started to use Bower, the popular upgrade manager, to make Foundation upgrades more efficient and easier to carry out. Bower is a popular package manager, which solves the problem of front-end package management.
ZURB Foundation 5 Sublime Text Snippets
SublimeText, a very popular editor and a favorite of developers now has some sweet Foundation shortcuts you can use to write crazy fast code. You can read more about Foundation 5 Sublime Text Snippets at official github page https://github.com/zurb/foundation-5-sublime-snippets
Download Foundation 5
Download Foundation 5, give it a try and let us know how you found it.
Jump Start Git, 2nd Edition
Visual Studio Code: End-to-End Editing and Debugging Tools for Web Developers