Quantcast
Viewing all articles
Browse latest Browse all 2722

cwebpでWebPへフォルダ内のJPG・PNG画像を一括変換するシェルスクリプト

プロローグ EdgeのレンダリングエンジンもChromeと同等になり対応、またSafariも対応してきたWebP。 ひと手間増えて面倒だけど、いよいよWebPを通常採用する時期にきたのかもしれませんね... 参考サイト Big Sur搭載のSafariはWebP画像を標準サポート、AVIFもサポートしてくれるかも Can I use WebP ? 本稿の内容 cwebpとシェルスクリプトを使って、任意のディレクトリ内のJPG画像およびPNG画像を、一括変換する方法の共有 ※本稿はmacで動作確認をしています。他のOSは適宜調整ください。 タスク (準備)cwebpのインストール cwebpのインストール方法はググるとたくさん出てくるので、詳細は省略 Google公開しているインストール方法→Getting cwebp, dwebp, and the WebP Libraries (1)シェルスクリプトの用意 メモ帳(テキストエディタ)を開き、下記のスクリプトをコピペ ファイル名convert2webp.shで保存(ファイル名は何でもいいけど) convert2webp.sh #!/bin/sh Files=$(find . -type f -iname *.jpg -o -iname *.png) # printf "$Files\n" for File in $Files do echo $File cwebp -preset photo -metadata icc -sharp_yuv -o $File".webp" -progress -short $File printf "\n----------------\n\n" done (2)画像のあるディレクトリへ、シェルスクリプトを配置 任意のディレクトリへconvert2webp.shと、変換したい画像を配置します 画像はディレクトリ毎に分けていてもOKです 例えば、こんな感じ↓です (3)シェルスクリプトの実行 terminal $ sh convert2webp.sh 変換が始まります ビフォア・アフター ↓左が変換前、右が変換後 {$ファイル名}.webp という変換後のファイルが生まれていることが確認できます シェルスクリプトを少し解説 #!/bin/sh convert2webp.sh #!/bin/sh シェルスクリプトを記述する際の、おまじない ちゃんと知りたいなら→#!/bin/sh は ただのコメントじゃないよ! Shebangだよ! find . -type f -iname *.jpg -o -iname *.png convert2webp.sh Files=$(find . -type f -iname *.jpg -o -iname *.png) printf "$Files\n" find .でカレントディレクトリ内を検索します オプション-type fで検索対象を「ファイル」に指定(なお-type dなら対象をディレクトリに指定) -iname *.jpg -o -iname *.pngで検索対象の拡張子をフィルタリング。-inameは大文字、小文字を区別しないで検索(*.jpgも*.JPGも拾う)。-oは「OR」の意味 find 〜のコマンドをFilesへ代入 この時点でprintf "$Files\n"すると、こんな感じ↓ (余談)変数への代入の"="の前後にスペースを入れるとエラーになる convert2webp.sh Files=$(find . -type f -iname *.jpg -o -iname *.png) # OK Files = $(find . -type f -iname *.jpg -o -iname *.png) # NG ちょっとはまった... 参考サイト:シェルで変数への代入方法(ありがちなエラー) for ~ in ~;do ~ done convert2webp.sh for File in $Files do echo $File cwebp -preset photo -metadata icc -sharp_yuv -o $File".webp" -progress -short $File printf "\n----------------\n\n" done for ~ in ~;do ~ doneで$Filesをループ処理。$Fileとして取り出して、一つひとつ変換。 echo $Fileとprintf "\n---\n\n"はターミナル上の進行状況を見やすくするために入れたので、処理自体には入れなくてもよい(不要な)部分です cwebp ~オプション~ $FileでWebP変換 -preset photo -metadata icc -sharp_yuv -o $File".webp" -progress -shortがオプションです 特に-o $File".webp"で出力先および変換後のファイル名を指定していることに注目。この設定では、変換前のファイルと同じディレクトリへ、{$ファイル名}.webpという名称で保存されることになります その他のオプションについては、下記の参考サイトをご参照ください 参考サイト:cwebpのオプション cwebp Encoder 【保存版】知らないと画質が落ちるWebP変換おすすめパラメーター設定例 JPEG/PNG編

Viewing all articles
Browse latest Browse all 2722

Trending Articles