Menu icon Foundation
Use Zurb Foundation 4 / Twitter Bootstrap 3 For Non Mobile First Projects

Has anyone used Foundation 4 or Bootstrap 3 beta? As you know, both are re-written to make it mobile first.

I'm very excited with the mobile first approach, but in real life, sometimes circumstances don't let us do what we believe is the right way.

So I just want to ask, has anyone used F4 or BS3 for non mobile first (or even non responsive) projects? I haven't really dived into the codes and the documentation is quite lacking.

What I mean is, is there some hidden caveats in F4/BS3 that if I use one of them for non mobile first/responsive projects, somehow it's not gonna work as smoothly as both frameworks are meant to be mobile first frameworks? Or do you recommend using Foundation 3.5 or Bootstrap 2.3 for non mobile first projects?

Thanks, hope I'm being clear enough.

Mobile FirstFoundation 4Bootstrap

Has anyone used Foundation 4 or Bootstrap 3 beta? As you know, both are re-written to make it mobile first.

I'm very excited with the mobile first approach, but in real life, sometimes circumstances don't let us do what we believe is the right way.

So I just want to ask, has anyone used F4 or BS3 for non mobile first (or even non responsive) projects? I haven't really dived into the codes and the documentation is quite lacking.

What I mean is, is there some hidden caveats in F4/BS3 that if I use one of them for non mobile first/responsive projects, somehow it's not gonna work as smoothly as both frameworks are meant to be mobile first frameworks? Or do you recommend using Foundation 3.5 or Bootstrap 2.3 for non mobile first projects?

Thanks, hope I'm being clear enough.

Jeff Simpson about 6 years ago

My company has just recently switched to exclusive F4 use. We are not at all against Bootstrap, but here are the reasons we made our decision:

More semantic classes: this is of course a matter of opinion, but for us this can shave time off of a build.

A golden standard: You can hand F4 to just about anyone with html and css knowledge and you will see VERY similar markup for the same site from nearly all. This means it becomes much easier to contract out help if need be, and ensure quality design.

The UI: Yes Bootstrap wins this if you judge on it alone, but if you look at it as a whole really the UI of foundation is very close. Plus lets keep in mind that you can customize any of it with app.css

Zepto: I am a fan. What can I say. SEO is part of our world, and fast loads mean something, and even leaving SEO out....fast loads = less bounce.

SEO: Google has already come out and recommended responsive design for mobile SEO.

Why not?: What site can I not recreate with the framework. It is still CSS. It does force us to rethink how we code, but isn't that why we love to code in the first place? Figuring out solutions to simplify design?

Sorry for the novel. Just my take on it, and I know its not really 100% subject matter. In reality F4 vs Bootstrap 3 is really a moo point. If you are on-board with responsive you are making yourself marketable. If you are not then you are completely ignoring the direction that technology is heading and you should get out of the game.

Adam Clark about 6 years ago

Jeff,

You could technically not do mobile first by writing your own media queries based on a max-width instead of a min-width (with the default media queries use).

Also, you could also technically make a site non-responsive by overwriting your .row width. By default .row is set to a width of 100% and max-width that is generated from the $row-width variable. You could remove the max-width property and hard code a row width (e.g. 960px) to get rid of the responsiveness. However, you would probably run into some trial and error and hacking of the code in other places, as this is not an intended use of the framework.