Finding the Build Script Hard Work? The scope of the HTML5 Boilerplate by Paul Irish and the team is pretty big. In fact, they seem self-aware of this, sending a questionnaire to their users, trying to figure out which parts of the project people use or don’t use. Here are the results. Part of the Boilerplate is a tool called the Build Script; a script that runs in Terminal that essentially speeds up your website through compressing your code and images, forcing visitor’s browsers to cache everything, and probably some other wizardry that I can’t fathom.

Getting your head around the Build Script and adapting it for WordPress can take a bit of time, but there’s more! Trying to figure out the best way to publish everything can be a bit of a head-scratcher. I was pretty upset that publishing the Build Script broke my previous workflow using Espresso’s built-in FTP, and eventually had to resort to FileZilla, a self-contained FTP program, to get things working smoothly. But once you tweak it a bit, publishing your Build-Scripted WordPress theme becomes a snip! Filezilla is a free FTP program available on Mac and Windows, you can download it here. Here are the filter configurations I talk about in the video:

In part 2 of the HTML5 Build Script + WordPress tutorial we’ll go through the modifications we need to make to the build script so that it works nicely with WordPress. It’s actually not too taxing, but there are a few gotcha’s. If you want to jump straight to the code there’s a link below to my blank WordPress theme, based on Starkers by Elliot Jay Stocks, but with added HTML5 Boilerscript stuff + a working Build Script. HTML5 Boilerplate WordPress Theme with Build Script N.B. I’ve made a few tweaks here and there, for example I’ve included Ryan Fait’s Sticky Footer, Andy Clarke’s 320 and up principle for CSS3 Media queries, etc. Feel free to strip these out – … Continue reading →

Firstly if you’re a serious web designer, or have ambitions to be a serious web designer, you should be checking out HTML5 Boilerplate right now (www.html5boilerplate.com). The idea of the HTML5 Boilerplate is to provide a starting point for future-proof web design. From putting javascript at the bottom of the page to using Modernizr, this is a collection of best practices from some notable people in the web industry and we really need to be aware of these basic fundamentals. However, basic Boilerplate aside my next two videos will specifically focus on the ‘Build Script’, a feature fully realised in version 1.0 of HTML5 Boilerplate. The idea of the Build Script is to always serve your code compressed, and always … Continue reading →