View Full Version : Video to website - man, I don't even know the right questions to ask


Bob Warner
May 2nd, 2011, 04:01 PM
Okay, so after 27 years I figured our K-6 school needs a website. I'm pretty good with Photoshop so I've designed the site and will now get with a developer to put it up.

I have two video-slideshows, 3 minutes and 4 minutes, which were made with iMovie 6. Simple stuff - high quality photos with normal cross-dissolve transitions and very slow Ken Burns effect. Paid for the music. So I want these videos to open up on my website.

I understand one way is just to have YouTube host the video. I think a little "YouTube" logo appears on the bottom right of the video. I put the video up to YouTube and the web developer can just take it from there. Not crazy about this.

2. If I don't want a little logo from some other business on my video, then I have to have some sort of player embedded on my own site, is that right? I think I don't want Flash as that can't be played on iPhones and I THINK there are other formats besides Flash which deliver high quality. I've heard good things about DV Kitchen and x. 264. I've seen their demos and they seem very high quality and play easily on my computer (3+ year-old MacBook Pro).

So, I know where I'm starting - 2 iMovie videos. I don't know what my final output should be (what I'll give to the web developer) or how to get there, using DV Kitchen or something else. If someone has some recommendations, fine, otherwise, where can I learn the best way to get from A to B? Actually, if it's something complicated, I'm happy to pay for a pro to do it, but I don't what type of professional does video conversions - where do I look in the yellow pages?

Bob

Bob Warner
May 2nd, 2011, 04:24 PM
Like I said, I'm confused.

I thought iPhones can't play Flash video, but aren't YouTube videos Flash? And I can see YouTube videos on my iPhone.

So do I want/have to have Flash video for my website, or is there something better?

Seth Bloombaum
May 2nd, 2011, 06:49 PM
The target is constantly changing. Apple helped create a big friggin' mess with their closed product marketing approach to video in iOS browsers. They have become the target of their "1984" commercial... OK, that's opinion, but the fact is it's still a big mess for content creators!

Take a look at this thread, http://www.dvinfo.net/forum/what-happens-vegas/494169-website-hosting-video.html , especially the code in post #20. That code refers to three different encodes of the video "Horse", for five different browser types, 3 html5 and 2 "conventional" browsers.

Ack.

If you want to serve video to iOS and other browsers, you're going to have to do these kinds of tricks, or, use a YouTube sort of service where the browser is sniffed out by the server, and the appropriate content is delivered automatically.

But I agree with you - use of YouTube gives YT a toehold in your web site, from which a user might follow some "related videos" link that takes them away from your site.

Perhaps there's another service that offers the browser-sniffing method...

Les Wilson
May 3rd, 2011, 07:32 AM
Get a plus account on Vimeo. There's a checkbox to make mobile versions of your video. You can also control what things show up on your school's page that embeds it....including the Vimeo logo

Seth Bloombaum
May 3rd, 2011, 10:37 AM
Les, have you seen vimeo mobile?

As it happens, I have a plus account, never paid much attention to the mobile checkbox since mostly I use vimeo for client reviews.

I've created a page (http://sws.pcc.edu/instructor/sbloomba/vimeo.htm) that embeds a clip from vimeo, and should be prepped for mobile (?). I turned off all the the identifiers I could with a plus acct., and see that one can still right-click to go to vimeo, but see what you think.

Not having iPhone/iPad or even Android here, I'd be interested to read any comments from mobile users. I'll leave this page up for a couple days...

Bob, if this works as you wish it to, it might be a good solution for you. Fairly inexpensive, much better controls for content creators, etc.

However, YouTube also has its benefits - the big one is that there are a lot of viewers that YT gives you access to!

PS. Yes, these are Oregonians, and they're racing giant pumpkins! I love this place!

Les Wilson
May 3rd, 2011, 05:37 PM
Les, have you seen vimeo mobile?...

Yes...I create content using it and consume it on my iPhone. Clients have iPhones and iPads. Here's a recent one:

Boca Raton Community Church Video | On the Ground in Haiti (http://www.starfishtreasure.org/media/pages/starfish_inhaiti.php)

A million of nothing is still nothing. I don't think hosting a video on YouTube will benefit the OP site in any way. Other types of video, may.

I personally find the search results on Youtube very commercially driven. Vimeo on the other hand has done a nice job using tags, channels and groups for creating a social network. I can find what I want quickly and not have to sift through stuff being promoted by the creator that isn't necessarily a close match to what I'm searching for.

I don't know if YouTube has copied this feature from Vimeo yet but when I watch an HD video on my 1920x1280 screen, I can turn off scaling so it isn't scaled up. YMMV

Seth Bloombaum
May 3rd, 2011, 05:56 PM
A couple of associates were at my place this afternoon, and between us we had a verizon android phone (3g), iphone (at&t 3g), and iPad (wifi).

We looked at the page I threw together (http://sws.pcc.edu/instructor/sbloomba/vimeo.htm) on all three devices:

Worked on all three! The basic functionality of take a single line of embed code from Vimeo, throw it on a web page, and see that page / that video on three common mobile devices does work.

Both 3g devices had what I would consider unacceptable buffering, both before and during playback. Vimeo did *not* seem to scale my original 720p to a size/bandwidth appropriate to 3g mobile distribution. We're talking over a minute before first play, and when the moving pictures begin (this clip starts with a series of stills), another :45 or more of buffering.

iPad on wifi was really an excellent experience - good performance v-v buffering, good picture, etc.

All of us viewing thought that the picture quality was excellent on all three devices.

We'd expect that if we'd gotten the iPhone and Android phone on wifi we would have seen acceptable performance.

Les, all of this makes me wonder what your experience of your 720p Haiti video is on iDevices? How is buffering? Are there methods I'm missing to cause a downward scaling of size/bandwidth for mobile from Vimeo?

Les Wilson
May 3rd, 2011, 07:51 PM
On DSL based wifi, that 11:42 video buffers for 4 minutes on my iPhone 3GS and plays without interruption to the end. It is not the 720p version of the video as I can see some compression artifacts that aren't seen in what I watch on desktop (which buffers for 5 seconds on the same DSL connection). Also, the HD option is not displayed on the web page when viewed on the iPhone so I think it's fair to say that Vimeo is down-rezzing for mobile.

Seth Bloombaum
May 4th, 2011, 10:57 AM
On DSL based wifi, that 11:42 video buffers for 4 minutes...
That's of great concern to me. Very much at odds with what we're trying to do with streaming video as part of a web browsing experience on broadband-connected computers. If I were looking specifically for that video, many times I'd be willing wait that long for it. In the normal course of browsing, and discovering a potentially interesting clip I'd probably be gone and doing something else after maybe 30 seconds.

It is not the 720p version... some compression artifacts... the HD option is not displayed on the web page... Vimeo is down-rezzing for mobile.
I'll have to look more carefully here, perhaps upload a new clip rather than use something existing. Possibly my older clip wasn't processed for mobile, because it appeared we were looking at good 720p. This clip is a demanding test that includes test patterns, moving water, smooth motion, and people...

Les, thanks for sharing your experience here. It's all very interesting. Difficult to ascertain exactly where we are with video in web pages for conventional browsers and HTML5, change is rapid! I hope the original poster is getting something out of this discussion - I sure am!

Les Wilson
May 5th, 2011, 12:35 AM
There's no magic. To play a video without pausing, the device has to buffer enough before starting to play. The amount of buffering is a function of the data-rate of the movie, the data-rate of the connection, and the length of the clip. A shorter clip will start to play sooner. A lower data-rate video will start sooner. A faster connection will start sooner....you get the idea.

Seth Bloombaum
May 5th, 2011, 10:41 AM
Well, yes. Bitrate is everything in this situation, or, so I tell students in my Streaming course.

However, in the comparison of YouTube and Vimeo as video hosting providers for mobile devices on 3G, YT does have very robust automatic scaling of size and bitrate. My point is that Vimeo's does not seem to be even in the same ballpark.

An end-user only cares about their experience. How much buffering will they tolerate? A computer user on broadband is used to perhaps 5 to 30 seconds. How many mobile users will accept 4+ minutes of buffering for your Haiti clip?

Conventionally speaking, from a perspective of user experience on computers, 4 minutes of buffering is unacceptable, and a client or sponsor or content provider should be looking for a better solution! I have to ask - is it better to show still pictures that build in a few seconds, or a video clip that creates a frustrating experience for the user?

YouTube does this by taking my 720p clip and encoding it to 4 sizes. I'm still trying to figure out what Vimeo does. I'm very interested to test and benchmark through YT, Vimeo, and this sort of approach - http://www.dvinfo.net/forum/what-happens-vegas/494169-website-hosting-video.html#post1637353.

As rocky as the road to html5 and mobile video seems to be, I feel that it is increasingly important for online video content providers...

Les Wilson
May 5th, 2011, 09:30 PM
Well, yes. Bitrate is everything in this situation, or, so I tell students in my Streaming course....Conventionally speaking, from a perspective of user experience on computers, 4 minutes of buffering is unacceptable, and a client or sponsor or content provider should be looking for a better solution! ...

Well, Bitrate is not everything. Connection speed is as important a factor.

Just so there's no confusion. That 11 minute clip buffers in 5 seconds on a computer. Your clip buffers in 30 seconds on my iPhone. On a lark, I retested the 11 minute Haiti clip and it buffered in 25 seconds on my iPhone.

Previously, my wifi must have been turned off so the iPhone was using Edge when it buffered for 4 minutes. Thus illustrating connection speed matters.

For the OP, Vimeo has advantages. One of which is that it doesn't have the cheesy YouTube watermark. I can't tell if you are a smartphone user or not. YouTube has been troublesome for me on mobile to the point I've given up on it. YMMV

Seth Bloombaum
May 6th, 2011, 10:10 AM
Well, Bitrate is not everything. Connection speed is as important a factor...
We're saying the same thing. Sorry to have expressed myself unclearly. It is the match (or lack of match) between Bitrate and connection speed which is "everything". Which is another way of saying that a user has a certain patience for initial buffering and subsequent buffering - and you're right, in that there is a lot of variation, their mileage will vary indeed!

Still, though, this has been a very valuable discussion for me. Here are my takeaways:
* The patience of mobile users will be somewhat greater that the patience of computer users.
* The viewing experience on mobile can be very good indeed, once buffering is settled.
* Tablet users are always wanting wifi connection.
* Smartphone users who are hip to video want wifi.
* 3g coverage in a particular location (network choice) is a bigger factor in video performance than the choice between iPhone or Android.
* What YT and Vimeo do to prep video for mobile use isn't transparent, and isn't well known. It would take some considerable research to figure this out, and of course it will change.
* YT has been troublesome for Les on mobile, and, presumably others.
* Vimeo's mobile service does work well for wifi-connected mobile devices.
* It's unclear whether a Vimeo or YT member can do much to improve the viewing experience of their clips on 3g.

Research continues...

Larry Reavis
May 8th, 2011, 05:01 PM
I just loaded my first video onto my Vimeo Plus account 2 days ago (The Encounter; and The Visit - Paramahansa Yogananda Teaches Me Kriya Yoga on Vimeo) and just now tested it on a cheap Android phone (the GT240). In contrast to my YouTube videos which start playing almost immediately on this phone, the entire video was first downloaded from Vimeo onto my micro SDHC card before Android could play it; then it played flawlessly.

The same video starts playing almost instantly with my Linux/Ubuntu version of Firefox. I'm using a wifi connection for the Android, and an ethernet/DSL connection for my Linux/Ubuntu (which actually is a virtual VMWare machine playing inside of Win7-64 bits).

Obviously, the Android always is going to take longer to start playing - given the fact that it downloads the entire video before beginning to play it.

Question: Those of you who have videos on Vimeo, have you been able to get them to stream and start playing as fast as YT videos on mobile devices?

Another question: If you have been able to get videos to play from your own website on mobile devices, could you please post the HTML code? I've tried to do that without success on my website (www.toreallize.net).

Les Wilson
May 8th, 2011, 06:24 PM
Your video starts playing on my iPhone after 25 seconds on Wifi. There's a button on the Vimeo video <embed> that when clicked gives you the code. Did that not work for you?

This is the code for your video (without the leading "!" I put there to keep DVinfo from embedding the video):

!<iframe src="http://player.vimeo.com/video/23393588" width="400" height="300" frameborder="0"></iframe><p><a href="http://vimeo.com/23393588">The Encounter; and The Visit - Paramahansa Yogananda Teaches Me Kriya Yoga</a> from <a href="http://vimeo.com/larrydreavisphd">Larry Dominus Reavis</a> on <a href="http://vimeo.com">Vimeo</a>.</p>

Larry Reavis
May 8th, 2011, 10:21 PM
@ Les Wilson:

I'm totally new to Vimeo - thanks for the tip, will try to understand this.

Question: Did you intend for all the code to show in your post? Or was that code supposed to provide a link or something? So sorry, I'm a bit lost regarding the intended purpose of that code - to wit:

!<iframe src="http://player.vimeo.com/video/23393588" width="400" height="300" frameborder="0"></iframe><p><a href="http://vimeo.com/23393588">The Encounter; and The Visit - Paramahansa Yogananda Teaches Me Kriya Yoga</a> from <a href="http://vimeo.com/larrydreavisphd">Larry Dominus Reavis</a> on <a href="http://vimeo.com">Vimeo</a>.</p>

Les Wilson
May 9th, 2011, 04:45 AM
Take the exclamation point off at the beginning and copy/paste all that code into your webpage inside the body section of the html.

That code uses an HTML technique called an iframe for the actual video. There's some additional HTML code that displays text links for the title, your name and the Vimeo site

Seth Bloombaum
May 9th, 2011, 09:54 AM
<iframe src="http://player.vimeo.com/video/23393588" width="400" height="300" frameborder="0">
</iframe>
<p>
<a href="http://vimeo.com/23393588">The Encounter; and The Visit - Paramahansa Yogananda Teaches Me Kriya Yoga</a> from <a href="http://vimeo.com/larrydreavisphd">Larry Dominus Reavis</a> on <a href="http://vimeo.com">Vimeo</a>.
</p>


The "code" block above is a rather handy feature of this forum. To use it, use square brackets around an open code tag, and a close code tag, eg. code and /code (with square brackets around each).