Mobile Video Solutions

[Michael Fienen]

Okay, so we just launched our new news pages that support video (ex: http://www.pittstate.edu/press-media/detail.dot?id=241226). Pretty happy with it all around, and it supports any video hosted locally, or remotely if it's based on oEmbed. There is also a video portal in the works as well. This has been a big step for PR, and a not insignificant commitment by them to start producing video to begin with.

The news page is a BIG improvement over our old ones, but naturally the first thing I hear this morning is a complaint: "Why doesn't it support iPhones?" We are using Flowplayer, which is Flash based... so you can do the math there.

So, I'm wondering what other folks are doing. If I support mobile video, I don't want to JUST support iPhone, because Android is nearly as big on campus. I'd much rather support *mobile video,* not just iPhone. I know YouTube and Vimeo have HTML5 support, but that also adds an extra step to PR's workflow that I can already see them not accounting for ("We need to put out this press release now, but the video needs an hour to process! What do we do?"), and of course you can't brand the third party players.

On the other hand, doing it ourselves means maintaining two players (or using VideoJS, which seems to be the only halfway happy solution ATM) and having to encode 4 video streams (FLV, OGG, h.264, WebM) if we want to make sure to support everything. Up until now, I've been pretty deadset that I didn't want to work with HTML5 video until they standardize on a single codec, but that's not a good excuse with UX is concerned. If the people demand it, the people will likely get it.

I'm curious what you are doing. Did you just bite the bullet to rely on a third party? Do you have the means to do it all yourself? Are you ignoring the issue for now? Are you just supporting a single device?

[Joel Goodman]

I think this is exactly why it took Vimeo so long to get their HTML5 player out - they need to support everyone. I just don't think there's a good solution yet.

But yeah, we bit the bullet. I don't really have many qualms about it either. Of course, I'm also making some of that video so I've adopted a "Plan ahead" mentality when it comes to news stories and campaigns that need video.

[Marc Westenburg]

Seriously? Android and iPhone are neck-and-neck on your campus? Not that i don't believe you, but do you have a stats rundown of current mobile usage and percentages that you'd be willing to share?

As for video, we've thrown all of our eggs thus far into the YouTube basket. It's free, it's searchable and PR has been completely on board with uploading any media to it. There is the sacrifice of a branded interface/player, but up to this point, that has been an acceptable casualty. Maybe that will change in the future. We simply don't have the time--nor could we justify it, even if we had it--to do multi-stream encoding.

Has anyone run into any handset/mobile browser vs. YouTube/Vimeo compatibility issues so far?

[Michael Fienen]

In the past month, we've had 3,350 iPhone visits and 2,786 Android visits.

[Marc Westenburg]

what percentage of your web traffic is mobile, then?

[Michael Fienen]

Total is about 2%

[Marc Westenburg]

similar here. we were about 1.8% mobile. our breakdown:

46% iPhone
22% Android
17% iPod
4% Blackberry

[Christopher Davison]

Here at OmniUpdate we ran into this problem as well (we display a lot of customer testimonials on our website: www.omniupdate.com). We choose to use a combination of several techniques that might be helpful to others. In short, we implemented a JavaScript based, HTML5, H.264, Flash combination. The javascript framework checks to see if H.264 HTML5 video is supported and if it is, it builds the HTML5 video tags accordingly. If the H.264 support is not available the javascript falls back on our H.264 Flash player to play the media.

We built a custom javascript video wrapper on top of the html5media JS framework using: http://etianen.github.com/html5media/. Our script checks for HTML5 compatibility and easily allows us to fall back on our Flash video player. We built a free service for this a few years ago that you’re welcome to use: www.transcodeit.com. But, as has been point out here, there are many great Flash players you can use.

We encode all of our video with Quicktime using the iPhone preset according to the guidelines found here: http://www.broken-links.com/2010/07/30/encoding-video-for-android/

Using this technique we've been able to provide videos on the following platforms:

iPhone / iPad
Android 2.2
Internet Explorer 7 & 8 (with Flash)
Firefox 2 & 3 (with Flash)
Safari 3 & 4
Chrome 6

I hope this information is helpful!

[Marc Westenburg]

Very helpful! I've already started discussion with my Design department to take some of these points into consideration (and development). Thanks!

[Michael J. Powers]

YouTube has been our mobile fallback so far--if there's no Flash available, we present a link to the YouTube version. Not quite as nice as having it embedded right in the page, but it works. (We also provide FLV and WMV versions when we have access to decent source material.)

We've been using the JW Player (version 4) on our site for some time, so I've been thinking of upgrading to their newer version and using their HTML5 player:

http://www.longtailvideo.com/support/jw-player/jw-player-for-html5

Does anyone have any experience with their HTML5 player? Comparisons with VideoJS?