Recently, I’ve seen a lot of discussion in the WordPress community about Fränk Klein’s article, Why Bootstrap is a bad fit for WordPress Themes and I’d like to take a moment to explain why I disagree.
I use Bootstrap for all of my custom WordPress themes because it makes me more efficient. This is the same reason I use the StudioPress Genesis Framework and jQuery. To take it to an extreme, it is the same reason I use WordPress rather than rolling my own CMS. All of these resources allow me to leverage the expertise and experience of other developers, which in turn makes me more effective.
I use Bootstrap for all of my custom WordPress themes because it makes me more efficient.
I look at the cost/benefit ratio. Though the cost can take many forms, including less control and an increase in complexity, file size, and load time, the benefits far outweigh them. Fränk Klein and I simply disagree about the ratio of cost vs. benefit for Bootstrap.
What I Like About Bootstrap
Once I’ve applied Bootstrap, I have a workable set of CSS styling rules and responsive behavior. I have classes available for styling buttons. I have a basic nav that works across a variety of screen sizes and devices. I have heading, paragraph, list, and blockquote styles that relate nicely. I have my starting point, which I can then modify. Often these modifications can be made through Bootstrap’s Sass variables, which allow me to cleanly modify the CSS without increasing the size of the final CSS file.
Arguments Made Against Bootstrap
Bootstrap is the wrong tool for the job
“[Bootstrap] was created so that developers could focus on back-end code and quickly iterate without having to worry about the front-end”
WordPress was originally a blogging platform, not a CMS or platform for web applications. But often, as is the case with WordPress, we find new uses for items that surpass their original use. This is one of the benefits of technological evolution.
Bootstrap does not do things the WordPress Way
If I’m reading this correctly, I think the idea here is a preference for semantic class names (.copyright, .intro) and markup rather than Bootstrap’s use of presentational class names (.row, .span8). There was a time when I was a fierce proponent of using semantic class names but experience has made me more pragmatic. Frameworks and their presentational classes allow me to work more efficiently and maintain cleaner code, which makes me more valuable to my clients.
The related criticism here seems to be that
wp_nav_menu() requires a custom walker to generate Bootstrap markup. In my experience, a custom walker can be more cost- and time-effective than writing custom CSS and JS for a navigation. On a personal note, for a nav of any serious complexity I use the Ubermenu plugin.
Bootstrap is bloated
Bootstrap does hold a lot of functionality and lines of code, but using the Sass version of Bootstrap has the benefit of allowing you to eliminate unnecessary sections and reduce your file size. Even with all the CSS included, I’d argue the benefit of using Bootstrap outweighs the 130 KB of CSS.
Bootstrap does not encourage great design
I am not a designer, I’m a developer, so I can only speak peripherally on this point. However, the designers I’ve worked with have done an amazing job adapting to Bootstrap and to responsive web design in general. I’ve been so impressed, in fact, that I gave at talk about it at WordCamp Philly 2014 called How to Be a Designer that Developers Love (slides).
I’ve worked on projects where we modified Bootstrap 3 to use an 8 column grid rather than 12, using a Sass variable. Additionally, I’ve worked with designers who break components of the site out of the grid system entirely and, in these cases, I’ve leveraged custom CSS to accommodate their design. This is an example where the cost of additional development time must be weighed against the benefit of the modified display.
Bootstrap Genesis Starter Theme
Bootstrap may not be the right fit for your theme but that doesn’t make it a bad fit for WordPress. I love Bootstrap and WordPress and I love them together. I love them so much I created and maintain the Bootstrap Genesis starter theme, which is running on this blog unmodified. This is the starting point I use for all of my custom WordPress site development. Feel free to fork it on GitHub.
Bootstrap may not be the right fit for your theme but that doesn’t make it a bad fit for WordPress.
Why I Use the Genesis Framework
If you’re interested in why I use the Genesis framework, you can read about it in my post Why Use the Genesis Framework.
Bootstrap vs WordPress
I’m seeing a lot of people specifically ask the question, “Bootstrap vs WordPress”? I’ve shared my thoughts in my post Bootstrap vs WordPress.