HTML5背景视频的编码设置

我想创建一个具有HTML5视频背景的网站。

我有一个想使用的1080p mp4短剪辑（20秒）。我打算以信箱格式（5：2 ish）运行视频，在页面内容后全屏显示（例如，请参阅Paypal网站：https : //www.paypal.com/uk/webapps/mpp/home）

为此，Premiere CC中最佳的导出设置是什么？

您应该导出多个版本以适应不同的浏览器。使用HTML5，您可以提供不同版本的视频，浏览器将自动选择支持的第一个视频。例如，看一下您所指的贝宝网站的源代码：

<video autoplay="autoplay" muted="muted" poster="none">
    <source src="https://www.paypalobjects.com/webstatic/mktg/wright/videos/send-money.mp4" type="video/mp4">
    <source src="https://www.paypalobjects.com/webstatic/mktg/wright/videos/send-money.webm" type="video/webm">
</video>

如您所见，它们同时提供mp4（H264编解码器）和webm版本的视频。这些对您来说也是不错的选择。

此外，您应尝试将视频尽量缩小，以使互联网速度较慢的网站访问者也可以观看该视频。为此，您应该以720p而不是1080p导出视频（没人会看到差异，特别是如果视频在后台），并且目标比特率应低于1 Mbit / s。例如，贝宝视频使用大约700 Kbit / s的比特率。如果不需要音频，则可以不使用音频或以较低的音频比特率（即96 Kbit / s）导出。

您还可以将视频从网站保存到计算机，并检查编解码器，比特率和其他参数，例如使用MediaInfo或类似程序。

2018年11月更新

由于这个问题仍然有很多观点，因此我想添加一些最新信息。到目前为止，所有现代浏览器都支持MP4（MPEG-4 / H.264），并且已经使用了很长时间，您可以在大多数项目中仅提供MP4。检查上面的链接以获取浏览器兼容性表，以确保您的项目需要支持的所有浏览器都可以播放MP4。请记住，将AAC用于音频轨道，而不是MP3，因为较少的浏览器支持它。

不过，你可以和应该提供一个WebM视频为第一<source>，因为它具有更好的压缩，所以在有限的数据计划的用户会感谢你的。我只是想补充一点，如果您在磁盘空间，渲染时间或其他一些变量方面受到限制，这使得提供WebM变得困难，那么MP4就是您现在所需要的。

另外，由于我的原始答案包含有关音频的内容，因此还有另外一个与之不严格相关的要点：浏览器供应商正在打击自动播放视频（在加载页面后自动播放的视频，无需用户干预），尤其是在视频包含音频的情况下。例如，如果视频不包含音轨或视频被静音（使用<video>元素上的相应属性），则Safari仅允许自动播放视频。因此，如果您不需要音轨，请导出视频而无需一个（自动播放带音频的视频无论如何都是令人讨厌的UX）。并且，如果确实需要音频，请记住某些浏览器会阻止自动播放，因此请确保使用poster属性包含一个占位符图像。

正如MoritzLost所说，规模缩小。也许将链接指向感兴趣的人的高质量版本。较低的rez也会降低客户端的资源使用率。根据内容的不同，甚至缩小到640p，576p甚至480p都可能很好，具体取决于内容以及它在页面文本后面的可见程度。

另外，由于访问您网站的每个人都将加载此视频，因此，要确保您尽可能提高每比特率的质量，这是值得加倍麻烦的事情。Esp。如果您不打算经常更改视频。对于H.264，这意味着供给无损源到X264预设= veryslow，crf = 26（或2-传递比特率目标）。x264是最好的h.264编码器。（对各种h.264编码器的独立测试已经证实了这一点。）它有很多非常聪明的算法，可以找到足够的CPU时间来制作看起来不错的非常小的文件。（并且可以在需要时快速运行，但是编码时间与该用例并不相关：编码一次，下载并播放很多次。）

页面加载时，默认情况下不播放音频。希望有理智的人已经知道这一点，但是MoritzLost在谈论音频。自动播放音频的页面被广泛厌恶，被认为是邪恶的。

如果您有完整质量视频版本的链接，则可以在其中包含音频。96kb / s足以使AAC立体声听起来出色。64kb / s仍然听起来不错。（只要您没有使用错误的编码器，例如ffmpeg中的除以外的任何其他字符）libfdk-aac。

编辑：

我看了贝宝的视频。（查看页面信息->媒体->查找视频->另存为）。

mediainfo 输出：

General
Complete name                            : /f/p/home-signup.mp4
Format                                   : MPEG-4
Format profile                           : Base Media / Version 2
Codec ID                                 : mp42
File size                                : 10.9 MiB
Duration                                 : 1mn 11s
Overall bit rate                         : 1 276 Kbps
Movie name                               : Homepage SignUp - Alan Version
Album/Performer                          : Sorgel, Chase(AWF)
Composer                                 : Sorgel, Chase(AWF)
Description                              : This video is about Homepage SignUp - Alan Version
Encoded date                             : UTC 2014-03-13 16:26:17
Tagged date                              : UTC 2014-03-13 16:26:29
Writing application                      : HandBrake 0.9.9 2013051800

Video
ID                                       : 1
Format                                   : AVC
Format/Info                              : Advanced Video Codec
Format profile                           : Main@L4.0
Format settings, CABAC                   : Yes
Format settings, ReFrames                : 4 frames
Codec ID                                 : avc1
Codec ID/Info                            : Advanced Video Coding
Duration                                 : 1mn 11s
Bit rate                                 : 1 273 Kbps
Width                                    : 1 280 pixels
Height                                   : 720 pixels
Display aspect ratio                     : 16:9
Frame rate mode                          : Constant
Frame rate                               : 30.000 fps
Color space                              : YUV
Chroma subsampling                       : 4:2:0
Bit depth                                : 8 bits
Scan type                                : Progressive
Bits/(Pixel*Frame)                       : 0.046
Stream size                              : 10.9 MiB (100%)
Writing library                          : x264 core 130 r2273 b3065e6
Encoding settings                        : cabac=1 / ref=1 / deblock=1:0:0 / analyse=0x1:0x111 / me=hex / subme=2 / psy=1 / psy_rd=1.00:0.00 / mixed_ref=0 / me_range=16 / chroma_me=1 / trellis=0 / 8x8dct=0 / cqm=0 / deadzone=21,11 / fast_pskip=1 / chroma_qp_offset=0 / threads=12 / lookahead_threads=4 / sliced_threads=0 / nr=0 / decimate=1 / interlaced=0 / bluray_compat=0 / constrained_intra=0 / bframes=3 / b_pyramid=2 / b_adapt=1 / b_bias=0 / direct=1 / weightb=1 / open_gop=0 / weightp=1 / keyint=300 / keyint_min=30 / scenecut=40 / intra_refresh=0 / rc_lookahead=10 / rc=crf / mbtree=1 / crf=23.0 / qcomp=0.60 / qpmin=0 / qpmax=69 / qpstep=4 / vbv_maxrate=20000 / vbv_bufsize=25000 / crf_max=0.0 / nal_hrd=none / ip_ratio=1.40 / aq=1:1.00
Encoded date                             : UTC 2014-03-13 16:26:17
Tagged date                              : UTC 2014-03-13 16:26:29
Color primaries                          : BT.709
Transfer characteristics                 : BT.709
Matrix coefficients                      : BT.709

因此，他们通过Handbrake使用了x264，但是他们却选择了适当的CPU时间与速率失真的权衡。 ref=1,me=hex,subme=2看起来像veryfast预设。（x264 --fullhelp以查看每个预设与的区别medium，后者使用所有内容的默认设置。）幸运的是，默认crf 23质量设置大约适用于其用例。他们本可以通过使用更好的设置（例如veryslow，甚至just medium或）从crf23中获得的1273kb / s的速率再节省20％的比特率slow。

他们还决定将自身限制为h.264 Main配置文件，以便与某些较旧的Android / iOS设备兼容，我想这仍然是一个好主意。（--profile Main）。使用比质量需要更多比特率的视频有点让人生气，所以让人们仍然分发基准配置文件编码的确让我感到烦恼。主配置文件不能使用8x8dct，这也会造成很大的伤害，但是至少可以使用CABAC相对于CAVLC节省大约15％的比特率，而不管绝对rez / bitrate /任何其他设置如何。

如果HTML5视频有可能提供“基准”，“主要”和“高级”配置文件流，则为IDK。我知道您可以使用mp4和webm替代方案，但这只是容器。

我几乎同意MoritzLost所说的一切。

我只想添加导出窗口设置的屏幕快照，以帮助设置Premiere Pro的值。

我通常按​​Command-M（Mac）调出导出屏幕，然后按如下所示进行设置。

需要注意的重要设置是“比特率”设置，我将其设置为1Mbps VBR，对于在特定时间有很多活动的场景，允许设置为2.4。

尝试将文件大小设置为1MB。（Paypal的sendmoney视频为1.2MB，持续13秒，无音频）