Clever Geek Handbook

Mobile HTML5 video format, video size and FPS

I am about to create a mobile site using HTML5 and want to use an HTML5 tag.

I want the site to work with iPhone, iPad, Android and other smartphones / devices.

  • Which video format should I choose? mp4?
  • What size should you use for width and height for best results?
  • What FPS (Frames Per Second) should be used for video?

Thanks in advance.

+3


source to share


1 answer


These are pretty subjective questions, so I'll give you some pretty subjective answers:

  • I made a good experience (hopefully others too ) serving 3 types of media: H264 / MP4 , OGG and WEBM for elements , at least this combination has worked great on all devices I have been able to test so far. <video>

  • If you also want your video to display embedded in desktop browsers, I would say that you should use the dimensions that are dictated by your layout. If you are looking for a solution for mobile devices, the total resolution for 16: 9 content will be 480x270 (which is what Quicktime Pro exports when you select "Save for iPhone"), if you plan on supporting tablet, you may also want to serve alternative content for them.
  • The lower the frame rate, the smaller the file, so you have to know how many files matter yourself, the only thing I could recommend is to use the full portion of your original video frame rate (e.g. 12.5 fps if you want to reduce the source 25fps) because otherwise you will get a drop jitter effect.


Also see Dive in HTML5

+2


source






More articles:


All Articles