HTML5 is the latest version of HTML markup language. Practically, for most of us HTML equals to the World Wide Web. Several years ago W3C, an international organization of web standardization, established an HTML working group in order to bring classic HTML to a new level, which is known as HTML5.
HTML5 tries to destroy borders between browsers rendering and unify user experience on the Internet. The main goal of the new markup language is to make dynamic and rich media content available on all browsers and devices. But the technology steps much further, than just a markup. In fact, HTML5 may become a universal technology that is suitable for multimedia players, mobile websites, web apps and online games. By now HTML5 technology has a sufficient toolbox for these tasks. Obviously, HTML5 pretends to be a real alternative to Adobe Flash in each sphere: video, gaming, web apps, etc. Let’s see what is better for web design and users.
HTML5 Video & Audio Playback
Thanks to HTML5, people can forget about annoying Flash plugin updates and sluggish Flash players. HTML5 introduces a special <video> tag which handles video playback without any add-ons from the end-user side. Look at a video player code sample for HTML5:
<video width=”320″ height=”240″ controls=”controls”>
<source src=”movie.mp4″ type=”video/mp4″ />
<source src=”movie.ogg” type=”video/ogg” />
<source src=”movie.webm” type=”video/webm” />
Your browser does not support the video tag.
As you can see the HTML5 code has a much simpler structure than Flash-based code taken from YouTube:
<object width=”560″ height=”315″><param name=”movie” value=”http://www.youtube.com/v/7SvDTL4ZMz4?version=3&hl=en_US&rel=0″></param><param name=”allowFullScreen” value=”true”></param><param name=”allowscriptaccess” value=”always”></param><embed src=”http://www.youtube.com/v/7SvDTL4ZMz4?version=3&hl=en_US&rel=0″ type=”application/x-shockwave-flash” width=”560″ height=”315″ allowscriptaccess=”always” allowfullscreen=”true”></embed></object>
However, HTML5 approach to video playback has its pros and cons.
On the one hand, HTML5 video is a real pleasure for users. They do not have to install and configure anything. There are no unfriendly messages “your Flash player is outdated”. Besides, users do not have face Internet scammers requesting to download a new video plugin from an unknown site. Unlike Flash player, HTML5 eliminates the need to deal with security questions. Its counterpart is notorious for virus attacks.
The similar situation regards a new <audio> tag. Thanks to it you can embed an audio track onto your website. HTMl5 supports the following formats for audio files: MP3, M4A and WebM audio. The code looks a like in video case. To facilitate audio processing, there are helpful HTML5 audio players you may need: jme, MediaElements.js, and jPlayer.
HTML5 Cross-browser and Mobile Websites
HTML5 gives more freedom to webmasters. As you know HTML5 claims to be a cross-browser solution. That means a user can access your site from any browser (Internet Explorer, Google Chrome, Mozilla Firefox, Opera, Safari) and have the same experience at all of them. But at this point the technology has limitations. HTML5 is supported only by the most recent web browsers. If we take Internet Explorer, for instance, there’s no chance to enjoy HTML5 content on old-school Internet Explorer 6, 7, or 8. HTML5 is locked at the 9th version of Microsoft web browser. To cut the long story short, if your visitors come from Internet Explorer 7, they may lose a significant part of your content.
Per contra, owners of mobile gadgets can finally reach rich media content available in HTML5 format. iPad, iPhone, Android gadget holders may watch video, listen to music, interact with your web interface or utilize your online app in the same manner as they do it on a desktop browser client. But it doesn’t mean designers shouldn’t create special design for mobiles or use free PSD mobile UI designs.
HTML5 for Games and Apps
HTML5 may seem an ideal web future, though there are a few drawbacks that stop its quick spreading around the globe. First of all, it lacks guidelines. For the last 5 years the web community discusses possible and acceptable guidelines. But they fail to come to a real document which describes HTML5 markup use and principles. Secondly, the main players on the market such as Google, Apple, Facebook or Twitter have different attitude to common web development, so they cannot lobby unified HTML5 principles. This unclear situation prevents many smaller web agents from active HTML5 promotion. Even now with lots of HTML5 tools, designers and web developers prefer to wait and see what’s going to be the next with web technology.