Comparing Foundation to Bootstrap
As far as I know, most web designers / developers are using Bootstrap as front-end framework in their projects. But today I wanna talk about another framework: Foundation .
What's the other guys talking about this
However Felippe Nardi has a very well post Top 5 Core Differences Between Bootstrap 3 and Foundation 5 about this topic, and summarized his opinion as below:
ZURB and Twitter made their objectives and intentions very clear when naming each CSS Frameworks: Bootstrap tries to give you everything you’ll ever need to bootstrap your project. Foundation just gives you the foundation to build upon.
Strongly recommend you to read.
The components
Foundation is more light weight comparing to Bootstrap, so it provides less complements built in - but doesn't mean that Foundation comes with no component.
Check out Foundation's documentation here and you'll see, hmm, lot of "things". Bootstrap has a well-organized doc set than Foundation does.
Anyway, basically you can find most components you'll use in common web projects - the grid system, buttons, forms, navigations and other add-on javascripts, in its own way.
Again, Bootstrap tires to provide you everything (and more options) you may need in web development, while Foundation only provides the necessary parts.
I think it is good to me because, with the basis by Foundation I use the framework only for architecture but leave the details to alternative, better choices. Not everything should be bootstyle.
Since make your own customized components cost more time, it is just a balance between full-stacks and flexibilities. You're the boss.
REM vs. Pixel
To honest I have never use REM in my projects before. But now I'm thinking about how to use REM in future projects and what's side effects (maybe, but who knows?).
By REM you're granted the ability to "scale" your website including the components as you want and easy to go. With SASS it is just a line to change. Although you can do the same in pixels by defining a variable and then make the components using metrics calculated from the variable.
Save it and just try a shoot with REM.
The only problem is that REM is supported by modern browsers. I'm okay with that.
Why I prefer to Foundation
I use Bootstrap in past projects but I believe I'll seriously consider to using Foundation if possible. My reasons? Foundations let you
- write cleaner Semantical HTML
- mobile first
be different
Personally I really enjoy playing with new stuffs like this one. And during this you may find out something really useful and helpful to yourself. Keep learning is not bad, right?
Dig deeper through a real rails application
In order to have a much clear image of the differences between Foundation and Bootstrap, I decide to spend some time to dig deeper. It takes me about a day to switch an existing project from Bootstrap to Foundation 5, through Ruby on Rails 4.
- It won't take you a long time if you know well about the design principle behind "grid system". Both of these two are based on a 12-columns pattern.
Of course it depends on how many pages you have in your project. - Foundation as another front-end framework, there's also a gem called foundation-rails, by which you could build your very own stylings using SASS.
- Also simple_form provides support to foundation but need some more tweaks. I haven't pay my time on this part yet so I just using the native form builder in this project.
Since both Bootstrap & Foundation a front-end framework, there's not much thing to do with Rails the server side.
By the way, fortunately simple_form supports both of them by providing flexible form builder wrapper. If you're using simple_form's form builder in your Rails application it would save you some time.
Which one should you take
As coins have two sides, Bootstrap have more related documents / libraries, more support which Foundation is not. Secondary you really should discuss with your teammates if they want to play with a new toy.
- If you're facing serious business, need more support and components, take Bootstrap
- Or if you'd like to build your very own website, enjoy reinventing things, take Foundation
