HTML 5 came before the world was ready for it, some say. "The standard's not complete," "Browser support is patchy," are among the complaints I've heard. But I don't hold with such sentiments. The world is
ready for HTML5, and you should be learning about it now and building websites with it. As for browser take up, of the many sites that reveal HTML5 features by browser and CSS3, the summary at the foot of CanIUse.com
seems pretty definite. It's a handy free site and very up to date. These are the take ups by browser at the start of March 2012:
- IE 10 : 77 percent
- Firefox 11 & 12 : 83 percent
- Chrome 17-19 : 88 percent
- Safari 6 : 75 percent
- Opera 12 : 76 percent
HTML5 does not just have more keywords than with HTML 4.0/XHTML 1.0. It often has better functionality. For instance, it includes:
- <Canvas> for drawing pixel graphics.
- Web Sockets--Browser server communication (Incomplete support).
- Local and Session Storage.
- IndexedDB--a Key/Value local database.
- <meter> and <progress>--for gauges and progress bars (Incomplete support).
- Shared and Web Workers. Run other tasks in parallel.
- Better Error Handling.
- GeoLocation. If supported and allowed, identifies user's latitude/longitude.
- Applicaton Caching. Hold files locally after first downloading.
Plus lots more, such as new Input and Form elements including auto-completion from lists, required input (no submission unless filled in), and public and private key generation. In my post Is Email Registration Needed for MMO Games?
I suggest some sort of storage be used (probably local) to manage logins to avoid using email to get players registered quickly.
Some of the new HTML 5 tags like <time> aren't supported by any browser, though this may change. Newer browser versions are coming along more frequently (Firefox and Chrome both update every few weeks--Chrome silently!
. It's a small library that detects the availability of features from HTML5 and CSS3 specifications. While you're at it with modernizr.js, check out the free conditional loader (just 1.7KB). Yepnopejs
is a resource loader as well. This provides a way to speed up loading resources without putting them all in one big file, which until now has been regarded as the best way to speed up loading. Finally, as a quick and convenient way of seeing what your current browser supports in HTML5/CSS3, take a look at haz.io
. Despite the domain name, there's not a cheezeburger or Lolcat in sight. It shows at a glance what is supported by your browser and, yes, it uses modernizr. But this isn't about about moving to HTML5 just for the sake of it. The new features that are
supported provide enhanced functionality, and I've never met a Web or game developer who didn't want to get ahead of the pack.