Bootstrap 3 RC1

Careful now. If your user base is "normal" people it might be substantially more than that.

One site I run is a local news site (East Coast, USA) that does a fair amount of traffic (~10M pages, ~500k visitors monthly), and IE8 is still hovering around 13% for us, with IE7 at just over 2%. In fact, IE8 > IE9, by a fair margin. The good news is that IE share overall is down substantially.

Jul 2010: 74% Jul 2011: 65% Jul 2012: 58% Jul 2013: 34%

that was my initial thought earlier this month as well and went on preparing to get rid of IE7 support for our specialised cms' backend. until i found out that some of our best-paying corporate customers are still using IE7.

our lesson learned: it's not the quantity that is important here, but rather who is still (stuck) using older browsers - "don't bite the hand that feeds you".

He said he got this list from the site.

While it might not be much "hassle" in terms of adding some code, the part I appreciate most about bootstrap is that it's put together by competent designers and looks good as a whole. Once I start f'ing around with individual bits and pieces, my guess is that things are going to go to hell in a handbasket in short order, which sort of defeats the purpose of the whole thing in the first place.

Also, my guess is that the flat base is there because that's what's cool these days. Which isn't necessarily a bad thing: for a lot of people, having something that looks modern and recent is pretty important too. Just that I'm worried about it, a little bit.

One of the advantages of having very non-technical customers, is that they could not care less that "OMG, it's stock bootstrap!". They just like that the site looks decent, and it certainly looks better than if I did everything myself.

Having a good enough default means I can spend my time improving the product, rather than worrying about something that neither the customers nor I care much about as long as it's good enough. And stock bootstrap very much is - that's one of the things I love so much about it.

With the flat design stuff, now I'll have to think about it, look for different solutions like themes, or maybe just going for it and hoping it's not a problem, and generally spend time not making our ebook conversions better.

Ultimately, it's not that big a deal, and I'm still way better off than without bootstrap, but I do consider it somewhat of a regression.

I think that buttons with some kind of bevel/emboss - ones that resemble the ones people have seen on computers for the past 20 or so years, and in the physical world for 100+ - are going to be more recognizable. Flat UI means a smaller visual vocabulary (usually, and maybe not the best chhoice of word but hopefully you know what I'm trying to get at), but it also means fewer clues for users. Once they've figured out the answer to "what is a button?" they're left with something free of visual noise that is mostly only useful while learning.

(Anecdotally) For someone non technical, change is usually bad when it comes to interfaces. I think that simple and "easy to understand" is a great direction and have tried using flat and "ios7 color&font weight differentiated buttons" in some recent projects. I have seen teething issues when moving towards UIs where the visual definition of a button does not include some "quasi-3d" aspect. Simply differentiating by text or background color makes a lot of users apprehensive about touching things, afraid they will produce an unexpected or unwanted result. I've seen them adapt rather quickly, but there has always been some 'what do I press?' stage. Not exactly test data, but the results have been pretty consistent.

EDIT: I should note that usually adding a stroke to just the bottom edge of a clickable button or a slight shadow/gradient usually helps. You can see this style in a lot of recent google products and I think it works really well (and I bet they tested it before deploying!). This method allows you to remove or tone down the shadows/gradients/textures from your navbars and other items without having them feel disconnected from your buttons.

That's an opinion, not a fact. If I see a colored rectangle that's offset from the text with a label that indicates action[1], I immediately think its a button. I'm willing to wager a non-trivial amount of consumers do so as well, but this is what things like context and split testing are for.

[1] The trickiness with flat design is when buttons for action are also used as information display. One of the biggest issues with the first iteration of Metro was that you'd have a box that shows your current number of emails -- and you didn't know if that was just a part of your dashboard or also a link to your email that had a nice preview. That's not a failing of flat design, that's a failing of design.

Sort of reminds me of people saying colored text without underlines aren't links

Clearly, I can't speak to BS3, but the thing I like most about Foundation is the mobile-first grid: build your grid layout using Foundation's 'small-n' classes and it just works on larger screens too. If you want to develop more complex layouts for larger screens, all you have to do is append 'large-n' class names (and now 'medium-n' exists, too).

Why do people think Zurb's grid system is better? I don't remember it being any different from Bootstrap's grid system.

Responsive tables is a big plus for Zurb.

bootstrap 3's grid system now uses percents instead of fixed pixels. also col-lg or col-sm classes can be used to design/show different content on different resolutions. my vote is on bootstrap.

Actually, in SASS, border-radius is done with the syntax `+border-radius(5px)`. You're thinking of SCSS, which is much more verbose but has more similar syntax to CSS.

there is such a thing as plain border-radius: 5px, you know?

I think mixin's are generally overused; having to maintain css as well as right it, I'm quite happy with a syntax that doesn't encourage their use. If you need em: fine, but the you won't care about @include vs. "." anyhow.

Also buggy on Opera 12 in Linux.

Hey mdo, big thanks for all your work! I've used Bootstrap in one project and will use it in many more.

It's a huge productivity boon and the documentation does a great job of showing you what to do.

Thanks, I started the change from 2 > 3 today and it hasn't been too painful. The main things were changing to the new grid system and searching the docs for some classes that had been renamed

You could already do that with 2.x too. I did this with a site that I built using bootstrap 2.3. No one knows that site is bootstrap until I tell them we used it. We made our own bootstrap.less file that only pulled in the .less for the modules we needed, so we could minimize the bloat.

Also, bootstrap uses normalize now, not reset. This poster should make a little more effort to understand before criticizing. It's obviously a useful framework as many find it very useful. Coding and html css for a complex is not something a developer wants to do unless they have very, very good expertise in front end development. I think bootstrap is great for developers who aren't front end experts, but aren't necessarily bad developers. Maybe specializing in back end work, database, web server side stuff. Using bootstrap frees you up to focus on things that matter more for your app, and you don't have to worry about typography, typeahead, grid systems, etc. It's one of many options that satisfy this need, such as Zurb's Foundation.

You forgot the option of "no framework, I'll build it myself and have ultimate control".

It's not rocket science, it's HTML and CSS, and you don't need a framework to have uniformity or responsiveness.

Your site could be made up of a bunch of jquery plugins too, and stock library graphics, and is your content rehashed too?

div class=span4 is nothing more than a table-based layout in disguise. Spans and rows are not inherent to divs. You're adding a layer of new rules that doesn't complement the technology you're adding to. You may as well be building with an old fashioned table based layout.

When I view source of some of the flagship bootstrap examples, I see stuff like this... empty divs either side of the logo graphic. I remember doing stuff like this with tables back in the 90s. Spacer gifs inside the empty table cells. But in this case, it's a class.

<div class=span4></div> <div class=span4>logo</div> <div class=span4></div>