はじまり
![リサちゃん](https://www.endorphinbath.com/wp-content/uploads/2021/10/02_nayutarisa_001-1.png)
うーん、画像を1枚ずつWebpに変えるのが面倒だな・・・。
![135ml](https://www.endorphinbath.com/wp-content/uploads/2021/10/01_kinkinbeer135ml_001-2.jpg)
じゃあ一括で変えられるようにしよう。
画像のサイズを小さくしたい
というのが、今回の記事の主旨です。
JPEGとかPNGって重いんですよね。
スマホのカメラで何かしらを撮影すると大体JPEG形式になりますよね。また、スクリーンショットを撮ると、JPEGだったりPNGだったりで保存されます。
しかし、これらの拡張子で保存された画像ファイルは重いことに気付きました。まあ、PNGの拡張子が開発されたのは1990年代らしいですし、JPEGに至っては1980年代後半らしいです。そりゃあ、30年以上前の規格よりも効率的な拡張子がホイホイ存在していても、何ら不思議なことではない。
![](https://www.endorphinbath.com/wp-content/uploads/2024/06/20240606_01.webp)
そこで今回は、JPEGやPNGよりもサイズが軽くて同程度の画質の画像を実現できる「WEBP」拡張子の画像を作っていきます。
WEBPは、Googleによって2010年に初版が発行された画像フォーマットです。(2010年となると、現在の情報化社会の時代ではそんなに新しくもない気がしてしまいますが、前述のヤツらよりはよっぽど新しいです。)
WEBPはアルファチャンネルを持っているので、PNGからの変換も可能になります。
これまではSquooshを使っていたが・・・
最近までは、「Squoosh」というGoogleから提供されている画像圧縮かつWebpに変換できるツールを利用していました。
同じWebp形式への圧縮でも、他のサービスと比べて圧縮率が高く、気に入って使っていたのですが、
1つ難点として、「1枚ずつしか圧縮することが出来ない」というのがありました。
![](https://squoosh.app/c/icon-large-maskable-c2078ced.png)
一気にWebpに変換できるツールを作りたい
Squooshのように1枚1枚圧縮率などを設定するほどのこだわりが無いのであれば、一気に変換できた方が良いですね。
ということで今回は、Powershellを使って、フォルダ内にあるJPGなどの画像をWebpに変換するコマンドを練っていきましょう。
以前にExif情報から画像ファイルをリネームして、その画像をjpgやpngからwebpに変換して、このwebp画像に再びExif情報を反映するツールを作りましたが、この時はSquooshでwebp画像を作っていました。
Cwebpというものを使う
Powershellから画像をWebpに変換するためのツールに、「Cwebp」というものを使います。
Cwebpは、Webpを開発しているGoogleによって提供されているツールで、「Libwebp」というライブラリの中の一機能になります。
Cwebpのリファレンスはこちらになります。
![](https://www.gstatic.com/devrel-devsite/prod/vcb16788a46369f41192d8988c5149cea86bddfebb91a7fb85ede926f44da4a35/developers/images/opengraph/google-green.png)
Cwebpのインストール
Cwebpは、Powershellにビルトインされているライブラリではないので、インストールします。
公式からダウンロードできるリポジトリが提供されてはいますが、僕の場合は上手くインストールできませんでした。
そこで今回は、「Scoop」というパッケージ管理ツールを使って、「Cwebp」の機能を持つライブラリである「Libwebp」をインストールしたいと思います。
Powershellを開いたら、Cドライブのルートディレクトリに移動して、「Scoop」のインストール後、「Libwebp」をインストールします。
Powershell
cd \ # Change to "C:\" directory.
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser
Invoke-RestMethod -Uri https://get.scoop.sh | Invoke-Expression
cd C:\Users\%USERNAME%\Downloads\picture_backup
scoop update
scoop install libwebp
以下のhelpコマンドが動いたら、「Cwebp」をコマンドで使う準備は整いました!
Powershell
cwebp -h
Webpに変換するコード
今回出来たコードはこちらです。こちらの記事を参考にさせていただきました。
Powershell
$TargetFolder = ".";
if ($null -ne $Args[0]) {
$TargetFolder = $Args[0];
};
$Files = (Get-ChildItem $TargetFolder -Name -File -Include "*.jpg");
$Files += (Get-ChildItem $TargetFolder -Name -File -Include "*.png");
$updatedCount = 0;
foreach ($File in $Files) {
$FullName = "$TargetFolder/$File";
$Extension = (Get-Item $FullName).Extension;
$GenerateFileName = "$($FullName.Substring(0,$FullName.Length-$Extension.Length)).webp";
Write-Output "<Source File Name: $File>";
cwebp -preset photo -metadata "exif,icc" -sharp_yuv -q 75 -o $GenerateFileName -progress -short $FullName;
$updatedCount++;
Write-Output "----------------";
};
Write-Output("{0} .webp images converted." -f $updatedCount);
以下のフォルダの状態で実行すると・・・、
![](https://www.endorphinbath.com/wp-content/uploads/2024/06/20240606_11.webp)
実行後はこんな感じに画像がWebpに変換されます。
![](https://www.endorphinbath.com/wp-content/uploads/2024/06/20240606_12.webp)
実行するとこんな感じにログが出力されます。
<Source File Name: 20240605_01.png>
67734 42.67
----------------
<Source File Name: 20240605_10.png>
68358 42.78
----------------
<Source File Name: 20340605_07.png>
25408 41.78
----------------
3 .webp images converted.
上記で使用した、cwebp
コマンドのオプションは以下になります。
オプション | 効果 |
---|---|
-metadata | 変換前から変換後のファイルにメタ情報をコピーすることが出来る。(all, none, exif, icc, xmpから選ぶ。カンマ区切りでも表記できる。) |
-sharp_yuv | より圧縮率を上げることが出来る。しかし、圧縮速度が遅くなるらしい。 |
-progress | 変換中の進捗度を表示する。 |
-short | 変換後のファイルサイズとPSNR(Peak-Signal-To-Noise ratio:平たく言うと「劣化していない」率のこと。)の情報だけを表示する。 |
-q | 変換前の画質を100とした場合の、変換後の圧縮率。 |
-o | 変換後の絶対ファイル名。 |
Webpに変換する前とその後の比較
Webpに変換する前後の画像の画質を比較してみます。
PNGからWEBPに変換する
こちらが変換前のPNGです。
![](https://www.endorphinbath.com/wp-content/uploads/2024/06/20240606_21-1024x485.png)
こちらが変換後のWEBPです。
![](https://www.endorphinbath.com/wp-content/uploads/2024/06/20240606_22-1024x485.webp)
ほとんど変化はないと思います。
これで、この画像の場合、容量が974KB→67KBにダウンサイズされるので、Webpは例えばクラウドストレージを使う上で頭を悩ませる容量不足には、もってこいの拡張子です。
JPGからWEBPに変換する
こちらが変換前のJPGです。
![](https://www.endorphinbath.com/wp-content/uploads/2024/06/20240606_23-1024x576.jpg)
こちらが変換後のWEBPです。
![](https://www.endorphinbath.com/wp-content/uploads/2024/06/20240606_24-1024x576.webp)
この画像の場合、容量が401KB→248KBにダウンサイズされます。先程よりは圧縮率が低いです。さっきのPNG画像は黒い部分が多かったから圧縮率が高かったのでしょうか。
まとめ
本記事のまとめです。
- 画像のサイズを小さくしたい: JPEGとPNGのサイズの重さとWEBPの利点
- Cwebpのツール紹介
- Cwebpのインストール: インストール手順
- Webpに変換するコード: Powershellコードの紹介
- Webpに変換する前とその後の比較: PNGとJPGの2パターン
これでデジタル資産のサイズを減らせる嬉しい!
おしまい
![リサちゃん](https://www.endorphinbath.com/wp-content/uploads/2021/10/02_nayutarisa_003.png)
ああ、これで100枚の画像を一気にWebpに出来る!
![135ml](https://www.endorphinbath.com/wp-content/uploads/2021/10/01_kinkinbeer135ml_001-2.jpg)
かなりダウンサイズ出来るな。
以上になります!
コメント