Web動画を公式サイトに埋め込みたい!気を付けるべき点は?

公開日:2023/03/15


パソコンやスマートフォンから、企業の公式サイトに埋め込まれているWeb動画を視聴することが当たり前のような時代になりました。視聴者は、Web動画からその商品やサービスを判断して、購入したりサービスを受けたりするのでWeb動画は重要です。そこで今回は、Web動画を公式サイトに埋め込む方法や気を付ける点を解説します。

そもそもWeb動画とは

Web動画とは、Webサイトなどのオンラインで視聴できる動画全般のことです。たとえば、YouTubeなどの動画共有サイトや、Twitterなどのソーシャルメディアサービスがそれにあたります。Web動画を制作する目的は、商品やサービスのブランディングまたはプロモーション、広告配信などさまざまです。

テレビCMは、テレビで番組と番組の間に流れることがほとんどですが、Web動画はインターネットにつながっている端末であればどれでも視聴可能となるため、テレビよりも人の目に触れる機会が多くなります。そのため、多くの企業では積極的に動画マーケティングに取り組んでいます。しかし、Web動画はYouTubeやソーシャルメディアサービスなど、配信方法に合わせた動画の長さや演出を考えて制作しなくてはなりません。

Web動画を公式サイトに埋め込む方法

Web動画を公式サイトに埋め込むにはどのような方法があるのでしょうか。ここでは、Web動画を公式サイトに埋め込む方法を解説します。

動画の埋め込みに使われるタグ

動画の埋め込みに使われるタグは2種類あり、iframeタグとvideoタグです。iframeタグは、YouTubeやVimeoなどの動画共有サイトからURLを指定してHTMLに埋め込むことに使用され、videoタグは、MP4ファイルをアップロードしてHTMLに埋め込むことに使用されるという使い分けがされています。iframeタグは、ページ内に矩形のフレームを作り、そのフレームに指定したURLを表示させるタグです。Googleマップやソーシャルメディアサービスに埋め込むことにも使われます。videoタグは、基本的にMP4に埋め込む際に使うことが推奨されています。

YouTubeを埋め込む

YouTubeにアップロードされている動画を公式サイトに埋め込むには、アップロードした動画の右下にある「共有」をクリックし、共有画面が表示されたら「埋め込む」をクリックします。すると、右側にHTMLに貼り付けるiframeタグが表示されるのでコピーし、公式サイトの埋め込みたい箇所に貼り付けることで動画が埋め込まれます。

Vimeoを埋め込む

Vimeoとは、YouTubeのような動画共有サイトのことです。ユーザー自身がアップロードしたWeb動画しか埋め込めないため、映像クリエイターなどが制作したハイクオリティな動画多いことや、広告が出ないといった特徴があります。公式サイトに動画を埋め込むには、動画の右上にある紙飛行機のマークをしている「共有」をクリックします。すると、画面中央にiframeタグが表示されるのでコピーして、公式サイトの埋め込みたい箇所に貼り付けることで動画が埋め込まれます。iframeタグが表示される際に、pタグも一緒に表示されますが貼り付ける必要はありません。

MP4を埋め込む

videoタグを使用してsrc属性にパスを指定し、動画ファイルを埋め込みます。しかし、動画ファイルを埋め込んだだけでは再生されないので、auto属性などいくつかの属性を指定しなくてはなりません。

Web動画を軽量化させる

Web動画はどうして軽量化したほうがよいのでしょうか。ここでは、Web動画を軽量化するメリットとおすすめのフリーソフトの解説をします。

Web動画を軽量化するメリット

Web動画を軽量化すると、送信がスムーズになるというメリットがあります。動画のアップロードにはサイズの制限があり、サイズが大き過ぎるとクオリティの高い動画を制作してもアップロードできず誰も視聴できません。また、動画を軽量化することで、動画をダウンロードする時間も短くなり、再生もスムーズになるので快適に視聴できます。それ以外にも、軽量化することでより多くの動画を保存できることもメリットのひとつです。

おすすめのフリーソフト

Web動画を軽量化させるために、おすすめのフリーソフトがHandbrakeです。Handbrakeには、動画の再生形式を変換できるという特徴があります。このソフトを使うことで、比較的簡単に動画の容量を制限して、軽量化させることが可能です。フリーソフトのため、無料でダウンロードできます。ただし、HandbrakeはMP3に音声変換できないため、MP3に変換したい場合はほかのソフトを使用しなければなりません。

まとめ

Web動画とは、Webサイトなどのオンラインで視聴できる動画全般のことです。Web動画を公式サイトに埋め込む方法は、iframeタグとvideoタグの2種類を使い分けて埋め込みます。iframeタグは、YouTubeやVimeoでアップロードされた動画を埋め込む際に使用するものです。Videoタグは、基本的にMP4ファイルをアップロードして埋め込む際に使用されます。Web動画は、軽量化することで送信がスムーズになり、ダウンロード時間も短縮できます。ほかにも、再生がスムーズになるうえ、多くの動画を保存することが可能です。軽量化するには、Handbrakeというソフトを使うことで、比較的簡単に動画の容量を制限して軽量化できます。

おすすめ関連記事

サイト内検索
動画制作関連コラム

【名古屋市】おすすめの動画制作会社ランキング

イメージ1
2
3
4
5
会社名ムービングTAOキューティーブイエスネクストシネマレイ
特徴クライアントの要望に合わせ、売れるための戦略を提案してくれるターゲットを明確化し、企画をしっかりと考え抜いた上で制作を開始する映像の制作知識がなくてもスタッフが要望に付加価値を付けて提案してくれるクライアントのイメージどおりの動画・映像制作を実現してくれる未体験の感動を引き出すクリエイティブファクトリー
詳細リンク