COMPARISON OF BOOTSTRAP 3 Vs FOUNDATION 5

Bootstrap 3 and Foundation 5 are the most popular front end development frameworks currently used for desktop and mobile development web applications . We compared both the frameworks in terms of performance, flexibility, usage, community and features. 

1 . UI ELEMENTS :-

Foundation :

•  Foundation has limited number of UI elements. 
•  ZURB's intention with foundation was not to make all the web look the same with pre-designed UI elements.       

Bootstrap :

• Bootstrap has almost everything we can imagine.
• Bootstrap will give almost every UI elements we can think of.

2 . REMs Vs PIXELS :-

Foundation :

• Foundation uses REMs. Using REMs means we can just state font-size 80% and have the whole component shrink by 20%. 

Bootstrap :

• Bootstrap uses pixels . Using pixels means we  have to explicit declare a height, width, padding margin of a component on every target device and screen size we want to give it a different look using media queries.

3 . FLEXIBLE GRID Vs PRE-DEFINED GRIDS

Foundation :

• Foundation grid shrinks and stretches according to the current browser width.
• Layout will morph like a transformers while re-sizing the browser width.

Bootstrap :

• Bootstrap has a pre defined set of grid sizes for main devices and screens.
• It will change its grid like a transformer while we resize browser width.

4 . MOBILE FIRST Vs MOBILE ALSO :-

Foundation :

• Foundation was designed for any four corners screens.
• Building sites for mobile first means it will always be usable on bigger screens. Foundation encourages to start this way. 

Bootstrap :

• Bootstrap was designed for mobile, tablet, desktop and large desktops.
• Responsiveness was added as s feature in latter versions. Here we can get some special media queries for different screen sizes but main target is the desktop.

5 . COMMUNITY :-

Foundation :

• Foundation has very smaller community support.

Bootstrap :

• Bootstrap has the larger community support. It is huge and everywhere we look around we will find a gem or component built for bootstrap.

6 . BROWSER SUPPORT :-

Foundation :

• Desktop : Chrome, Firefox, Safari, IE 9+ 
• Mobile : IOS (iphone,ipad) , Android 2, 4 (Phone, Tablet ), Windows phone 7+, Surface 

Bootstrap :

• Chrome ( Mac, Windows, IOS, Android ) 
• Safari ( Mac, IOS )
• Firefox (Mac, Windows )
• Opera (Mac, Windows)
• IE 8+

7 . VERSION:-

Foundation  : v5 (latest)

Bootstrap     : 3.1.0 (latest)

8 . CREATOR :

Foundation   : Zurb 

Bootstrap      : Twitter 

9 . License :

Foundation   : MIT License 

Bootstrap      : Apache License v2.0

10 . LATEST RELEASED :

Foundation   : November 21, 2013 

Bootstrap      : December 5, 2013 

CONCLUSION :

• Bootstrap was a great to bootstrap a site quickly with lots of accessible defaults. It was a quick to get started but took some work to alter.
• Foundation seems to provide a great foundation on which to create more customized sites. It's more flexible but needs more upfront thought. 

We can choose the framework depends on two situations,

1 . Do you Plan your CSS carefully and have the least you need to use as the base to your project ?

Ans : Choose Foundation 

2 . Do you need something easy to use and ready to make your web app ?

Ans : Choose Bootstrap