This article compares the pros of cons of using Twitter Bootstrap for front end design and development.
Twitter Bootstrap is a front-end framework that can speed up development times. It is loved by some and hated by others. This article takes a look inside the debate so you can decide whether or not to use Bootstrap on your next project.
The Arguments For Twitter Bootstrap
- speeds up development
- includes ready made design patterns
- unifies naming conventions among teams
- allows for rapid prototyping
- contains a grid system.
The Arguments Against Twitter Bootstrap
- all sites look the same
- ignores design and is too prescriptive
- hard to customize into an original design
- only good for startups that can’t afford a designer.
Who is Bootstrap For?
The Official Bootstrap Tagline reads: “Sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.”
“Sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.”
The important thing here is “web development.” Twitter Bootstrap seems to be favored much more heavily by web developers than web designers.
To illustrate this point, an article was published titled “Please Stop Using Twitter Bootstrap.” The article was very anti-bootstrap:
When you start to see the same layout over, and over, and over again users begin to tune out. You’ve lost me. Your design looks like one of 6,000 other sites out there. And not just the same general layout, but the exact same components.
This article got very mixed reviews. On Designer News, designers saw value in Bootstrap if a company could not afford a custom design. Overall the sentiment was that you could do a lot worse than the design offered by Bootstrap, but that these sites generally all ended up looking pretty generic.
The problem here is that before Bootstrap, the only way for a non-designer to get something decent was to hire a designer. Now thanks to Bootstrap there’s a whole new middle-ground of gets-the-job-done design that doesn’t suck but is also very, very generic. – Sacha G., Creator at Sidebar
On Hacker News, a site geared more towards developers, there were differing opinions:
Sorry, but F design. Wikipedia, Google search, HN, Craigslist – they’re essential – they are real value – and they’re not winning any design contests. – DPWeb on Hacker News
And a less extreme opinion:
As a designer, would you rather take spaghetti html code from a developer or one compliant already with a framework like bootstrap to start working off? – Mattvv on Hacker News
There’s an easy answer.
The easy answer is that Twitter Bootstrap is not meant to be a design solution. It’s a development solution.
When designing a site, you need to make thousands of micro adjustments to get fonts, typographic hierarchy, layout tweaks, image sizing, color, contrast, texture and other design elements to work in harmony.
Design is an iterative process and the tools need to allow rapid creative freedom for many quick decisions.
From my experience, Bootstrap is not a good framework for this purpose. The components are already too styled. The canvas isn’t blank enough. I often need to go find elements that need to be overwritten.
Rather than designing, I start to feel like I’m debugging. While I eventually find the selector I need, I’m already slowed down. And the first solution is rarely the right one in design so every iteration becomes a slower process
Rather than designing, I start to feel like I’m debugging.
While Bootstrap doesn’t’ work for me from a design perspective, I can’t deny the benefits and power many feel from using Bootstrap as a front-end-framework. I think the simple answer is to use the right tool for the job.
Designing in the Browser has more friction than designing in Photoshop. Therefore, designing in the browser requires an extremely lightweight solution so that rapid decisions can be made without having to plow through selectors.
A designer should use whatever tools allow for fast rapid iteration. If a designer is designing in HTML/CSS, it makes sense to have as frictionless and minimal a development setup as possible so that the design process is fast.
A designer should use whatever tools allow for fast rapid iteration
Then a developer (even if it’s the same person) can bust out their particular power tools and frameworks to turn design information (whether that’s a psd and/or an HTML/CSS prototype) into a fully functioning website. It is at this point, where Bootstrap may be the best tool for the job depending on the developer’s workflow patterns.
So in summary Bootstrap sucks, and it’s awesome. Depends who you ask. Use the right tools for the job and encourage others to do the same. This will lead to sites that are designed and developed with the best possible solutions.
Do you use Bootstrap? Do you love it or hate it or fall somewhere in between? I’d love to hear about your experiences in the comments.