Wednesday, August 11th, 2010
The HTML5 love continues to be doled out by Paul Irish. First, he offered up Modernizr and now, he’s teamed up with Divya Manian to create an HTML5 boilerplate which leverages best practices to get your started.
It’s essentially a good starting template of html and css and a folder structure that works. But baked into it is years of best practices from front-end development professionals. Take a peek through the source to get a feel of what’s inside. And if you think there’s too much? Delete key that badboy.
Straight from the site, here are some of the features that make this very cool:
- Cross-browser compatible (IE6, yeah we got that.)
- HTML5 ready. Use the new tags with certainty.
- Optimal caching and compression rules for grade-A performance
- Best practice site configuration defaults
- Mobile browser optimizations
- Progressive enhancement graceful degradation … yeah yeah we got that
- IE specific classes for maximum cross-browser control
- Handy .no-js and .js classes to style based on capability
- Want to write unit tests but lazy? A full, hooked up test suite is waiting for you.
- Console.log nerfing so you won’t break anyone by mistake.
- Never go wrong with your doctype or markup!
- An optimal print stylesheet, performance optimized
- iOS, Android, Opera Mobile-adaptable markup and CSS skeleton.
- IE6 pngfix baked in.
- .clearfix, .visuallyhidden classes to style things wisely and accessibly.
- .htaccess file that allows proper use of HTML5 features and faster page load
- CDN hosted jQuery with local fallback failsafe.
- Think there’s too much? The HTML5 Boilerplate is delete-key friendly. :)
I’ve heard several people mention about getting some sort of HTML5 template to work from setup so it’s nice to see one completed and out in the wild. This should be a big help.
Posted by Rey Bango at 10:58 am