≡ Menu

HTML5 and The Video Element

As a film maker you may not care about coding web sites – unless you’re planning to distribute your film on the web. Oh, yeah – that’s pretty well everyone, right?

Vimeo.com and youtube.com both have HTML5 in beta. It’s time you learned something about what this means to you.

I’ll make this as simple as possible – learn to create H.264 video for online distribution. Now for the back story…

Flash video players used to rule the web. 98% of all web browsers come with a Flash video plugin. No other video player even comes close to this level of penetration.

But Flash has problems, way too many to go into here. One serious issue was that it would only play Flash video, a proprietary video format licensed by Adobe.

Flash video does not provide the best online video experience. It was created to handle small graphic animations, not streaming HD video.

A year ago Adobe upgraded the Flash player to handle H.264 video so you no longer needed to use the proprietary .flv video format. Which was a very good thing as H.264 provides a much higher quality online experience in every way. And you can compress your video to H.264 using most any video editor as it’s an industry standard.

All’s fine and well then along comes the iPhone.

Actually, all kinds of smart phones with extended web access but without the ability to use a Flash player. That’s why it was a big deal when youtube.com worked with Apple to create a youtube app for the iPhone.

Within a few weeks of the release of the iPhone 3Gs uploads to youtube.com soared by 400%. Good thing you could watch all those videos on the same iPhone you shot them on, right? But you couldn’t watch them if you uploaded them to most any other video server.

All that changes with HTML5.

Again, the bottom line as a film maker is learn how to compress your final render to H.264 for web distribution and upload to Vimeo or youtube and you’re good to go. On your blog or site you’ll need to look for plugins or work with your programmer. I just added a cool WordPress plugin to this site and it’s now iPhone compatible.

While the videos I embed don’t play inside a post, the links to Vimeo are functional and all Vimeo videos do play on the iPhone. I checked out an HTML5 plugin for WordPress but I like the “share” options built into my current Flash player so I’m staying with Flash for a bit longer.

Right now most HTML5 projects on sites like Vimeo and youtube are labeled as experimental. That’s because Internet Explorer browsers can’t work with HTML5. As more than half of the people on the web use IE you don’t want to create a site that won’t work for the majority of your visitors.

But this is true of many other web technologies besides HTML5. I don’t remember the first time I built a site that had to have special code just for IE browsers but it was many years ago.

Every time I get the chance I recommend using the FireFox browser. Personally, I use both Safari for my normal browser and FireFox for site development or for sites that won’t function on Safari. The latest version of both browsers are compatible with HTML5.

So, update your browser, head on over to Vimeo.com or youtube.com and click on the link to change to HTML5. Chances are you’ll be underwhelmed. It just plays like normal. But the coding going on under the hood is significantly different and the page is likely to display on your iPhone pretty well just like on your computer. That’s pretty cool.

If you want to learn a bit more about HTML5 here are some useful links:

Learn to compress H.264 video for online distribution and you be in good shape. At least, until online media evolves again. And again. And again.

{ 6 comments… add one }

  • DP March 3, 2010, 5:15 am

    I agree, but I think you understanded how much faster HTML5 loads vimeo files. There’s no more buffering, videos just magically start. I have trouble loading my videos on corporate LAN lines in Flash but in HTML5 its like its already loaded when I click play. Go HTML5!

    • Adriel Brunson March 6, 2010, 6:30 pm

      The more you learn about Flash the more you want to use HTML5 for playing videos. I think your experience tells the tale!
      Thanks!
      -a-

    • Adriel Brunson March 6, 2010, 6:30 pm

      The more you learn about Flash the more you want to use HTML5 for playing videos. I think your experience tells the tale!
      Thanks!
      -a-

  • DP March 3, 2010, 5:15 am

    I agree, but I think you understanded how much faster HTML5 loads vimeo files. There’s no more buffering, videos just magically start. I have trouble loading my videos on corporate LAN lines in Flash but in HTML5 its like its already loaded when I click play. Go HTML5!

  • DP March 3, 2010, 12:15 am

    I agree, but I think you understanded how much faster HTML5 loads vimeo files. There’s no more buffering, videos just magically start. I have trouble loading my videos on corporate LAN lines in Flash but in HTML5 its like its already loaded when I click play. Go HTML5!

    • adriel March 6, 2010, 1:30 pm

      The more you learn about Flash the more you want to use HTML5 for playing videos. I think your experience tells the tale!
      Thanks!
      -a-

Leave a Comment