A site I’m building is written in HTML5 (my idea so that we can take advantage of new features as they are available). It’s a very simple site. One of the requirements however is that the video embedded on one of the pages play in the iPad and iPhone. Currently, many of my clients prefer to use YouTube to upload their videos and then embed that video into their site. It’s a lot simpler for them when they maintain their own site.
As things are moving quickly in this particular realm (can you say daily changes?), I did a little research to see if I could pull the HTML5 encoded (H.264) video over from YouTube and put it into the video tag. After a bit of searching the web and reading YouTube’s site, what I found was that you can choose to view the videos as HTML5 (H.264 only) on their site only. You can not link to or embed them as H.264. The only embed code available is Flash.
You can’t grab an H.264 embed from YouTube
I then told my client that we’d have to encode it ourselves and gave him the option of using Flash for everyone w/H.264 fallback for iPhone and iPad or encoding as Ogg for FFOX/Opera, H.264 for WebKit/Chrome (though Chrome does Ogg as well) and still falling back to Flash for older browsers and Internet Explorer.
Meanwhile, my client, a tech person with an iPad did a little experiment. He put an embedded YouTube video into a page, viewed it with his iPad, and it worked. And no, it didn’t open the QuickTime player (like it still does on the iPhone). It played inline in the page exactly where he put it. *headdesk* (I reckon Steve figures he can make a good bit of money if every developer has to own an iPad to test—since everything’s unique there. I haven’t bitten. I’m waiting to see how the Android pad evolves since I like my husband’s Nexus One better than my iPhone.)
iPads will play YouTube Flash embeds
Turns out that, though many of us were unaware, the Flash embeds from YouTube are served as H.264 video when YouTube detects an iPad or iPod. Or more likely the iDevice itself grabs something it needs from the embed to display the H.264 video. I can’t be certain because I’ve not found anything from Apple or YouTube that clarify this. But regardless of how it works, I can confirm that if you can place a YouTube Flash embed into your page, it will work on iPad and iPhone.
No other device or browser will play the embed as H.264
I can also confirm that the same is not true with Safari or Chrome—browsers that are capable of playing H.264 video. They will continue to render the Flash video.
So the moral of the story is—if you don’t want to encode in three ways in order to take advantage of the amazingness of the new video element in HTML5, but only care that your video is shown on iPads and iPhones, who have blocked Flash, YouTube embeds currently work. iDevices are solved, but anyone who doesn’t have Flash installed (about 3-4% of users) and users that block Flash (unless they use a blocker with a click to unblock feature)—they still will not see your video. So we’ve not really provided “HTML5 video” at all. We’ve just provided a format that iPads and iPhones can see since they’re special.
I’m really looking forward to the day the spec is worked out and browsers have agreed on a codec. Until then, it feels like the days of the browser wars, which simply means more work for developers—and clients that don’t want to pay for it.
