What is the value of HTML5 Boilerplate for a Rails application?

There are several application templates (and a Rails gem) that add HTML5 Boilerplate to a Rails application. So I investigated and put together an analysis of HTML5 Boilerplate for Rails. It seems HTML5 Boilerplate doesn't add much that isn't already there in a new Rails app. What's useful:

sample humans.txt file

example index.html file for a default application layout

viewport metatag

Google Analytics snippet

There's some CSS help like CSS normalization, placeholder CSS Media Queries, and CSS helper classes but it seems you'd get all of them and more with a CSS toolkit such as Skeleton, Twitter Bootstrap or Zurb Foundation.

Finally, HTML5 Boilerplate has lots of components for websites that need to support IE6, 7, and 8 such as IE conditional comments, Modernizr, and Chrome Frame. But if I'm not supporting IE6 and I'm using Twitter Bootstrap or Zurb Foundation I don't think I need these.

HTML5 Boilerplate is a good project that has lots of community input. There's a lot of good advice on its website. But for a Rails project?

Am I missing something? What is the value of HTML5 Boilerplate for a Rails application?

HTML5 Boilerplate has a few different features, typically borrowed from other projects.

A server config file for setting timeouts, turning sendfile on, gzipping, server expiration, etc. I believe their repo has a few different versions of these files for a few different servers (apache, nginx, node, lighttpd). You can find those config files here: https://github.com/h5bp/server-configs. From my understanding Rails doesn't have any type of equivalent for this.
It also comes with a custom build of Modernizr that checks for HTML5 and CSS3 features within the browser and then adds classes to your <html> tag so that you can utilize them within your stylesheets or javascripts. This allows you to target browsers with a fallback style or interaction if it didn't support the feature you were trying to use. One example for CSS may be something like border-image which doesn't have widespread support. You could apply border-image: for the browsers that can use it and for the others you would use the class that HTML5Boilerplate provides (html.no-borderimage) to provide a backup style. You could also check for these classes from your JavaScript to be sure you weren't targeting browsers with code they didn't need (or couldn't respond to). Rails doesn't have anything internally that would do this out of the box.
Respond.js is also packaged with Modernizr which gives you media queries support in browsers that don't already have it. You mentioned you weren't targeting IE6 but IE7 & IE8 don't support Media Queries (nor do a good amount of mobile browsers) and Respond.js would give you that support. Rails also doesn't have anything built in to handle this.
Modernizr relies on yepnope.js to load externals so that would be available to you as well. This library allows you to test for features and load certain scripts/styles based on the result of that test. This is helpful if you are bringing in files that only some browsers need. Rails doesn't do this.
PNG fixes. You probably don't need this if you aren't supporting IE6 but it does come packaged with some png fixes for legacy browsers (cough IE6). Rails doesn't really handle this type of thing on the front end on it's own.

Ultimately you could grab the pieces that you need and bring them into your application without bringing in the entire HTML5 Boilerplate (and fwiw, that's what I typically do as well). That said, your question is "what value does HTML5 Boilerplate bring to a Rails application?" and the answer is "a lot", depending on if these tools are useful based on what you are doing. HTML5 Boilerplate doesn't necessarily overlap Rails in any way.

You can get a full list of features, coding style recommendations at the HTML5 Boilerplate Docs

You'll also probably be interested in HTML5 Boilerplate for Rails Developers

Recommended topics

Hot tags