ZURB Foundation is the first front-end framework aimed at creating fully responsive web applications. It was the first to introduce the concepts of responsive design, semantics, mobile first and partials. ZURB is focused on fast developing mobile devices, so they gathered their own widely used global CSS, jQuery plugins, common elements and best practices into one framework. Foundation was first released in 2011 and till now it is one of the fastest and most advanced responsive front-end frameworks available.
Foundation allows developing mobile friendly and highly customizable websites and web applications. What is the most important - this collection of tools is completely free and includes HTML and CSS-based layout constructs (like a fully responsive grid), design templates for typography, forms, navigation, buttons, other interface components, and even optional JavaScript extensions. You can quickly dive in and start prototyping and building products that will work on any device.
ZURB Foundation recommends a mobile first approach. It is not obligatory, but it will simplify development of a website or an app if you start with design for the small device first. After that you can continue with larger displays and more full-featured devices. Such approach is quite effective and introduces practicable constraints in product design.
This framework is modular at its core. It uses reliable technologies such as jQuery, HTML5 Boilerplate, Sass and Normalizr. It is additionally supplied with a set of components and plugins that are compatible with most browsers and devices. Moreover, Foundation can work with virtually any back-end or server technology. It has been used with dozens of back-end and CMS from Plone and Drupal to Wordpress and .Net.
ZURB decided to apply a very robust CSS preprocessor Sass as the building material of Foundation. Series of Sass stylesheets implement various functionality of the framework. Sass brings in semantic code, faster styling, and a lot of other helpful programmatic features. Foundation can be easily restyled: either by including component stylesheets via Sass or customizing the toolkit on download.
Foundation provides you with tools to code smarter and faster. First of all, every part of the framework from the underlying code to plugins was built to function as quickly as possible. Secondly, it can be used with completely semantic markup. Code can be maintained clean without sacrificing any utility or speed. Foundation encourages rapid prototyping so that testing can be started swiftly.
Foundation includes:
- powerful and flexible grid that will work with any resolutions and types of devices: mobile phones, portrait and landscape format, tablets and PCs. Foundation created thirteen layouts that you can use right out-of-the-box. Otherwise you can build tons of layouts using standard grid. It adjusts width of the columns automatically, supports offsets, nesting, source ordering, and device presentation.
- versatile form layout system that can be easily built using the grid (rows and columns) with form styles and components available.
- re-usable elements such as buttons, labels, navigation, tabs, drop-downs, advanced typographic capabilities, icon fonts, social icons, tables, formatting for messages like warnings, search bars, pre-designed templates, and custom code snippets.
- JavaScript plugins that extend existing or provide additional user-interface elements, including section, dropdown, tooltips, topbar, forms, placeholders alerts, and much more.
Foundation is a cutting-edge framework widely applied to deliver robust responsive websites and apps. It comes with a library of tested components and is compatible with most browsers and devices. Visit foundation.zurb.com for more information or download this toolkit and start developing right away.