自社のWebサイトトップに動画を埋め込むときのサイズなどの注意事項

自社のサイトの見栄えを良くしたい…。動画を入れ込むなんてどうだろう!

Webサイトの質を上げたい時、そう思うことは多々あると思います。この記事では、ある程度自社でwebの管理をしている方に自社サイトに動画を埋め込むときの注意事項を各ケースごとにまとめてみました。

YouTubeなどの外部リンクで埋め込む場合

まずはYouTubeやVimeoを使って、外部リンクを埋め込んで再生させる場合です。

動画サイズはFHDが最適

YouTubeには4K画質までの動画をアップロードすることができるのですが、基本的にはFHDサイズで問題ありません。

むしろサイト用にアップするだけなのであれば、もう一段小さなサイズの1280×720(720p)でも十分な場合があります。

外部リンクで埋め込むと行っても、YouTubeを開いて再生しているのと変わらないので、ユーザーのことを考えるとなるべく軽いに越したことはありません。

埋め込み時にサイズ指定をできるのですが、元の動画サイズと比例していないとおかしなことになってしまうため要注意です。

YouTubeはそのままだとロゴが出る

せっかくいい映像を撮ったのに、ただ埋め込むだけだとロゴが出たりメニューバーや関連動画が表示される…。

普通にYouTubeからの埋め込みコードを埋め込むだけではこういったことが起きてしまいますので、ロゴを消す場合などは追加のコードが必要になります。

こちらは少し専門的な内容なので、また別の機会に紹介します。

Vimeoだと有料でロゴなどが消せる

コードはいじりたくない!という方へ、Vimeoの有料会員になればこの辺りの問題は解決します。ロゴやメニューバーなど、動画再生に邪魔なものは全て消すことができます。

月700円のプランから用意されていますので、自社で完結したい場合はこちらを使うのも手です。

直接埋め込みの場合

次に画像データと同じく、WordPressなどを使ってWebサイトに直接埋め込む場合です。

動画サイズは最大10MB

直接埋め込む際の動画の最大サイズはおおよそ10MBくらいです。画質と相談しつつ、可能であれば、5MBに収めれば最適です。

ここが重すぎると、そもそも埋め込みができなかったり、サイト自体のスピードが著しく低下してしまうので、なるべく10MB以内にしましょう。

Premiereを使って書き出す場合

具体的な方法になりますが、PremiereProを使って書き出す場合は、書き出し画面の下記から書き出し後の容量を見ながら調節できます。

画像のターゲットビットレートを下げていくと、書き出し後の容量も低くなります。

CBR、VBRと選ぶ項目がありますが、簡単に説明すると

  • CBR・・・・固定ビットレート。一律のビットレートのため、動きが激しいシーンが入っているとブロックノイズが出ることもある。
  • VBR・・・・可変ビットレート。動きが激しいシーンにビットレートを合わせてくれますが、容量がでかくなることも。

です。Webサイトで動画を使用する場合はCBRの方が使い勝手がいいので、CBRを選択しています。ただしこの辺りは書き出された動画を実際に見てから判断した方が良いです。

まとめ

今回は大きく分けて外部リンクを使って埋め込む場合と、WordPressなどで直接埋め込む場合の動画準備の注意点を書きました。そのうち具体的な埋め込み方法をまとめた記事なども公開します。

あなたに必要なクリエイティブ制作のすべて

Sokoageはクリエイティブ制作の内製化を支援する"NAISEI"とデザイン・映像制作、ブランディングの"SOUZOU"で顧客に最適なサービスをご提案します。 作り手でありながら、そのノウハウを提供する私たちなら、きっとあなたの求めるクリエイティブが見つかります。

PROFILEわたしが書きました

itotty

普段は動画制作をしてます。itottyです。
好きな映画は「ファイト・クラブ」、「ブギーナイツ」、エドガー・ライト作品全般などなど。映画がとにかく好きなので、映画と絡めて面白くて、わかりやすい記事を書いていきます!