Embed YouTube Videos In HTML5 [New YouTube Embed Code]

This post is mostly for bloggers. Since we're fans of HTML5 (or you could say we hate Flash, it's all the same), we decided to share this with our readers since a lot of them own a blog and this will make their readers happy since they no longer have to watch the embedded YouTube videos in Flash.

An update to the YouTube embed code which uses <iframe> allows your blog readers to view the video in whatever they have set in their YouTube preferences. This means that if they chose to view the videos in HTML5, embedding the videos on your blog / website using the new embed code will show up for them in HTML5 - just as if they were watching the video directly on the YouTube website.

This new YouTube videos embed code is not yet default, so you'll have to insert it manually. This is how the code looks:

<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0">
</iframe>

All you have to do is paste the code above in your blog posts and modify the VIDEO_ID with the id of the video you want to post (the video is is the numbers and letters after "watch?v=" in the video URL). You can of course edit the width / height in the code above.

Here is an example of an HTML5 embedded video (it's HTML5 only for those who enabled it):

[via YouTube API blog]