GIF動画 をHTML5&WebM に変換する方法

HTML5&WebM
フルタニ

こんにちは、フルタニです。放送局で番組作りをしてました。 GIF動画 を書きます。

ブログに動画を貼り付けるにはどうしたらいいのでしょうか。

サーバーに置くには動画はファイルサイズが大きいので、ページの表示時間を損ねます。

次善の策としてGIF形式の動画にして張り付ける手がありますが、これもデータ量がかさみます。

そこで登場したのがHTML5もしくはWebM という最新の動画です。

いったいどういうメリットがあるのでしょうか

GIF動画を HTML5&WebM に変換する方法

ブログなどに気楽に貼り付けることができるGIF画像。

Photoshopなどの画像ソフトを使うことで動画を簡単にGIF画像に変えることができることから普及しました。

ところがGIF形式の画像はそれでも重く、サーバーの負担になります。

そこで従来の動画形式よりもさらに圧縮率を高め、軽くした動画形式が開発されました。

HTML5とWebMです。

GIF形式の画像をWeb上に上げ、軽い形式に変換するサービスが続々登場しました。

Gfycat | Watch and Create GIFs, Videos, Memes

初めに紹介するのは「Gfycat」というサービスです。

ご覧の通り、変換ソフトと動画ファイル置き場を一緒にしたようなサービスです。

利用法はサイトの画面に変換したしGIFをアップロードするだけ。

即座にHTML5への変換が開始します。

変換された動画の画面下にある鎖マークをクリックするか、画面を右クリックしてURLをコピーしてメールやブログ等に貼り付けます。

すると、HTML5の動画が再生することができます。

GIFではなくMP4動画形式を使えば、同じ内容でもファイルサイズを80%~90%ほど減らせます。

タグの設定でアニメーションGIFのように自動再生かつループ再生にもできます。

<video autoplay loop muted playsinline>

HTML5に変換したことで、GIF形式で1MB近くあった容量が一気に4分の一近くまで減量することができました。

やってみて知ったのは、WordPressの場合、記事に張り付けることは問題なくできましたが、アイキャッチ用の画像には使えませんでした。ファイルが認識されないのです。

動画系先はできたものの、アプリ側ではまだ対応していない場合が多いものと思われます。

さらに容量を減らしたい場合はMP4よりもWebM(ウェブエム)形式を使う方法があります。

WebM(ウェブエム)とは

WebM(ウェブエム)とは、Googleが開発している動画フォーマットで、インターネット上での動画視聴を目的に開発されました。

軽量さと高品質を兼ね備えたフォーマットです。

デメリットは汎用性がそれほど良くないため、再生できないケースが見受けられる点です。

それでもウェブ上では無料の形式変更サービスが数多く出回り始めていて、需要ののびを感じさせられます。

WebMのデメリット

高品質でありながら帯域幅の消費が少ない特徴を持つWebM形式には弱点があります。

それは、アップルのiOSがWebMをサポートしていないことです。

iPhoneスマホでWebM動画を視聴したくても「再生できません」マークが表示されます。

このブログでもWebM形式の動画を使った記事がいくつかありますが、Windows上では見えていても、iPhoneでは見えない場合があることがわかりました。

記事を書いているMadbookとCromeの組み合わせではOKなのにです。

iPhoneで動画をダウンロードする場合「写真」アプリに保存されます。WebM形式の動画はダウンロードして再生することができません。

iPhoneでどうしてもWebM形式の動画を再生したい場合は、Crpmeでブラウジングしたり、ファイルであればGドライブにファイルを保存して再生したり、VLC Media Playerを使う方法などがあります。

ご注意ください。

今回はGIF画像をWebMにウェブ上で変換してくれるサービス「Convertio」を使ってみました。

GIF WEBM 変換。オンライン フリー — Convertio

サインアップやログインする必要もないのですぐに使うことができます。

Cromeで使用する場合は拡張機能が表示されますが無理にインストールする必要はありません。

アップロードするとすぐに変換が始まります。ダウンロードをクリックするとダウンロードされます。

圧縮前後の違いは上の通りです。

WebM動画です iOSではご覧いただけません。Cromeをご利用ください

動画ファイルはWordPressに画像と同じ感覚で埋め込めます。

CDKM – オンラインで無料で GIF を WEBM に変換

  1. ローカルの GIF ファイルを選択するか、オンラインの GIF ファイルのURLを入力します
  2. ターゲット形式として「 WEBM 」を選択し、オプションを設定します
  3. [変換開始]ボタンをクリックして、変換が完了するまで待ちます。

Any Com GIFをWEBMに変換する オンライン フリー – GIF WEBM 変換

  1. 変換するファイルを選択するか、アップロード領域にドラッグアンドドロップします
  2. 動画は速やかに変換されダウンロードできます
  3. すべてのファイルは、1時間後にサーバーから自動的に削除されます。

ASPOSE GIFからWEBMへのコンバーター

AVI、FLV、MKV、MOV、MP4、WEBM、WMV、GIF、APNGに変換できます。

  1. [ファイルの選択]をクリックしてgifファイルをアップロードし、変換設定をします
  2. gifファイルがアップロードされ、他の形式に変換されます
  3. 結果ファイルのダウンロードリンクは、変換後すぐに利用できるようになります
  4. ファイルは24時間後にサーバーから削除されます

Convertor App 無料でGIFをWEBMに変換する

  • GIFをアップロードすると、すぐに変換処理が開始されます
  • 変換された動画は無料でダウンロードすることができます

WEBMはサポートしていないブラウザもありますが、動画はさらにサイズを削減できます。

まとめ

上記以外にも無料で使えるコンバーターはいくらでもあるので自分好みのサービスを見つけてください。

WebMは配信サービスの動画を作る際に向いているフォーマットとも言われます。

ファイルサイズが小さい分、読み込みにかかる時間を短縮できます。

ウェブ上で動画を配信したりブラウザーで再生する目的であればWebM形式での制作・保存を検討してみてはいかがでしょうか。