Html 5 Video player Demo

As browser vendors work hard at implementing various features of Html 5 in their browsers, they’ve also been enhancing support for the video tag. We’ve been monitoring their progress closely and have been simultaneously developing our own Html 5 video player and ensuring that it works in all major browsers (IE, Firefox, Safari, Chrome, and Opera). In addition to desktop players, our Html 5 video player is also compatible with mobiles devices such as Android based devices, Windows phone 7 based devices and iPhone/iPad.

Html 5 Video player Demo

The Html 5 video player demo page attempts to show off some of the capabilities of our Html 5 video player. We’ve got multiple versions of the video you see there. In addition, these videos are encoded at a much higher bit rate than the normal. So if you don’t have the bandwidth and/or processing power pick a different version. You will need the latest/beta versions of the major browsers in order to use the Html 5 video player.

  1. 1080p encoded at 7,000kbps
  2. 720p encoded at 4,000kbps
  3. 480p encoded at 2,600kbps
  4. 360p encoded at 2000kbps (same as current Md version)
  5. 270p encoded at 500kbps. (same as current Low version)
The demo page should work for all major browsers. Please check it out and let us have your feedback. There is a known issue with Safari on Windows and that is the browser downloads the complete file before playing the video.

Browser Support

While all browsers don’t yet support all of the features we need in our player, we’re happy to report that the ExposureRoom Html 5 video player boasts support for all the features you’d expect in a video player, including full screen support.

Major features of the ExposureRoom Html 5 video player

The following are the major features of our Html video player that are supported across all major browsers. We highlight them here because most websites that have an Html 5 player don’t support these features.
  1. Skip ahead – The ability to skip ahead even though the video stream has not downloaded to that point yet. Similar to streaming video behavior.
  2. Change version while playing – The ability to be able to change the version (Low, Md, HD) while the video is playing. Unlike most other implementations, our player seamlessly changes versions starting from where you left off.
  3. Full screen – The ability to switch to full screen mode. You need to switch your browser to full screen mode (hit the F11 key) to get the best viewing experience. Safari users can simply switch to full screen mode (there is no F11 key option anyway)

In addition to the features above, the Html 5 player also supports or will support the following additional features:

  1. Theme support – The ability to change the color theme of the player as you can see on the demo page.
  2. Built-in Share/Embed options – The player itself will surface the options to share and embed.

Video Playback performance

We did some extensive tests during the course of developing our player and find that the playback performance of IE 9 and Safari are extremely good (almost as efficient as the native players on their respective platforms). So much so that they are far better than any Flash based video player (including ours). So MAC/Safari users can gain some real benefits here because typically Flash player performance on a MAC is pretty bad. Safari on Windows performs equally well. Microsoft will be releasing IE 9 in beta on September 15th so people can begin to use various Html 5 features including video soon. The speed and performance of the new IE 9 browser is simply awesome, leaving every browser far behind. If you haven’t checked it out yet, you can do so here. IE 9 Platform Preview

Mobile devices

The new player is compatible with mobile devices too. In addition, you’ll have the option to choose between all available versions. Devices such various Android devices and the iPad should be able to play all versions (bandwidth permitting).

H.264 and WebM

At the moment, H.264 and VP8 (WebM) are the two primary codecs in the Html 5 video space. Only Chrome supports both these codecs (with IE to follow soon). The others browsers, Firefox and Opera, support WebM but will probably never support H.264 and we’re not quite sure if Safari will support WebM (it support H.264).

At the moment all of our recent videos (in the last year or so) are encoded using the H.264 codec. None are WebM encoded (except the ones on the Html 5 video demo page) and we’re not quite sure if/when we will support WebM as encoding multiple versions twice over has implications of requiring double the processing power, double the time it takes and double the disk space required. So Firefox and Opera users will have to continue to use the Flash player.

Sync Flash version with Html 5

At the moment the two players (the Flash based player and the Html 5 player) are not synchronized in as far as their feature set is concerned. This will change shortly. That is both players will have the same features. In essence, the flash based video player will be enhanced to have the same features as our Html 5 video player. So those of you using older browsers or Firefox or Opera will still get the benefits of the features the Html 5 player has.

About ramadasnarayanan

am visual media editor...... trying to be a positive human being

Posted on November 4, 2011, in Fourm. Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: