動画 動画を追加する ポスター画像を含める

動画要素に poster 属性を追加すると、ユーザーのデバイスが要素が読込んだ時に、内容をすぐに把握できます。
この場合、ユーザーは動画をダウンロードして再生する必要がなくなります。

<video poster="poster.jpg" ...>
  ...
</video>

ポスターは、動画の src が破損していたり、指定した動画形式がすべてサポートされていない場合には代替手段になります。
ポスター画像のデメリットは、追加のファイル リクエストによって帯域幅を消費し、レンダリングが必要になることです。
詳細は、画像の最適化を参考にしてください。

ポスター有りと無しでは表示が異なります。

ポスター有り

ポスターなし

ポスター有りの方がユーザーにとって親切であることが一目瞭然です。





関連記事

• 動画要素を追加する
• 複数のファイル形式を指定する
• 開始時刻と終了時刻を指定する
• ポスター画像を含める