The Spider King

Most folks who know me know that I am passionate about heavy metal, dachshunds, and recently design. But you may not know that I have been a proponent of web standards and I am particularly double-rainbow’d about HTML5 and related technologies. In fact, I have been on the HTML5 wagon for the past year even before Microsoft announced at MIX10 that we were “all in”.

My team of pirates at MIX Online have been advocates of HTML5 and web standards. We have recently had the chance to work closely with the Internet Explorer 9 team who have really done some amazing work to support things like <canvas>, <video>, <audio>, SVG, WOFF and a whole lot more in the latest IE9 preview. You will see more of the brutal stuff we have been working on in the coming months.

One question I always get when I am extolling the greatness of HTML5 and IE9 is:

How do I get started? Oh, and I gotta get up to speed YESTERDAY!

In this post, I will try to help answer that question. This is not the uber-comprehensive laundry list of all things known to woman and mankind about HTML5 and IE9, but this will get you running pretty quickly.

1. Go buy Developing With Web Standards

If you are new to this web game because you have been doing kernel development, COBOL bad-a**ness, or haven’t really focused on front-end development, you need to go get John Allsopp’s book called Developing With Web Standards. It will get you from zero to hero, quickly. It covers the basics and moves you to real-world development and HTML5 within 400 pages.

2. Go buy HTML5 for Web Designers

You read John’s book but now you really want to get focused in all that HTML5 has to offer. You also would like to really wrap your head around HTML5 specifically. The good folks at A Book Apart who also run the amazing web site called A List Apart have put out their first book by Jeremy Keith called HTML5 for Web Designers. This book clocks in at a whopping 85 pages! Jeremy does a great job of keeping it fun and giving you a lot of the philosophy behind the technology.

You should get this especially if you are up to speed on web development already and need a crash course on HTML5. Also, this book is pure greatness for vacations with the spouse as it is not a laptop and is small enough that it doesn’t look like some arcane technology tome. You can definitely read it in one sitting.

3. Keep a watch on HTML5 in Twitter

In my Twitter app of choice, I have a column/search on HTML5 which keeps me abreast of all that is going on around HTML5. About a year ago there was barely a trickle, but now it is full stream ahead. You can either set this up as well in your app of choice, use Twitter search, or keep an eye on it at The Archivist:

4. Check out the HTML5 Spec

Ok, you probably want to know it is there but won’t want to spend a ton of time here since it is actually a boring read and some say it clocks in at 900 pages. Let other folks do the hard work for you and read what they have to say. But a word of warning, like Twitter and the Internet, don’t always believe what you hear. If something sounds ominous, check the spec and see if that is true. You can even get involved in the process by joining the mailing list. Ok, this spec talk is making me sleepy, let’s move on…

5. Get the Internet Explorer 9 Preview

We (Microsoft) have been making available platform previews of Internet Explorer 9. About every 6 weeks a new build is made available. You can go to the Internet Explorer 9 Test Drive site and download the latest preview which includes all the HTML5 goodness.

Now don’t be alarmed when you don’t see all the toolbars and chrome you are accustomed to. The reason why it is not there is because we want designers and developers to focus on rendering, performance, etc. of their websites and testing out new things like HTML5′s canvas and hardware acceleration. The preview is not meant to be used as a daily browser and will work side-by-side with IE9.

6. Read the Developer Guide

The developer guide is very comprehensive and walks you through all the things you can do with IE9. It is a long read but contains a wealth of information.

7. Check out the IE9 Videos on Channel 9

Channel 9 is the community site for Microsoft developers. Members of the product team and evangelists have videos there that explain various demos and technology behind IE9. This isn’t your typical marketing stuff, it is made for developers. Go to Channel 9 and do a search on the tags: IE9 and Internet Explorer 9.

8. Try the Demos and Dig Through the Code

The demos at the Test Drive site cover the 3 major enhancements of IE9: performance, HTML5 and graphics. These demos were mostly written by the product team themselves. I would grab one you are interested in and press F12 to bring up the developer tools window in IE9 and investigate the code for these. You will learn a lot from doing this.

9. Add the IE Blog to Your Feed Reader

There is a lot of good stuff that comes out of the Internet Explorer blog. It is not just a marketing mouthpiece but gives technical updates and explains the method to the madness at times. Plus, if you like to see great flaming from internet trolls, then you will love the comments! Here are some of the articles:

• DOM Traversal
• How IE9 Platform Preview Feedback Changed the JavaScript Standard
• The CSS Corner: Better Web Typography For Better Design
• Caching Improvements in Internet Explorer 9
• A GPU-Powered Shopping Experience with Amazon.com
• Measuring Web Page Performance
• Enhanced Scripting in IE9: ECMAScript 5 Support and More
• IE’s Compatibility Features for Site Developers

10. Let’s give peace a chance.

Ok, no one knows more than us that Internet Explorer has its…um…detractors. I have stated many times that I want to see IE6 eradicated from the planet.

But it seems when it comes to browsers (and technology communities overall), we all lose our minds with sniping, bickering and pettiness. Again, please review comments on the IE Blog.  Everyone I know from all the browser vendors and folks trying to make HTML5 the best thing possible are really trying their best, but when we all continue to be d-bags to each other, we lose. So let’s all try to look at that glass as half-full and try to raise the waters so all ships can rise instead of sending cannon fodder over the bows. Let’s celebrate those that are doing interesting things with HTML5 and make the web a better place. Remember:

War is over…if you want it.

- John and Yoko

I hope these steps help you get up and running very quickly with HTML5 and IE9. If you want to keep up-to-date on all the HTML5 and IE9 brutality, follow me on Twitter.

If you have some great ideas on getting folks up to speed on HTML5, put them in the comments below!