html_css:replace_gifs_with_videos

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン 前のリビジョン
次のリビジョン		 前のリビジョン
html_css:replace_gifs_with_videos [2021/02/25 16:22] – [参考文献] ともやんhtml_css:replace_gifs_with_videos [2024/04/09 15:49] (現在) – ともやん
行 1: 行 1:
 +~~CLOSETOC~~
 ====== アニメーションGIFをビデオに置き換えてページの読み込みを高速化する ====== ====== アニメーションGIFをビデオに置き換えてページの読み込みを高速化する ======
-Windowsの場合は [[windows:scoop|scoop]] で [[windows:ffmpeg|ffmpeg]] をインストールできますが、scoop 標準の ffmpeg では VP9 エンコード出来ないようです。(2012/02/25 現在) ffmpeg.json を編集して VP9 対応の ffmpeg をインストールする必要があります。\\+{{page>hardware:video_resolutions}}
  
-===== 解像度 ===== +===== ffmpeg のインストール ===== 
-4320p: 7680×4320 8K\\ +Windowsの場合は [[windows:scoop|scoop]] で [[windows:ffmpeg|ffmpeg]] をインストールできますが、[[windows:scoop|scoop]] 標準の [[windows:ffmpeg|ffmpeg]] では VP9 エンコード出来ないようです。(2021/02/25 現在) ffmpeg.json を編集して VP9 対応の ffmpeg をインストールする必要があります。\\
-2160p: 3840x2160 4K (YouTube)\\ +
-1440p: 2560x1440 (YouTube)\\ +
-1080p: 1920x1080 (YouTube)\\ +
-720p: 1280x720 (YouTube)\\ +
-480p: 854x480 (YouTube)\\ +
-360p: 640x360 (YouTube)\\ +
-240p: 426x240 (YouTube)\\ +
-144p: 256×144 (YouTube)\\+
  
-{{html_css:common_video_resolutions_2.svg?340|Common_Video_Resolutions_2.svg}}{{html_css:vector_video_standards5.svg?340|Vector_Video_Standards5.svg}}\\ +===== ffmpeg のオプション ===== 
-[[https://commons.wikimedia.org/wiki/File:Common_Video_Resolutions_2.svg|File:Common_Video_Resolutions_2.svg - Wikimedia Commons]]\\ +<WRAP prewrap 100%> 
-[[https://commons.wikimedia.org/wiki/File:Vector_Video_Standards5.svg|File:Vector Video Standards5.svg - Wikimedia Commons]] より\\+MP4 - 1080p 
 +<code> 
 +$ ffmpeg -i input.mov -preset slow -codec:a libfdk_aac -b:a 128k -codec:v libx264 -pix_fmt yuv420p -b:v 4500k -minrate 4500k -maxrate 9000k -bufsize 9000k -vf scale=-1:1080 output.mp4 
 +</code> 
 + 
 +MP4 - 720p 
 +<code> 
 +$ ffmpeg -i input.mov -preset slow -codec:a libfdk_aac -b:a 128k -codec:v libx264 -pix_fmt yuv420p -b:v 2500k -minrate 1500k -maxrate 4000k -bufsize 5000k -vf scale=-1:720 output.mp4 
 +</code> 
 + 
 +MP4 - 480p 
 +<code> 
 +$ ffmpeg -i input.mov -preset slow -codec:a libfdk_aac -b:a 128k -codec:v libx264 -pix_fmt yuv420p -b:v 1000k -minrate 500k -maxrate 2000k -bufsize 2000k -vf scale=854:480 output.mp4 
 +</code> 
 + 
 +MP4 - 360p 
 +<code> 
 +$ ffmpeg -i input.mov -preset slow -codec:a libfdk_aac -b:a 128k -codec:v libx264 -pix_fmt yuv420p -b:v 750k -minrate 400k -maxrate 1000k -bufsize 1500k -vf scale=-1:360 output.mp4 
 +</code> 
 +</WRAP>
  
 ===== 参考文献 ===== ===== 参考文献 =====
行 23: 行 35:
 [[wpjp>720p|720p - Wikipedia]]\\ [[wpjp>720p|720p - Wikipedia]]\\
 [[https://osusumehulu.com/?p=1267|動画の画質と解像度「SD、HD、フルHD、4K UHD、8K、480p、720p、1080p、HDR、Dolby Vison」の意味と違い | 俺の動画。]]\\ [[https://osusumehulu.com/?p=1267|動画の画質と解像度「SD、HD、フルHD、4K UHD、8K、480p、720p、1080p、HDR、Dolby Vison」の意味と違い | 俺の動画。]]\\
 +[[https://gist.github.com/dvlden/b9d923cb31775f92fa54eb8c39ccd5a9|Convert video files to MP4 through FFMPEG]]\\
 +[[https://amaya382.hatenablog.jp/entry/2017/03/26/012530|MP4をストリームで扱う場合の落とし穴 - 水底]]\\
 +[[qita>CyberRex/items/960bbd0f348ad8dca544|FFmpegでよく使う例、コーデックをまとめてみた（2021年版） - Qiita]]\\
 +
  • html_css/replace_gifs_with_videos.1614237723.txt.gz
  • 最終更新: 2021/02/25 16:22
  • by ともやん