12 resources for getting a jump on HTML 5
~ 14 January 2009 ~
Recently I’ve seen a considerable amount of press on blogs and such regarding HTML 5, “the 5th major revision of the core language of the World Wide Web” (W3C). I have virtually no experience (yet) with HTML 5, so as I jump on the bandwagon and begin familiarizing myself with it, I thought I’d share some of the resources I’m reading along the way.
So far from what I’m learning, the consensus among several of these articles seems to be this: The world isn’t ready for HTML 5 at large just yet, but we can begin preparing for it by using common, semantic selector names (
section, etc.) — or even new attribute names — derived from HTML 5 within our HTML 4.01 or XHTML 1.x documents.
This is by no means an exhaustive list, just a start. In each of these you’ll find other resources to help you dig deeper.
- A Preview of HTML 5 by Lachlan Hunt. Start with this one. The fact that it was published a year ago, coupled with increased interest in and experimentation with HTML 5 recently, makes it feel less like a preview and more like a “here’s what’s just around the corner” primer.
- W3C HTML 5 Spec. Like you’ll totally read every word of this, right?
- Preparing for HTML5 with Semantic Class Names by Jon Tan. A very thorough introduction, if not also the most well-formatted. “By using semantic class names, we give the information a semantic boost, and each chunk of related data is self-contained. However, it may have become obvious to some designers reading this that a side-effect of using this method, and eventually using HTML 5 elements themselves, will be lots of different content within containers of the same name.”
- HTML 5 differences from HTML 4. Not surprising:
framesetno longer allowed in HTML 5. Surprising: A document from the W3C that’s actually fairly readable.
- More on developing naming conventions, Microformats and HTML5 by Andy Clarke. Another article on the theme of transitioning to HTML 5 by using common, semantic selector names now. “If I could have one wish fulfilled today, it would be that all CSS framework developers would adopt the same naming conventions (and embed Microformats extensively too), so that people who are new to meaningful markup and CSS get off to the right start and use meaningful, logical rather than presentational
classattributes.” Includes a demonstration file.
- Wikipedia: HTML 5 if Wikipedia is your sort of thing for stuff like this.
- The Rise of HTML5 by Jeremy Keith. A behind-the-scenes for the UX London site, written in HTML 5, with plenty of accompanying links to HTML 5 resources. “It turns out that when it comes to the markup, HTML5 isn’t all that different to what has come before. It’s all the DOM gubbins—which should allow a more declarative approach to building web apps—that is the real hard stuff that requires browser support in order to work. If you’re not interested in that side of things, much of the HTML5 spec won’t even be relevant to you.”
- An Event Apart and HTML 5 by Eric Meyer. Another behind-the-scenes for the new An Event Apart site. “I get the distinct impression that use of HTML 5 is going to cause equal parts of comfort (for the familiar parts) and eye-watering rage (for the apparently idiotic differences). Thus it would seem the HTML 5 Working Group is succeeding quite nicely at capturing the current state of browser behavior. Yay, I guess?”
- HTML5 id/class name cheatsheet by Oli Studholme. To be honest, I don’t fully understand this cheatsheet. Yet, that is. It’ll come to me soon, I’m sure.
- The Web Developer’s Guide to HTML 5 by W3C. I’ve not read this one yet, but it’s got colored boxes — a rarity from the W3C. That must mean it’s good.
- Semantics in HTML 5 by John Allsopp. Published just last week, this article includes an alternate take on the methodology of HTML 5 altogether: “Instead of new elements, HTML 5 should adopt a number of new attributes. Each of these attributes would relate to a category or type of semantics. For example, as I’ve detailed in another article, HTML includes structural semantics, rhetorical semantics, role semantics (adopted from XHTML), and other classes or categories of semantics. These new attributes could then be used much as the
classattribute is used: to attach to an element semantics that describe the nature of the element, or to add metadata about the element.”
- HTML 5 elements test by Bruce Lawson. Demonstrates how new elements in HTML 5 are rendered. Works only in the latest versions of most browsers, with an exception or two as documented.
Got any other resources? Please share.
Stock photography, type, and killer tees. Genuinely recommended by Authentic Boredom.
Authentic Boredom is the platitudinous web home of Cameron Moll, designer, author, and speaker. More…
Full-time and freelance job opportunities. Post a job...
A selection of fine reading, available for a limited time only:
- Recent job listings, testimonials, and 100th Kiva loan
- The ISO50 Field Guide to Color Management
- Upgrading the hard drive and memory in a refurbished 13" MacBook Pro
- Inspiring type: Libro di M. Giovambattista Palatino
- Randomness, vol. IX
CSS Mastery: Advanced Web Standard Solutions A solid round-up of indispensable CSS design techniques by Andy Budd, Simon Collison, and Cameron Moll.
Mobile Web Design A guide to publishing web content beyond the desktop. Tips, methodology, and resources. Now available.
Letterpress Posters The unassuming beauty of a freshly letterpressed print.
That Wicked Worn Look. Techniques for that worn, aged, distressed look.
Mister Retro Machine Wash Filters Turn the dial to “Instaworn” with these filters.
Blinksale Dive in and enjoy shamelessly easy invoicing from Firewheel Design.
Basecamp My preferred web app for internal and client project collaboration.
HOW Conference Austin, June 24–27. Pentagram, Adobe, P&G, et al.
Web Design World Seattle, July 20–22. Practical sessions on web design.
Stimulate Salt Lake City, September 2009. Entrepreneurship and design conference.