<p>There's a table <a href="http://fmbip.com/litmus/#mdz_video_h264" rel="nofollow">here</a> showing support for the various video codecs by the four main browsers around today. For Chrome and Safari the only option that plays on both is h.264 in an mp4 container.</p>

<p>I've found that main profile h264 video plays best across most modern devices, but you can wind it back to base profile if you're having problems. <a href="http://gravlab.com/2013/11/07/difference-baseline-main-high-h264-mpeg4-mp4-profiles/" rel="nofollow">This</a> is a good discussion about the differences between the profiles.</p>

<p>A quality setting of 20 is a good place to start; it's a good compromise between size and quality, but you could tweak depending on your results.</p>

CC BY-SA 3.0
2014-02-06T07:01:59.913Z
2014-02-06T07:01:59.913Z
stib
<p>h.264 + aac in .mp4.</p>

<p>Google up an x264 settings guide.  (or use <code>-preset slower</code>).  If you're doing something that the MPEG-LA would charge patent royalties for, screw them and use VP8 or VP9, with maybe a fallback to Theora if that helps compat.</p>

<p>Old question, but check the quality at the start of the video if using x264.  If it's not good, use 2-pass.  I forget if it's only 1pass ABR (average bitrate) mode that does this, or if it also happens sometimes with CFR (constant quality regardless of source resolution or complexity, normally the go-to choice for one pass).</p>

CC BY-SA 3.0
2015-01-20T06:28:07.660Z
2015-01-20T06:28:07.660Z
Peter Cordes
<p>h.264 is probably the easiest.  Just about anything plays it, particularly if you use a base profile (which reduces effectiveness, but also simplifies the playback for lower powered devices).</p>

CC BY-SA 3.0
2014-01-29T17:48:07.787Z
2014-01-29T17:48:07.787Z
AJ Henderson
<p>If compatibility is your top priority, then you should include two alternative versions of your video on your website, like in this <a href="https://developer.mozilla.org/en-US/docs/HTML/Supported_media_formats" rel="noreferrer">HTML example</a>.</p>

<p>As for the exact formats I would suggest:</p>

<ul>
<li><strong>H.264 and AAC in MP4</strong>: Chrome, Firefox 22+ on Windows, IE9, Safari 3.1</li>
<li><strong>VP8 and Vorbis in WebM</strong>: Firefox fallback for Mac and older versions on Windows.</li>
<li>(If you need support for even older browsers (IE6-8), and mobile (Android, WP7), you could add <a href="http://mediaelementjs.com" rel="noreferrer">mediaelement.js</a> to your website.)</li>
</ul>

<p>Make sure to put them in that order to make the fallback work. H.264 or MPEG-4 are recommended because they are the only formats to have hardware acceleration on newer devices. </p>

<p>Compression settings: start by using <strong>constant quality</strong> with default settings for video and <strong>128 Kbps VBR</strong> audio. For H.264 make sure to not exceed <strong>Main Profile</strong> and <strong>Level 4.0</strong>. And since Handbrake doesn't do the WebM format, you could try <a href="http://mirovideoconverter.com" rel="noreferrer">Miro Video Converter</a>.</p>

CC BY-SA 3.0
2015-01-20T06:11:27.207Z
Why would you ever use Main, not High, profile, for anything?  I thought HW decoders were usually either baseline or high, so worse compression (no 8x8dct) for no or very small gain in combatibility.
Peter Cordes
CC BY-SA 3.0
2015-01-20T09:08:17.753Z
The Main profile recommendation comes from the mobile device world. For example most Apple A4 and A5 processors are H.264 Main profile limited. More specifically iPod Touch 4G & 5G, iPod 1 & 2, iPhone 4, AppleTV 2G & 3G (model A1427). Anything beyond is High profile.
Duvrai
CC BY-SA 3.0
2015-01-20T19:23:53.337Z
Yeah I googled a bit after posting that comment.  Unfortunately it seems there are a fair amount of HW decoders that support Main but not High, so a year or two of phones.  I guess it makes sense that 8x8dct might require different logic blocks on a FPGA or ASIC, unlike the case for software where it's not hard.  (CPU power to decode CABAC is the hard part for going from baseline to main, for software I think.)  Anyway, blargh, are we never going to get rid of sub-optimally encoded videos, thanks to crappy devices?  As soon as we do, devices with partial h.265 support will come out... square 1
Peter Cordes
CC BY-SA 3.0
2014-02-16T13:26:16.447Z
2014-02-16T13:26:16.447Z
Duvrai
<p>I am going to re-sample a bunch of videos to be played through web browsers.
(Current video is large, 3 MB for a 4s clip. Hoping to compress by 90%).</p>

<p>Use:  These videos will be played in a web-based eduational app. They'll be up to about 5 seconds and be played in the latest Chrome or (on iOS/Mac) Safari browser.</p>

<p>I'm using Handbrake (.9.9.5530, latest) . These must be playable in <strong>Chrome and Safari</strong> (latest versions) browsers without any pluggins (and would be nice to be playable in the latest FireFox and IE).
(I'm also open to using another free or cheap encoding software that will let me do batch processing.</p>

<p>What are the recommended settings (Video Codec, Quality (and constant or avg bit rate, etc.)
My top priority is compatibility.</p>

CC BY-SA 3.0
2015-01-20T06:21:59.717Z
I'd assume he means HTML5 <video>.  Google up an x264 encoding guide for ffmpeg / x264.
Peter Cordes
CC BY-SA 3.0
2014-02-03T00:20:41.533Z
How are you planning to embed the final video file into a web page without using plugins? This will help us determine the best codec for this problem.
nchpmn
<codec><encoding>
What is the most compatible compression/Codec to in Handbrake use for video that will be played in Chrome and Safari browsers?
Clay Nichols
# What is the most compatible compression/Codec to in Handbrake use for video that will be played in Chrome and Safari browsers?

(Asked by: username_0 on 2014-01-29)

I am going to re-sample a bunch of videos to be played through web browsers.
(Current video is large, 3 MB for a 4s clip. Hoping to compress by 90%).

Use: These videos will be played in a web-based eduational app. They'll be up to about 5 seconds and be played in the latest Chrome or (on iOS/Mac) Safari browser.

I'm using Handbrake (.9.9.5530, latest) . These must be playable in **Chrome and Safari** (latest versions) browsers without any pluggins (and would be nice to be playable in the latest FireFox and IE).
(I'm also open to using another free or cheap encoding software that will let me do batch processing.

What are the recommended settings (Video Codec, Quality (and constant or avg bit rate, etc.)
My top priority is compatibility.

**Tags:** codec, encoding

> **Comments:**
> **username_2**: How are you planning to embed the final video file into a web page without using plugins? This will help us determine the best codec for this problem.  
> **username_1**: I'd assume he means HTML5 <video>.  Google up an x264 encoding guide for ffmpeg / x264.  

---

## 4 answers

### Answer by username_5 on 2014-02-16. Score: 5 | Accepted answer

If compatibility is your top priority, then you should include two alternative versions of your video on your website, like in this [HTML example](https://developer.mozilla.org/en-US/docs/HTML/Supported_media_formats).

As for the exact formats I would suggest:

* **H.264 and AAC in MP4**: Chrome, Firefox 22+ on Windows, IE9, Safari 3.1
* **VP8 and Vorbis in WebM**: Firefox fallback for Mac and older versions on Windows.
* (If you need support for even older browsers (IE6-8), and mobile (Android, WP7), you could add [mediaelement.js](http://mediaelementjs.com) to your website.)

Make sure to put them in that order to make the fallback work. H.264 or MPEG-4 are recommended because they are the only formats to have hardware acceleration on newer devices.

Compression settings: start by using **constant quality** with default settings for video and **128 Kbps VBR** audio. For H.264 make sure to not exceed **Main Profile** and **Level 4.0**. And since Handbrake doesn't do the WebM format, you could try [Miro Video Converter](http://mirovideoconverter.com).

> **Comments:**
> **username_1**: Why would you ever use Main, not High, profile, for anything?  I thought HW decoders were usually either baseline or high, so worse compression (no 8x8dct) for no or very small gain in combatibility.  
> **username_5**: The Main profile recommendation comes from the mobile device world. For example most Apple A4 and A5 processors are H.264 Main profile limited. More specifically iPod Touch 4G & 5G, iPod 1 & 2, iPhone 4, AppleTV 2G & 3G (model A1427). Anything beyond is High profile.  
> **username_1**: Yeah I googled a bit after posting that comment.  Unfortunately it seems there are a fair amount of HW decoders that support Main but not High, so a year or two of phones.  I guess it makes sense that 8x8dct might require different logic blocks on a FPGA or ASIC, unlike the case for software where it's not hard.  (CPU power to decode CABAC is the hard part for going from baseline to main, for software I think.)  Anyway, blargh, are we never going to get rid of sub-optimally encoded videos, thanks to crappy devices?  As soon as we do, devices with partial h.265 support will come out... square 1  

---

### Answer by username_3 on 2014-02-06. Score: 1

There's a table [here](http://fmbip.com/litmus/#mdz_video_h264) showing support for the various video codecs by the four main browsers around today. For Chrome and Safari the only option that plays on both is h.264 in an mp4 container.

I've found that main profile h264 video plays best across most modern devices, but you can wind it back to base profile if you're having problems. [This](http://gravlab.com/2013/11/07/difference-baseline-main-high-h264-mpeg4-mp4-profiles/) is a good discussion about the differences between the profiles.

A quality setting of 20 is a good place to start; it's a good compromise between size and quality, but you could tweak depending on your results.


---

### Answer by username_1 on 2015-01-20. Score: 1

h.264 + aac in .mp4.

Google up an x264 settings guide. (or use `-preset slower`). If you're doing something that the MPEG-LA would charge patent royalties for, screw them and use VP8 or VP9, with maybe a fallback to Theora if that helps compat.

Old question, but check the quality at the start of the video if using x264. If it's not good, use 2-pass. I forget if it's only 1pass ABR (average bitrate) mode that does this, or if it also happens sometimes with CFR (constant quality regardless of source resolution or complexity, normally the go-to choice for one pass).


---

### Answer by username_4 on 2014-01-29. Score: 0

h.264 is probably the easiest. Just about anything plays it, particularly if you use a base profile (which reduces effectiveness, but also simplifies the playback for lower powered devices).


---

