Building a Future-Proof Website That Also Works With Older Browsers
Tue, November 2, 2010 at 10:12 PM
Paul Cormier in CSS, Coding, Design, HTML5, Javascript

Soon ObsoleteSometimes you just need to build a website from scratch. However, trying to get your HTML & CSS code to display correctly in the plethora of browsers in use today can be a nightmare. Throw in the netbooks, mobile devices and tablets with touchscreens, and you'll be up all night pushing bits and pixels around.

Oh yeah, there's also another version of Internet Explorer around the corner. It seems every new release of IE brings with it new problems to contend with.

Well, it turns out that it's not as difficult as it sounds to create your site's code framework so that it displays nicely across all devices and browsers old and new. Some smart guys have been hard at work creating code that will also likely continue to work in future browser versions.

What's All the Hubub About HTML5

By now you've been flooded with a myriad of opinions, advice and recommendations about the new HTML5 specification which, at the time of this post, is still under development. That doesn't seem to stop the browser developers, as they've already implemented some of the features of HTML5 into the current released versions of their browsers.

This post isn't about all the coolness that HTML5 brings to your toolbox. You probably already know a good deal about that. If not, there are plenty of articles covering that subject. What I do want to introduce you to is the following.

Best Practice Website Code For Today and Tommorrow

After over 2 years of iterative development, Paul Irish, Divya Manian and an army of contributors have come up with HTML5 Boilerplate which, in their words is "the professional badass's base HTML/CSS/JS template for a fast, robust and future-proof site".

Major Benefits of Using HTML5 Boilerplate

The HTML5 Boilerplate Components

These are the pieces you get to help you start building that future-proof website.

Head on over now and take a look at the full documents and download either the commented or uncommented versions of the files.

Using these best-practice code templates will ensure you start your new web design on the right foot and minimize the coding hassles so you can focus on the content, design, workflow, usability and more.

Please be sure to subscribe to our feed (above) or follow WebMasteryMadeSimple on Facebook to get more tips on designing, building, hosting, running and promoting an effective website.

Photo by mark.hogan



Article originally appeared on (
See website for complete article licensing information.