「GIFアニメはサイズが大き過ぎる・・・」
「GIFアニメの再生・停止が簡単にはWebで実装できない・・・」
このような場合には、この記事の内容が参考になります。
この記事では、GIFアニメをMP4動画に変換する方法を解説しています。
本記事の内容
- GIFとMP4はどちらがWebコンテンツに最適?
- GIFをMP4に変換する方法
それでは、上記に沿って解説していきます。
GIFとMP4はどちらがWebコンテンツに最適?
手元にGIFアニメがあります。

内容は、以下のようなモノになります。
3秒程度の内容で約3.5MBもあります。
これをそのままWebにUPして表示するのは、躊躇ってしまいます。
クライアントのデータ通信量に影響はあるでしょう。
また、サーバーのディスク容量や帯域幅にも影響はあります。
もちろん、Webサーバーへの負荷も影響はあるはずです。
そう考えると、MP4に変換してUPした方が良いのかもしれません。
そもそも、上記のGIFアニメは自動再生する必要はありません。
それにループで何度も表示するような必要性もないです。
ただ、どのような内容である(動きをする)のかを示したいだけになります。
このようなケースであれば、動画としてWebに表示すべきと言えます。
逆に、延々と表示したいならGIFアニメの方が適しています。
ブラウザによっては、動画の自動再生に制限があることもあり得ます。
したがって、最適なWebコンテンツがどちらかという問いは一概には判断できません。
ニーズに応じてGIFか動画であるかが決まるからです。
今回のようなGIFであれば、MP4動画の方がWebコンテンツとしては最適だと言えます。
実際、Twitter上でもMP4がコンテンツとしてUPされています。

Twitterへのアプロードは、GIFをそのままアップしています。
そして、画面上でもGIFとして扱われています。

しかし、その実体はMP4ということです。
以上、GIFとMP4はどちらがWebコンテンツに最適?について説明しました。
次は、GIFをMP4に変換する方法を説明します。
GIFをMP4に変換する方法
GIFをMP4に変換する方法を説明していきます。
変換するには、以下の二つの方法があります。
- オンラインツール
- ソフトウェア
オンラインツールの利用には、リスクが伴います。
ファイルを外部にアップする以上、情報漏洩の可能性があります。
そして、個人情報や著作権に関連する問題を考慮する必要も出てきます。
特に、仕事での利用は避けた方が無難でしょう。
したがって、ソフトウェアでの利用を強くオススメします。
この場合のソフトウェアとしては、FFmpeg一択です。
インストールについては、以下の記事を参考にしてください。
FFmpegが利用可能であれば、あとはChatGPTに聞くだけです。
このようなコマンド系は、もうChatGPTに聞いた方が良いと思います。

ffmpegを使ってGIFをMP4に変換するコマンドを教えてください。
できる限りサイズを小さくして、画質もできる限りで維持して。

結論を言うと、次のコマンドを使えということです。
ffmpeg -i input.gif -movflags faststart -pix_fmt yuv420p -vf "scale=trunc(iw/2)*2:trunc(ih/2)*2" -b:v 500k -crf 23 output.mp4
画質に関しては、CRF値を調整することで対応可能とのこと。
画質は、サイズを見ながら調整することになるでしょうね。
ちなみに、Twitter上のMP4は次のサイズとなっています。

これを目途にCRF値を調整します。
CRFが27の場合に次のようなサイズとなっています。

画質に関しては、実際に確認してみてください。
個人的には、Twitterと同レベルだと思います。
さすがに、約3.5MBのGIFをUPする気にはなりません。
でも、約170KBのMP4であれば全然余裕です。
約20分の1のサイズに縮小できていますね。
これは、ダイエットが大成功です。
以上、GIFをMP4に変換する方法について説明しました。