Beyond HTML5 and CSS3

Developers who’ve been working with XHTML for a long time tend to feel a little awkward when they first notice the lack of self-closing tags in HTML5 markup. But HTML5 isn’t derived from XML, so it’s not going to conform to the same rules that XHTML did. However, the sepcification says it’s fine to have self-closing tags in our HTML5 markup.

The problem with self-closing tags in documents served with the text/html mimetype is that browsers start stripping off those self-closing tags. After all, HTML documents never had self-closing tags, and XHTML documents are supposed to be served with a different MIME type which is unfortunately incompatible with IE 6,7, and 8.

But because of browser inconsistencies, we’re starting to see some self-closing tags make their way into valid HTML5 documents again. One placei n particular is the source element in HTML5 video.

 <source src="http://video-js.zencoder.com/oceans-clip.mp4" 
               type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />

It seems that due to some strange parsing bugs, the video element doesn’t load properly unless the source tag is self-closed.

It’s an unfortunate side-effect of ten years of exceptions upon hacks upon exceptions.

A great article over at the VideoJS blog states:

As we roll into 2011, HTML5 video hits a major milestone. 50.5% of web users now support HTML5 video playback. This number was gathered by comparing browser versions that support HTML5 video with StatCounter’s world-wide browser version statistics.

You can read more at http://videojs.com/2011/01/html5-video-statistics/

I’m exceptionally excited about this, and you should be too. We’re a step closer to being able to provide video to end users without them having to worry about plugins or codecs. There’s a long way to go, but this is certainly an improvement from the days where Internet Explorer 6 had 80% of the marketshare.

You can find more detailed information on incorporating HTML5 video with appropriate fallbacks in the book.

I didn’t have nearly enough space in the book to cover how to properly encode video files for mobile devices. Thankfully the wonderful folks over at ZenCoder put up a pretty hefty blog post on how to get your video to almost every mobile device (and more).  This is really good stuff, and completely accurate.

How To Encode Video For Mobile Use

Youtube’s recent blog post states why they’re sticking with Flash Player as their primary player for the foreseeable future. The main reasons basically boil down to HTML5 video’s immaturity — the inability to do streaming video, poor fullscreen support, and no way to protect the rights of content producers.

Read more here.