• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
1

Best video format to post to web?

Guest
Apr 22, 2011 Apr 22, 2011

Copy link to clipboard

Copied

I created a site featuring artists around my city. The most important thing is the videos and that is what I am having trouble with. Can you help?

I started with flv files turned swf and that was ok. The problem was it would not play on IPAD's and other devices.

So, I read online that a mov file or mp4 was good. I got so many responses today from people who said the video was so slow that they didn't even watch.

I tried to increase my size to a size close to youtube so it was more visible then my first posts.

The site is

www.adamsstreetsessions.com

Thanks in advance

Views

21.3K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Mentor , Apr 22, 2011 Apr 22, 2011

Currently .flv is the best video container format for the Web...

As a fallback use swfobject for Flash detection and provide a .mov file as alt content.

Link to swfobject:

http://code.google.com/p/swfobject/

Sample .flv video page that plays on the iPhone:

http://www.cidigitalmedia.com/tutorials/qt/play_qt.html

fallback is .mov file. View the source code to see how this works.

One potential problem of slow download of .mov files is if the moov atom is at the end of the file rather than the beginning...

...

Votes

Translate

Translate
Guest
Apr 22, 2011 Apr 22, 2011

Copy link to clipboard

Copied

Video is a science that depends on many factors, all of which have been unmentioned by yourself. Duration, size, bitrate, intended audience all play a factor into determination of format. There isn't one magic answer. If there were then there'd only be one video format.

You want your videos to look like YouTube's? The obvious solution is to use YouTube then!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Mentor ,
Apr 22, 2011 Apr 22, 2011

Copy link to clipboard

Copied

Currently .flv is the best video container format for the Web...

As a fallback use swfobject for Flash detection and provide a .mov file as alt content.

Link to swfobject:

http://code.google.com/p/swfobject/

Sample .flv video page that plays on the iPhone:

http://www.cidigitalmedia.com/tutorials/qt/play_qt.html

fallback is .mov file. View the source code to see how this works.

One potential problem of slow download of .mov files is if the moov atom is at the end of the file rather than the beginning.... Hey, I'm not making this stuff up, I'm just telling you about it. The download is not slow, it's just that the entire file has to download before it plays. If the moov atom is at the end of the file, the entire .mov file needs to be downloaded before the video will start to play. It will not progressive download like an .flv file will (another reason why .flv is the video container of choice).

You can re-structure .mov files if needed using QuickTime Pro, and do a Save As.

Google for exact details or check here:

https://www.ezs3.com/members/login.cfm?hpage=Checking_Metadata_or_Moov_Atom_Location.cfm

If the video bitrate and/or dimensions is a problem, review this from an old post:

Video bit rate

One of the principle of goal setting is to "Begin with the end in mind". In this case it'll be very hard to give good recommendations because the end is not defined. So I'll just make a few assumptions and you can correct me as needed.
First, I'll assume that since you are converting to Flash, you want to deliver this video over the Internet. If that's true, then we'll have to make some assumptions on the Internet connection download speeds of your potential viewers. Let's just say that most have at least a 1.5Mb connection or faster.
OK, that would mean that a video bitrate of half that should usually provide a video download that is not interupped by buffering (most of the time anyway). So assuming a video bitrate of 750kbps, what would the optimum display dimensions be?
Before we decide, here's a little info about bitrate. For highest quality playback, the video bitrate is tied directly to the display dimensions. That is, the larger the display, the more incoming data is required to properly display the video. Think of bitrate in terms of a can of paint. If you have 1 quart of paint, you might be able to do a very nice job on a 32 X 24 foot area. But if you try to stretch that same amount of paint out over a 64 X 48 foot area, the coverage will not be nearly as good and you get poor results.
In the same way, a video displayed at 640 X 480 pixels will require 4 times the bitrate as a video displayed at 320 X 240 pixels to produce the same quality. So for example a video with a bitrate of 100kbps, displayed at 160 X 120 will produce the same quality results as a video with a bitrate of 1600kbps if displayed at 640 X 480.
So to boil it all down, video bitrates of 750kbps, even up to 1000kbps can usually get delivered of the Internet on most high speed connections. Higher bit rates may work for really fast connections but will cause problems for viewers with slower connections. Video display size has a direct bearing on the final quality. In the 750 to 1000kbps range, display size should be kept around 450 or 500 width max (and whatever height the aspect ratio calls for). Yes it can be displayed larger, but the quality will suffer.
Sound like your audio settings are fine, especially for Internet delivery.
As for framerate, maintain the original raw video framerate for best results. So if the video was shot at 24fps, leave it.
As for video converters, do you have the Flash 8 Video Converter? It works just fine for video to be delivered over the Internet. Remember, you are taking a Cadillac version of video (h.264 HD) and stuffing it into a Chevy body to get it to work over the Internet.

Best wishes,

Adninjastrator

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Apr 23, 2011 Apr 23, 2011

Copy link to clipboard

Copied

This is such a great and helpful response! Thank you so much!! Now I have to put all this info into action... Working with the web has hurdles around every corner it seems! People helping out, like you, are such a godsend! Thank you and everyone helping out on forums like this!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jul 22, 2013 Jul 22, 2013

Copy link to clipboard

Copied

LATEST

Hello,

There is so much information that is kind of overwhelming, please help me.

This is my case:

  • I have finalized a book that requires explanatory videos
  • These videos will be accesible only to members that purchase the book and videos
  • Videos cannot be downloaded or maybe yes, I am not sure on this yet, but will try to prevent them from being just passed onto others.
  • Videos must be accesible to all kinds of technologies
  • There are like 15 videos most of them are less than 5 minutes, one is 35 minutes and another one is 45 minutes long.

Sooo,

What is the best format please to make these videos?

What would it be the best compression rate?

Eventually the videos will be available on a CD format to be sent to individuals.

Please advise and many thank yous for your time,

Leonardo

www.LifeEnjoyer.com

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Feb 01, 2012 Feb 01, 2012

Copy link to clipboard

Copied

Hey everyone. I just found this post and was wondering if anyone know if this will work with Shadowbox.js 3.0.3. A quick explanation, I built my site in Dreamweaver CS5 and the portfolio section, using Shadowbox, has some Flash banners and Quicktime videos among a lot of png files. I am trying to find a way to make sure these are all visible on most, if not all, devices and platforms. ie, Mac, PC, iPad... If you're still out there and get this message, any help would be greatly appreciated.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 01, 2012 Feb 01, 2012

Copy link to clipboard

Copied

Short answer.  Flash is not supported by Apple iDevices (iPhone, iPad, iTouch) among others.  You would need to provide alternate content for  non-flash supporting devices & browsers.

See Shadowbox's Support Page for details:

http://www.shadowbox-js.com/support.html

 

Nancy O.

Alt-Web Design & Publishing

Web | Graphics | Print | Media  Specialists 

http://alt-web.com/

http://twitter.com/altweb

Nancy O'Shea— Product User, Community Expert & Moderator

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Feb 01, 2012 Feb 01, 2012

Copy link to clipboard

Copied

Thanks Nancy. Yeah, I know iPads, iPhones, etc. don't support Flash. That's why I'm trying to find a solution for multiple ways to view based on device detection. My solution so far has been to just export all Flash files to Quicktime and have everything play that way. Maybe I'm not getting what they say in the shadowbox support page, but it seems like they are saying that I need an extra plug in for this. I thought this informative post may have been a better way.

On another note, I also notice that when gallery examples are too large and supposed to have scroll bars, those scroll bars don't show up on mobile devices. (ie. when showing an example of a different website within shadowbox.) Almost seems that I might have to build 2 sites; 1 for computers and 1 for mobile devices.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Nov 13, 2012 Nov 13, 2012

Copy link to clipboard

Copied

Why don't you use the JW player (longtailvideo). it selects automatically the best playback for your viewers device. Either flash or HTML5.

See: http://www.longtailvideo.com/jw-player/

Regards,

Emiel

http://www.itzit.com

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 13, 2012 Nov 13, 2012

Copy link to clipboard

Copied

This thread began in 2011.  Much has changed since then. 

My current media player of choice is Pickle Player.  No more need to render & host multiple file types on the server -- ogg, webm, mp4, flv, etc... Pickle works with just one file type --  M4V video or MP3 audio which saves time and bandwidth.

Nancy O.

Nancy O'Shea— Product User, Community Expert & Moderator

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines