HTML5ビデオの背景を持つWebサイトを作成したい。
使用したい短い1080p mp4クリップがあります（20秒）。私はビデオをレターボックス形式（5：2のように）で実行し、ページコンテンツの後ろにフルスクリーンを表示します（例については、PaypalのWebサイトhttps://www.paypal.com/uk/webapps/mpp/homeを参照してください）
この目的のためのPremiere CCの最適なエクスポート設定は何ですか？
HTML5バックグラウンドビデオのエンコード設定
回答:
異なるブラウザーに対応するために、複数のバージョンをエクスポートする必要があります。HTML5を使用すると、さまざまなバージョンのビデオを提供でき、ブラウザーはサポートされている最初のバージョンを自動的に選択します。たとえば、参照したpaypalウェブサイトのソースコードを見てみましょう。
<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バージョンの両方を提供しています。それらはあなたにとっても良い選択肢です。
さらに、インターネットの速度が遅いサイト訪問者も視聴できるように、ビデオをできるだけ小さくするようにしてください。そのためには、1080pではなく720pでビデオをエクスポートし（特にビデオがバックグラウンドにある場合は誰も違いを見ることができません）、1 Mbit / s未満のビットレートを目指してください。たとえば、PayPalビデオは約700 Kbit / sのビットレートを使用します。オーディオが不要な場合は、オーディオなしでエクスポートするか、96 Kbit / sなどの低いオーディオビットレートでエクスポートできます。
ビデオをWebサイトからコンピューターに保存し、コーデック、ビットレート、およびその他のパラメーターをMediaInfoまたは同様のプログラムで確認することもできます。
2018年11月更新
この質問にはまだ多くの意見が寄せられているため、最新の情報を追加したかったのです。現在、すべての最新ブラウザーはMP4（MPEG-4 / H.264）をサポートしており、ほとんどのプロジェクトでMP4のみを提供するのに十分な時間をかけてきました。ブラウザの互換性テーブルについては、上記のリンクをチェックして、プロジェクトでサポートする必要があるすべてのブラウザがMP4を再生できることを確認してください。MP3ではなくAACをオーディオトラックに使用することを忘れないでください。これは、サポートするブラウザが少ないためです。
それでも、最初のWebMビデオを提供することはできますし、提供する必要があり<source>ます。これは、優れた圧縮機能を備えているため、限られたデータプランのユーザーに感謝します。ディスクスペース、レンダリング時間、またはWebMの提供を困難にする他の変数の点で制限がある場合は、MP4だけで十分です。
また、私の元の答えにはオーディオに関するものが含まれていたため、厳密に関連していない追加のテイクアウトがあります：特にビデオにオーディオが含まれている場合、ブラウザベンダーは自動再生ビデオ（ページの読み込み後に自動的に再生を開始するビデオ）を取り締まっています。たとえば、Safariでは、動画に音声トラックが含まれていない場合、または動画がミュートされている場合（<video>要素の対応する属性を使用）のみ、動画の自動再生が許可されます。そのため、オーディオトラックが不要な場合は、ビデオをエクスポートせずにエクスポートしてください（オーディオを含むビデオの自動再生は、とにかく不快なUXです）。また、オーディオが必要な場合は、一部のブラウザが自動再生をブロックすることに注意してください。したがって、ポスター属性を使用してプレースホルダー画像を含めるようにしてください。
以下のようMoritzLostは言う、ダウンスケール。興味のある人のために、どこかで高品質バージョンへのリンクを張ってください。rezを低くすると、クライアント側のリソース使用量も低くなります。640p、576p、または480pにダウンスケーリングしても、コンテンツ、およびページのテキストの背後にどの程度表示されるかによって、良い場合があります。
また、サイトにアクセスするすべての人がこのビデオをロードするため、ビットレートごとにできるだけ多くの品質を絞り出すために余分な手間をかける価値があります。特に ビデオを頻繁に変更する予定がない場合。h.264の場合、preset = veryslow、crf = 26または（2パスビットレートターゲット）でx264にロスレスソースを供給することを意味します。x264は最高のh.264エンコーダーです。（さまざまなh.264エンコーダーの独立したテストでこれが確認されています。）十分なCPU時間を与えられて、見栄えの良い本当に小さなファイルを作成する方法を見つけるための多くの本当に巧妙なアルゴリズムがあります。（必要に応じて高速に実行できますが、エンコード時間はこのユースケースにはあまり関係ありません：一度エンコードし、ダウンロードして何度も再生します。）
ページの読み込み時にデフォルトでオーディオを再生しないでください。うまくいけば、正気の人々はすでにこれを知っていますが、MoritzLostはオーディオについて話していました。オーディオを自動再生するページは広く嫌われ、悪と見なされます。
ビデオの高品質バージョンへのリンクがある場合は、それにオーディオを含めることができます。AACステレオを優れたサウンドにするには、96kb / sで十分です。それでも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品質設定はユースケースに適しています。彼らは、私は、彼らが同じように、より良い設定を使用してcrf23からもらったS / 1273キロバイトからさらに20％のビットレートを推測すると思います保存されている可能性がありveryslow、あるいは単にmediumかslow。
彼らはまた、いくつかの古いAndroid / iOSデバイスとの互換性のために、自分自身をh.264メインプロファイルに制限することを決定しましたが、残念ながらまだ良いアイデアです。（--profile Main）。品質に必要なビットレートよりも多くのビットレートを使用するビデオは、ややこしいので、人々がまだベースラインプロファイルエンコードを配布しているのは本当にイライラします。メインプロファイルは8x8dctを使用できませんが、これはかなり痛いですが、少なくともCABACを使用して、絶対的なレズ/ビットレート/その他の設定に関係なく、CAVLCに対して約15％のビットレートを節約できます。
HTML5ビデオでベースライン、メイン、およびハイプロファイルストリームを利用できる場合は、IDK。mp4やwebmの代替を使用できることは知っていますが、これらは単なるコンテナーです。
MoritzLostが言っていることすべてに私はほぼ同意します。
premiere proでの値の設定に役立つように、エクスポートウィンドウ設定のスクリーンショットを追加したかっただけです。
通常、command-M（Mac）を押してエクスポート画面を表示します。そして、以下のように設定します。
注意すべき重要な設定はビットレート設定です。1MbpsVBRに設定し、特定の時間に多くのアクティビティを取得するシーンで最大2.4を許可します。
1MBのファイルサイズを目指してください。（Paypalのsendmoneyビデオは13秒間1.2MBで、音声はありませんでした）
