The Fifth Element (Part II) – Short Term Benefits

This post is in continuation of the earlier post on HTML5. Before looking into the day-to-day benefits HTML5 will offer, let’s do a quick sanity check:

  • HTML5 is monolithic, but browsers are not. It is misleading to divide browsers into “Supports Vs Not”.  Instead, individual HTML5 feature support should be evaluated in terms of browsers.
  • HTML5 is fully backward compatible. You can simply upgrade your doctype to HTML5 without changing any underlying code; the page is still valid and will still work. There is no need to panic or to throw away any page!

Multimedia:

With HTML5, embedding media is as simple as using the <video> or <audio> tag in code – a quantum reduction in effort, compared to the earlier way of coding for video. No plug-ins to include or activate (Windows Media, Real, Quick Time or Flash) and less markup code means that a page can be developed with less code and a browser can download it quicker, parse it faster and render it sooner.

H.264 or MPEG-4 is currently the predominant standard of file compression encoding that is used by YouTube, Vimeo, iTunes and the other leading media sources. The Chrome 10 browser that was released in March of this year dropped support for H.264 in favor of “WebM”, a royalty-free compression format combining the VP8 video format and Vorbis for audio — clearly marking the big play Google is making for pushing their own WebM as a native standard in HTML5.

YouTube has an experimental HTML5 site where you can sign up and test drive your upgraded browsers: http://www.youtube.com/html5. After signing up for this Beta, you will want to test out for yourself, what WebM videos are all about. The default YouTube search returns a mix of formats so make sure to add  “&webm=1” at the end of the URL for any search you do and hit “Enter” again, so that the search returns only WebM videos. Clicking on these results will play the video without using Flash and instead by using the browser’s new native video capability.

Browser support for streaming formats is not yet standardized. As a content provider, you will need to encode media in three formats: WebM, MP4 (H.264 video and AAC audio) and Ogg (Theora video + Vorbis audio). The good news is that gracefully degrading to a Flash player does not require hacks or browser-sniffing.

Semantic Tagging:

HTML5 introduces a host of new tags intended to give semantic meaning to content without altering the appearance in any way. Tags such as <section>, <article>, <aside>, <header> and <footer> are the basic elements that will enable a human reader, and eventually a machine reader, to give context to the information in a page. Microdata is an extension of this idea, determining which custom dictionaries, meaning and context can be given to web content. This paves the way for better SEO, targeted searching and contextual advertising.

Validations:

Several new input elements obviate the need for writing validation code, thus reducing the total payload of a page and increasing maintainability. Input elements like email, url, number, range and search all perform validation and throw an error without the need for custom code.

Animation:

The “canvas” element of HTML5 when used in conjunction with CSS3 and javascript, provides a full feature set that allows graphing, vectors and animation. This is approaching the capabilities of flash (already canvas based cartoons are available on the web).

Offline usage:

HTML5 expands on the pre-existing cache that browsers had by making it query-friendly and more robust. All, or at least most webpages of a website can be completely cached in the local data store so that a user working in “offline” mode can still click and see the pages in their last cached form. In addition to offline web surfing, this API also exposes a SQL style browser database that makes possible, offline applications such as email and games. When an internet connection is re-established, the browser performs the synchronization of the applications transparently. The Google plug-in “Gears” which was developed for such functionality, will be replaced by the offline functionality of browsers.

Geolocation:

The Geolocation API built into browsers tap into either a “coarse” location or a “fine” location using a combination of IP address, closest WiFi location and GPS listener (depending on what is available or opted in). To address privacy concerns, requests for geolocation information can be explicitly accepted by a user before the API gets to work. Geolocation means that browser-based applications can now access GPS and/or cell tower triangulation information and provide location based services, reducing the need for custom SDKs and applications.

These are some of the major advances in HTML5, but this list is far from being comprehensive. HTML5 is here to stay, so internet success is going to be predicated by the adoption rate of IT Services organizations in the Web Content Management space. Have you recently used an application involving HTML5 in some way? What has been your experience and what are your views on the latest version of HTML? Please send us your feedback by submitting your comments.