Twitter Bootstrap

by Patrick on October 30, 2011

I found a really interesting thing for, well, bootstrapping web projects: Twitter’s Bootstrap. One problem I have every time I start a project is the styling. That basic stuff, like typography, margins here, paddings there. Things that don’t really add up to what the project is actually about. It feels felt like wasting time. With Bootstrap, you have everything you need right there. A big  bunch of CSS classes, from rather simple things like labels within the text flow up to a grid system and basic website layouts. It also implements LESS, a “dynamic stylesheet language”. I frankly haven’t looked into it yet, but it might be the right time now.

The only thing you need to do is download Bootstrap and use it as the base to start the project. Or, even simpler, just link their stylesheet in your <head/> (of course you won’t have the cool jQuery plugins that way).

The styles are like the ones you find at twitter.com, blue glow around focused text fields and the buttons look like the ones found at twitter. You may of course change these to fit the project, although I think it’s not really needed for small training or test projects.

They also offer some simple jQuery plugins such as modal windows, tabs, popovers or “twipsys”. I suggest you take a look at it, really useful stuff.

If you like the idea of having such bootstrap files, but Bootstrap takes it a little too far for your needs, check out the HTML5 Boilerplate. It offers a lot of cross-browser optimizations and implements a huge bunch of best practices for creating websites, but no default styles to the extend Bootstrap does.

I actually tried to combine both Bootstrap and the boilerplate, but I just began, so I have to see how it’ll work out.

Leave your comment

Required.

Required. Not published.

If you have one.