Using ‘Modernizr’ to implement HTML5 video

Standard

Last week I was playing around with Modernizr,  a small and simple JavaScript library that helps you take advantage of emerging web technologies (CSS3, HTML 5) while still maintaining a fine level of control over older browsers that may not yet support these new technologies.

For a project I’m currently working on, there will be plenty showcasing images and videos, so it would be helpful to have the videos playing straight into the browser without the need for third party plug-ins and also for our users on iPod, iPhones, and iPads to have accessible videos. Modernizr is great for this as it will use the new HTML5 video markup for and display the video in Adobe Flash for browsers like Internet Explorer.

As this is a relatively small scale project it was nice to try out this method of implementing HTML5 video. The only downside I can see at the moment is the need two different file formats available, one .mp4 for WebKit (Safari) video and .ogg for Firefox/Opera. This is a pain in the arse! Oh and the <1% of users who disable javascript will just get an image holder (have no fear though as they have the choice of downloading the video).

But rather than re-write the web I’m just going to direct you to Modernizr, and Video for Everybody, check it out yourself!

Leave a Reply

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

WordPress.com Logo

You are commenting using your WordPress.com 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 )

w

Connecting to %s