Foundation, html5 and css3 framework

Nowadays it is possible to use the Internet from every part of the world. The manufacturers of mobile devices are in a constant race when it comes to the development of new models. Web developers need their product to be visualized properly, regardless of the device or the browser. Instead of wasting a lot of time and money and wrecking your nerves on the development of a mobile version of your website, you can use “Foundation 2.2”.

Foundation 2.2” is an impressive CSS3 / HTML5 Framework. It was created by the developers of the company for interactive design and strategies, “ZURB”, situated in Campbell, California. The Foundation project is the result of 10 years‘ experience in the development of web-based applications and services. It is a rock-solid, responsive framework for rapid prototyping and iterating into production code compatible with various platforms and if you have to make the website equally accessible from a smartphone, a tablet and a computer, you will need one framework only.

In this framework the different styles are connected with clearly defined classes. You can easily find your way in the code. Pre made styles for elements of the user interface are all included in “Foundation”. Styles vary providing message pop-ups, labels, the so called tooltips, bubbles, tabs, panels and of course, the well-known tables in which the colors follow automatically. You’ll be surprised to find that the tabs and the horizontal and vertical navigations are really quite handy. They function as drop down menus and what is characteristic of Foundation is that the horizontal menu turns into a vertical one when the size of the window is reduced and vice versa.
foundation buttons

Message boxes can be inserted anywhere if it is necessary to warn users, inform them about an error or any other event. The „x“ at the right top of the box enables us to get rid of the message right away. You can use labels to add meta data or simply a common message. You can also outline something important. The bubbles in html cannot be stylized but they are actually a quick way to show users additional information . In “Foundation” they are activated by adding a jQuery script. They are compatible with various platforms and browsers and can be positioned above, below the element, or on the right/left of the element they are responsible for and take its width by default. The panels are used for content pads and delineate different sections of the page. The tabs look like a menu of their own kind and allow for showing different content of a particular page without reloading it. We can see „breadcrumbs“ and micro formats adjusted for events of definite time and place as well as contact information. The developers have provided us with two variants of some elements: simple and attractive ones, respectively.

tablet Grid
We can mention three important things, which make Foundation stand out: The flexible 12 columns grid allows fast-paced creation of complex formations.

Easy hiding options for the site elements depending on what type of device you’re using – Mobile, Tablet, Desktop or TV. Some plugins like Orbit and Reveal can help us create model dialog windows and slides containing images or even galleries. Not a while ago, an enthusiastic fan created a theme for WordPress that was built with Foundation’s framework. The license agreement with the user is under MIT’s license, which allows him to reuse within proprietary software provided all copies of the licensed software include a copy of the MIT License terms.

responsive design | cholakov it
You might ask – “How does all look in the popular browsers?” “Foundation” visualizes nicely under IE 7+, Firefox, Safari, Chrome and the mobile versions of Mobile Webkit (iOS 5) and Android Browser, obviously ZURB really cares about the feedback from the users. They’ve gone the extra mile so we can freely contact them and tell them what we think about the framework, a great way to lure in more followers.

On Zurb’s Foundation site ( you can find a neat documentation and an option to download “Foundation’s” latest version (2.1.5 released 17.02.2012). They are published with sites that were built with the framework.

Leave a Reply

Your email address will not be published. Required fields are marked *