If you’ve been hearing the words “Twitter Bootstrap” around the place and you’re wondering what new fandangled cobbling/social-media mashup the kids are up to, look no further. If you’re not a developer, this blog will help you understand what it is, and when it should/shouldn’t be used.. If you’re a developer, go read this thing.

First, a simple definition:

“Bootstrap is a free collection of tools for creating websites and web applications. It contains HTML and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions.”

Ok, now for an even simpler definition:

Bootstrap makes building (especially responsive) websites faster, by giving you lots of the
bits you’d usually have to create yourself (like buttons), prebuilt and ready to go.


In a nutshell, it was developed by Twitter as a way of maintaining their own design and code standards across lots of developers. They then released it as an open source project in 2011. Within six months, it was the most popular GitHub (open source code repository) project in the world.

However, it has very little to do with Twitter as we (users) know it.

In use

Developers seem divided over the framework- some love that they can speedily create layouts with flexible grids; others are frustrated by what’s known as “bloat”  or in other words, unnecessary code.

One common criticism is that sites created using the framework all look alike. Have a look at these sites and see what you think:




One of the best uses for Bootstrap is prototyping – quick, interactive website “pre-builds” that let developers and UX teams test their theories in a basic mode. Executing this prior to design means you can work out the kinks of layouts in a practical way, then get on with the build with fewer revisions at a later (and more costly!) stage.

It’s also great for jump-starting beginner developers or developers in teams without designers.

At Butterfly, we have been using the 960 Grid framework for the last few years. We are currently working on our own responsive template framework with elements pulled from Bootstrap.

As Joomla 2.5+ has Bootstrap inbuilt, more and more components are utilising the framework and we hope to capitalise on that with faster and more efficient responsive websites.

The above presents a mere snapshot of Bootstrap basics.. Is it something you would like to know more about? Let us know in the comments and maybe we’ll do a developer’s perspective blog.

Go back to Trends