Posting videos on the web

Tim Carroll · March 21, 2017

Years ago I hosted a web site dealing with the Arriflex 16S cameras (www.Arri16S.com). I have another web site now that I would like to piggyback the pages from the original site onto, as I still get folks asking for the information. Problem is, the original site had dozens of videos (showing how different lenses; Cooke, Schneider, Zeiss, Angenieux, rendered), and they were all Quicktime 7 videos compressed with Sorenson Video Pro 3. The tests I've done so far lead me to believe that none of these videos will play anymore on the web. I keep getting "Missing Plug-in" when I try to view them.

What format are people using these days to embed video clips into their web sites? I see Vimeo and YouTube on a number of people's web pages. Is there a simple method (not a web designer) to convert these Quicktime 7 videos into something that folks can view on the web?

Thanks.

Best,

-Tim

Max Field · March 21, 2017

I see a lot of websites doing MP4 H264 nowadays.

Adrian Sierkowski · March 21, 2017

Well if you go Vimeo ( which i like) i would think you can just upload it directly and then use the embed code. If you want to keep it on your own servers, h.264 is really what you need.

Max Field · March 21, 2017

Yeah Vimeo's a good source too. If the quality of the visuals aren't super crucial; YouTube remains the most consistent embed source for buffering purposes.

Tim Carroll · March 21, 2017

I've been trying to make the H.264 MP4 work, but so far, no luck. I'm using a web editing software, Adobe Dreamweaver CS6, and it doesn't even have a selection for embedding MP4 video, all their choices are variations of Flash and SWF.

Can anyone post the embed code for embedding an M.264 MP4 video on the web?

Best,

-Tim

Adrian Sierkowski · March 21, 2017

why not just upload to vimeo and use their embed code?

Tim Carroll · March 21, 2017

The code above got it to work on Safari. Now to figure out how to make it work on Firefox.

Best,

-Tim

Landon D. Parks · March 21, 2017

I do web design, so I can probably be of some assistance here. The <video> tag is not the best option here. The easiest method as others have said is to upload the video to Youtube and/or Vimeo, and use the embed code in your website. The only two others options are to use Flash (which is no longer supported as a web-based technology), or buy/program your own media player back-end (which is overkill).

Landon D. Parks · March 21, 2017

Just a side note: There is not a universal code for embedding MP4 videos into a website. MP4 videos still require a player of some sort to play. When you upload to Youtube and embed into your site, you are not just embedding the video - you're embedding Youtube's HTML5 video player, which happens to also play MP4 files.

If you're not willing to use Youtube and/or Vimeo and embed the player, you'll need your own video player to host on your site. You can make these (overkill) or you can buy an HTML5 player from a marketplace. The problem with this method is that it's more complicated to setup, in that you need to upload files to your web server, and configure the player itself.

So much simpler to just embed a Youtube or Vimeo player. In all honesty, I'd say 99% of websites do this now anyway; the only sites that should be focusing on their own players are those who host a large multitude of videos that require features not available in an embeded player like Vimeo or Youtube.

Tim Carroll · March 21, 2017

What happened to the old days when you could just upload a Quicktime movie (.mov) and everyone could view it? When did that go away, and why?

Best,

-Tim

Sam Javor · March 21, 2017

well basically to needed a lot more software packages to make it work... and the end user isn't necessarily going to have access to the required software particularly while all the early codecs used by internet media were still patented.

It's a lot easier to say that play back requires a 'modern browser' (ie if you can view youtube you can view this video) versus quicktime version whatever. Everyone had multiple media players installed for this reason... quicktime player, real player, winamp, VLC, Mplayer - and shockwave flash viewer for the real jerks :) - You probably shouldn't have quicktime and flash installed anymore because of security threats... Real Player I think became associated with malware... VLC and MPlayer are still going strong though...

John E Clark · March 21, 2017

Just a side note: There is not a universal code for embedding MP4 videos into a website. MP4 videos still require a player of some sort to play. When you upload to Youtube and embed into your site, you are not just embedding the video - you're embedding Youtube's HTML5 video player, which happens to also play MP4 files.

If you're not willing to use Youtube and/or Vimeo and embed the player, you'll need your own video player to host on your site. You can make these (overkill) or you can buy an HTML5 player from a marketplace. The problem with this method is that it's more complicated to setup, in that you need to upload files to your web server, and configure the player itself.

So much simpler to just embed a Youtube or Vimeo player. In all honesty, I'd say 99% of websites do this now anyway; the only sites that should be focusing on their own players are those who host a large multitude of videos that require features not available in an embeded player like Vimeo or Youtube.

HTML5 compatible browsers should have a HTML5 player as part of their support.

The browsers I use:

Safari

Firefox

Seamonkey

Chrome

As well as mobile devices:

iPhone

iPad

Android things...

All can play '<video>...</video>' media without any addon. There probably should be code to test to see if the browser supports HTML5. The mentioned formats are, MP4, WebM, and OGG. For others such as Flash, that's when one will need an additional 'player'.

For example:

Your browser does not support the video tag.

</video>

Now, there are things about the Youtube 'player' which I do use, and have not figured out how to do for my stand alone needs, in particular what are called 'Nerd stats'... but otherwise my media plays on these devices... and in particular, even when the box or local segment of network is 200 miles from the nearest 'internet' connection.

I hate things Microsoft, so at the moment I've not bothered to test compatibility with my stuff and IE, nor 'Windows Surface' tablets, or whatever is the next big thing from Microsoft... Eventually I'll have to make sure Windows stuff... but life's too short to keep up with the vagaries of Microsoft.

Here's a brief discussion on HTML5 Video and some simple examples.

https://www.w3schools.com/html/html5_video.asp

Edited March 21, 2017 by John E Clark

John E Clark · March 21, 2017

What happened to the old days when you could just upload a Quicktime movie (.mov) and everyone could view it? When did that go away, and why?

Best,

-Tim

Those days were fraught with even more problems. In order to play a MOV file... one had to have Quicktime lurking somewhere... and for Flash... obviously Flash player... etc.

Then there was the problem of compression, still is... but not trying to get a clip to play on a 14.4 Kb line...

Bruce Greene · March 21, 2017

I upload my videos to Vimeo and imbed them into my web page and it seems to work very well on most devices. And the quality is quite good and allows for full screen viewing if one checks the full screen box.

You can see the result here: http://brucealangreene.com/clips.html

Timothy Sewell · March 22, 2017

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">

<source src="movie.ogg" type="video/ogg">

Your browser does not support the video tag.

</video>

This is your key to getting the video to play in different browsers. I forget which is which, but I seem to recall that Firefox isn't licensed for MP4 playback.

Whatever - the absolutely key reason you should upload to a video streaming service like Vimeo or YouTube is that every time a user of your website views a video the crazy amounts of bandwidth usage will accrue to the video streamer, not your webhosting account (I'm assuming you don't have one of the 'unlimited bandwidth' accounts, which are nearly always not worth the money).

PS. I'm a web/software developer of some 12 years standing.

John E Clark · March 22, 2017

This is your key to getting the video to play in different browsers. I forget which is which, but I seem to recall that Firefox isn't licensed for MP4 playback.

Whatever - the absolutely key reason you should upload to a video streaming service like Vimeo or YouTube is that every time a user of your website views a video the crazy amounts of bandwidth usage will accrue to the video streamer, not your webhosting account (I'm assuming you don't have one of the 'unlimited bandwidth' accounts, which are nearly always not worth the money).

PS. I'm a web/software developer of some 12 years standing.

Yes, Mpeg/MP4 has licensing/patent concerns, which has limited some support by those browsers which are 'open source'. So there may be a question of which codec, to which level, etc. Firefox, Chrome, Opera may support HTML5 and MP4 content, depending.

Here's the Mozilla blurb on the topic:

---

Patented media

MP3, AAC, and H.264/MPEG-4 AVC are patented audio/video compression formats. They can be viewed in Firefox using built-in OS libraries (so neither Mozilla nor you need to pay a fee) if embedded in the MP4 container format (.mp4, .m4a, .m4p, .m4b, .m4r, .m4v file types).

Firefox supports WebM/VP9 video on systems that don't support MP4/H.264.

Tip: In order to test your system, some sample video files are available in the “Video For Everybody” Test Page at camendesign.com.

---

From: https://support.mozilla.org/t5/Customize-controls-options-and/HTML5-audio-and-video-in-Firefox/ta-p/3650

----

Part of my 'box' package, for a radio destined to be installed in the 'ugly' places on earth, I have to make everything self contained. Most people of course can use Youtube/Vimeo, and perhaps develop based on the respective APIs from each for 'special' interfaces.

Landon D. Parks · March 22, 2017

One thing to note: If your using HTML5-specific tags, the only way to guarantee they work is to ensure your webpage has the correct HTML doctype for HTML 5, otherwise the HTML features you implement on your website might not work even on an HTML5 browser. I have never heard of the <video> tag other than on some forums, so I can't speak to that tag directly. I can say however that the correct method would be to implement a real HTML5 back-end player, and ensuring your page doctypes are correct for the version of HTML you're using.