Learning from the HTML5 Boilerplate
This is one of a set of notes for talks I attended as part of DeveloperDeveloperDeveloper9, held at Microsoft Reading on 29th January 2011. They are mostly for my own records, but if you find them useful, good. If you have any questions about the content (unless it’s to tell me I’m irresponsibly wrong), I’d suggest contacting either the speakers or someone who knows more about the content than I do! You can also see the twitter hashtag timeline of the day – #ddd9.
Title: Learning from the HTML5 Boilerplate
Speaker: Dan Maharry
blog.hmobius.com
@hmobius
Slides: http://is.gd/L5PV18
Links: tinyurl.com/h5b-github
html5boilerplate.com
htmlify.info
Notes:
HTML 5 things:
<!doctype html>Â Â <– this is the HTML5 doctype
HTML5 boilerplate is a collection of lots of tips, tricks, improvements, hacks and ideas for using HTML 5, JQuery and CSS intelligently and fast. Not sure if you would actually want to start a project with everything in the boilerplate, but it does make a very good learning tool.
Also comes with ant/MSBuild build files which compress/minify JS, CSS, images etc. automatically.
modernizr – looks at client browser and automatically lists out in CSS all classes supported by browser (so that only what the browser supports is used). You can also get this list via javascript.
Clever idea for using CDN-based JQuery script, but also falling back to local if CDN version can’t be loaded.
Put Google Analytics script at *bottom*. It’s asynchronously loaded, but even so, if at top will call at start of page, even if user presses back before the page has fully loaded. At the bottom of the page, GA results will only be saved if user fully loads page.
Cache-Busting the CSS – use query string with updatedable ‘version’: this.css?v=2
(the build scripts automatically update this version number to bust the cache)
Someone has also created a version of the Boilerplate for use with MVC/Razor project. It’s on Github.
HTMLify is an attempt to ask you what you’ll need (what server, what browsers etc) and tailors the Boilerpate. At htmlify.info at the moment but may move to main Boilerplate page soon.
Written by Tom Morgan
Tom is a Microsoft Teams Platform developer and Microsoft MVP who has been blogging for over a decade. Find out more.