Twitter Bootstrap

Twitter BootstrapHere in the College web team we have been experimenting recently with building websites using the Twitter Bootstrap toolkit.

Bootstrap offers a very lightweight set of tools (it’s perhaps overkill to call it a ‘framework’) to set up a functional website in a very short space of time, that does everything that you might expect a modern website to do. With it, a website can be created very quickly that offers ‘out-of-the-box’ modern browser-based client-side technologies such as JavaScript jQuery interface components (e.g. navigation toolbars, tabbed or drop-down menus), and conforms to modern web development guidelines and standards such as the use of valid HTML (and HTML 5), CSS, accessibility, SEO and cross-browser support.

In particular, Bootstrap v3.0 offers the ability to easily build a Responsive Web Design (RWD) website so that the same codebase can be used for multiple browser/hardware client platforms of all sizes, including tablets and smartphones, without too much effort.

We’ve also been experimenting with using Bootswatch to theme (fonts, layout, formatting and colours) the default interface template offered by Bootstrap, and using the Drupal v7 Bootstrap module to integrate the functionality of Bootstrap into a Drupal v7 theme. The combination of the server-side PHP/MySQL Drupal Content Management System and the client-side jQuery/CSS Bootstrap toolkit is a very powerful one that allows a relatively sophisticated website to be built very quickly.

Bootstrap fits in very well with a Rapid Application Development (RAD) methodology or even an Agile development methodology. It’s perfect for building functional web prototypes or basic small-scale operational websites, but perhaps its limitations should be recognised – like a lot of WordPress-based websites there is a danger that without some customisation, the website interface can be too much like any other Bootstrap-based website and becomes a boring ‘vanilla’ website. It’s also not really an option if a website is designed to conform to a demanding specification, such as an interface that will feature some groundbreaking functionality or attractive and unique design that perhaps will be used for branding and marketing an organisation or idea.

What is does do though is allow a web developer more time to concentrate on the advanced requirements of developing a website on the server-side without having to worry too much about building a ‘quality’ website on the client-side from scratch for every single project, to gather valuable user feedback at an early stage of development, and it offers a scalable platform for future development and customisation.

1 thought on “Twitter Bootstrap

  1. I should have added that using Bootstrap 3 to build a website herds you into a ‘flat-design’ client interface – and while this looks good, and fits in with modern interface design approaches (that follow RWD guidelines), it’s still a fashion trend, and it’s a trend that will almost certainly be replaced with something else eventually. If website design fashion moves into more ‘skeuomorphic’ interface metaphors (or perhaps something else), then a Bootstrap 3 website will be left behind and risks looking stale – unless perhaps new versions of Bootstrap keep up with fashion…

Leave a Reply

Your email address will not be published. Required fields are marked *