Front-end Development · User Experience Design

Twitter bootstrap vs. Zurb foundation?

Scott Cox Airlines/Aviation Professional

February 26th, 2015

Interested to hear what fellow entrepreneurs and engineers (and designers) think about curb foundation vs. twitter bootstrap frameworks. What have you liked or non liked about each, especially if you used both for responsive site.
Every business needs an eye-catching website, and building one shouldn’t be expensive or time-intensive. Learn how to set up a Wordpress site, pick a stunning theme, add a blog and newsletter, sell products, and monitor analytics — in just one hour.

Valerie Lanard Senior Software Engineering Manager at Salesforce

February 26th, 2015

I am a long-time Bootstrap user - considered switching to Zurb at one point but it didn't seem to warrant overhauling my entire front-end, so I cannot directly contrast the two but can share my experience. Both are quite excellent as a responsive basis for a site, and both have limitations since they are generalized and not custom-built for your site & taste.

Very happy with Bootstrap overall, particularly since I stopped using the defaults and started customizing the built-in padding/margins in the less/scss files.  Bootstrap is very intuitive for developers, and most of the time it just works. Gives a lot of peace of mind in terms of releasing code that you haven't personally tested across every device. 

Downsides: limited number of custom widgets, and there's a tendency as a developer to expect it to handle everything. It just doesn't. For instance, the carousel plugin is great for images, but lacks support for complex embedded html/images per slide. Autocomplete was removed a while back and requires an external library. Tooltips are pretty basic, so I have resorted to a external plugin for rich html tooltips. I also use font-awesome for additional external glyphs. Horizontal navbars are a bit peskier to customize than I wish they were. You get the idea. Modals, forms, styles, and base classes are great. Complex grid layouts work really well across devices 95% of the time (except when you want custom nested designs that try to cram a lot into a very small space).  I expect that Zurb has roughly the same amount of benefits and tradeoffs, though the widgets in question will vary.

Based on my extensive web experience, you will be in great hands with either one of these, and they will get you pretty far right out of the box. You will never achieve pixel-perfection when implementing mocks using a standard library, because responsive code by nature requires compromise and auto-scaling, in contradiction to exact specifications. I tried unsuccessfully to get my designer to speak Bootstrap - it was a big time drain. Designers seek visual perfection as they should, but once you start customizing the css manually to override the framework classes, you quickly cause a cascade of broken responsiveness. You need to limit the scope of manual overrides because there's a lot of time & work required to test every edge case & screen size.  In the long run, generalizing the code makes it much more maintainable. And for the most important cases only, you can manually tweak the css that overrides base responsive layouts. 

Jake Carlson Software Development Manager at Oracle

February 26th, 2015

I've used both and prefer Foundation. I prefer SASS and Zurb prefers it. There are SASS ports of Bootstrap but it isn't default last I checked. 

Robb Miller founder at gnito

February 26th, 2015

Good Question! I have used them both for responsive sites, and am generally pleased with both. Lately I have been using Foundation, and love it, but am generally agnostic. I find that many o-deskers etc. and other contractors are more familiar with bootstrap, and it has more good templates available (wordpress and otherwise). Hope this helps, and know that it points in both directions ;)

Alan Peters VP Product and Technology at BusinessBlocks

February 26th, 2015

They are what they are. For a final, customer-facing product - I don't like either. For an internal product (like an admin interface) or a prototype to prove viability - both provide good value. I tend to prefer bootstrap but I can't say they are all that different at the end of the day.

James Stone Design Systems Engineer – ZURB Foundation Certified

February 11th, 2016

I know this is an older thread, but I posted some of my thoughts comparing and contrasting the two frameworks (biased a bit towards ZURB Foundation) that might be of interest to anyone trying to decide between the two.

https://www.youtube.com/watch?v=LyszBoO_r7Y