A funny thing happened in the unfolding World Wide Web saga. Once upon a time, in the nineteen hundreds – nineties to be precise – developers had to go though all kinds of hoops to make their pages fast loading and maintain a consistent appearance across different browsers and platforms.
Fast forward to the present day, and not only has the situation failed to improve, as so many optimists suggested it would, but the situation has gone from bad to worse; not only are there more browsers than ever, but now we also have mobile devices to contend with. Short of trying our sites out in every conceivable combination of browser, O/S and platform, how can one have a reasonable degree of confidence that the two important goals of fast loading and consistent appearance are being met?
One big step in the right direction is to use Paul Irish’s excellent HTML5 Boilerplate Website Template. It’s a professional HTML/CSS/JS template for creating websites that are both fast and robust. But more than that, it’s a collection of front-end HTML5 development best practices that Mr. Irish has gone through the trouble of implementing for you. Hence, HTML5 Boilerplate is a must have for web developers who want to take advantage of all that HTML5 has to offer. In this article, we will be delving into the pertinent issues that face developers and how the HTML5 Boilerplate Website Template deals with them.
To be honest, I had never heard of Paul Irish before I wrote the Aptana Studio 3 Guided Tour and Tutorial: Create a Web Project Using the HTML 5 Boilerplate Framework article. Upon conducting a little online research, it quickly became apparent that this is no yahoo (in the Gulliver’s Travels /yokel sense of the word and not Yahoo!). In addition to being the creator of HTML5 Boilerplate, he is also the Public Relations spokesperson for Google Chrome, a member of the jQuery team, and a lead developer of the Modernizr JavaScript library! Does he have any free time at all?
The genesis for HTML5 Boilerplate came when Paul Irish decided to make all of his best practices available to the Web community via GitHub. Pretty soon, the template found its home at html5boilerplate.com. In a nutshell, the template accomplishes two things. First, it helps target older and/or non W3C compliant browsers, and by that we mean IE 6, 7, and 8. Second, it optimizes the code to run as smoothly and quickly as possible. The latter being accomplished via the build scripts. Although I have used Ant extensively for deploying Enterprise Java projects, I have never used a build script for deploying Web pages. But now that I think about it, in high profile and/or commercial applications, it makes perfect sense to streamline and optimize your code as much as possible. Here are just a few of the ways that it modifies your project code:
Visit the Build Script GitHub page for a more comprehensive list.
Here’s just a few of the sites that were built using the HTML5 Boilerplate:
When in doubt, some sites don’t bother to or don’t want to change the default selection color of hot pink! Select some text and see what happens! Here’s a site called 1.21jiggawatts.com that your kids are gonna love. I already love it!
A quick view source confirms it. The simple doctype tag and IE conditional statements at the top of the page are a dead giveaway:
<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
In keeping with the goal of maximizing download times, the template is available in no less than thee flavors: with comments, without, and in customizable form, where you decide which components you want. Visit the HTML5 Boilerplate site to learn more. In an upcoming article, I will explain how to use the template in more detail.
Rob Gravelle resides in Ottawa, Canada, and has been an IT guru for over 20 years. In that time, Rob has built systems for intelligence-related organizations such as Canada Border Services and various commercial businesses. In his spare time, Rob has become an accomplished music artist with several CDs and digital releases to his credit.
The original home of HTML tutorials. HTMLGoodies is a website dedicated to publishing tutorials that cover every aspect of being a web developer. We cover programming and web development tutorials on languages and technologies such as HTML, JavaScript, and CSS. In addition, our articles cover web frameworks like Angular and React.JS, as well as popular Content Management Systems (CMS) that include WordPress, Drupal, and Joomla. Website development platforms like Shopify, Squarespace, and Wix are also featured. Topics related to solid web design and Internet Marketing also find a home on HTMLGoodies, as we discuss UX/UI Design, Search Engine Optimization (SEO), and web dev best practices.
Property of TechnologyAdvice. © 2025 TechnologyAdvice. All Rights Reserved
Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace.
