SafariもWebPに対応すると思われる(βですが)ので、大量に画像を使っているサイトの高速化を図るため、WebPを使用しようと考えました。
画像の一括処理が大変
画像が大量にあるためどうしても一括で変換したかった。そしてpng、jpg、gif、表記ゆれのjpegなども相まって複数の拡張子にも対応しないといけないため、どのようにやるかいろいろ調べた結果、以下のような方法で行いました。当方Windowsです。
- 変換にはFFmpegを使う
- シェルスクリプトで拡張子で処理を分ける
- 今回はgifはgifアニメも含んでしまうためWebP処理はせず、それ以外の拡張子に対して変換を行う事を想定
コード
早速コードを書いていきます。以下のコードを「webp.sh」で保存します。
#!/bin/bash
cd ★処理したいディレクトリまでのパス★
for file in \find . -maxdepth 5 -type f
; do
faname_ext="${file##.}" #拡張子を取得
if [ "$faname_ext" != 'gif' ] ; then #gif以外を処理
fname=${file%.} #拡張子を除くファイル名。パスを含む。
newfile=$fname".webp" # 新しい画像形式
ffmpeg -y -i $file $newfile
fi
done
★処理したいディレクトリまでのパス★には、自分の環境にあったパスを記載してください。例えばこんな感じの書き方です。
cd /c/Users/username/Desktop/data
使い方
bashの使えるCUIツールを使います。私は Git for Windowsのgitbashを使いました。流れとしては、以下の通りです。
- webp.shファイルのある場所へ移動する
- webp.shファイルに対してパーミンション755を付与
- webp.sh実行
それを踏まえたbashの流れは以下です。
$ cd Desktop/
$ chmod 755 webp.sh
$ ./webp.sh
応用
これを応用すれば、例えばmp4はwebmに、それ以外の拡張子はwebpみたいなこともできます。
#!/bin/bash
cd ★処理したいディレクトリまでのパス★
for file in \find . -maxdepth 5 -type f
; do
faname_ext="${file##.}" # 拡張子を取得
if [ "$faname_ext" = 'mp4' ] ; then #mp4だったら
fname=${file%.}
newfile=$fname".webp" # webmに変換
ffmpeg -y -i $file $newfile
else #それ以外は
fname=${file%.*}
newfile=$fname".webp" # webpに変換
ffmpeg -y -i $file $newfile
fi
done
最後に
念の為、バックアップを取ってから行うことをおすすめします。
[itemlink post_id=”2036″]