YouTube Adds HTML 5 Embedding of Videos
By on July 25th, 2010

Here is some good news for YouTube fanboys, now you can embed YouTube videos using the new HTML5 embed code. The YouTube api blog recently announced that the team is experimenting with a new embed code that uses the iframe tag to switch between the flash and HTML5 interface.

YouTube added support for HTML5 earlier this year, followed by another popular video sharing site – Vimeo. The HTML5 video playback was limited to only a few browsers e.g Google Chrome, Safari and users were not given any embed code for the uploaded videos.

With the new iframe tag embedded in your website, the code will automatically detect whether you are using a browser that supports HTML5 or not.

The iframe code for embedding YouTube videos is as follows, simply copy the Video ID and replace in the code below:

<iframe type=”text/html” width=”640″ height=”385″ src=”http://www.youtube.com/embed/VIDEO_ID” frameborder=”0″>
</iframe>

Here is an example video embedded using the new HTML5 embed code:

Users will be able to view the embedded video in both Flash and HTML5 players, this depends on their viewing environment and browser preferences. You can find a complete list of HTML5 video players at this page

Please note that those videos which contain inline advertisements will be shown using Flash because HTML5 can not play the videos containing advertisements. The advantage of the new HTML5 embed code is that it will allow embed codes to work on various mobile devices, which use a built in player instead of either Flash or HTML5.

The new embed code is just a testing feature, more improvements are on the way. [ via YouTube API blog ]

Tags:
Author: Amit Banerjee Google Profile for Amit Banerjee
Amit has been writing for Techie Buzz since early 2009 and keeps a close eye on web apps, Google and all things Tech. He also writes at his own tech blog, Ampercent. Follow him on Twitter @ amit_banerjee

Amit Banerjee has written and can be contacted at amit@techie-buzz.com.

Leave a Reply

Name (required)

Website (optional)

 
    Warning: call_user_func() expects parameter 1 to be a valid callback, function 'advanced_comment' not found or invalid function name in /home/keith/techie-buzz.com/htdocs/wp-includes/comment-template.php on line 1694
 
Copyright 2006-2012 Techie Buzz. All Rights Reserved. Our content may not be reproduced on other websites. Content Delivery by MaxCDN