UNIX Cafe | 第24回
はじめに：WebサイトのJPGやPNG画像を、WebPに変換しよう
ページの表示速度が遅い原因、その多くは「画像ファイルの重さ」にあります。そして、サイトの表示速度は、読者の満足度だけでなく、GoogleからのSEO評価にも直接影響する重要な要素です。
「画像は軽くしたいけど、画質は落としたくない…」
「大量の画像を次世代フォーマットのWebP（ウェッピー）に変換したいけど、一枚ずつやるのは大変…」
もし、あなたがこんな悩みを抱えているなら、この記事がその問題を解決します。
今回は、MacやLinuxのターミナル（黒い画面）から使える魔法の道具「ImageMagick」を使って、フォルダ内のJPGやPNG画像をコマンド一発でWebP形式に一括変換する方法をマスターしていきましょう。
なぜ今「WebP」なのか？サイト運営上のメリット
WebPは、Googleが開発したWeb向けの次世代画像フォーマットです。なぜ多くのWebサイトがこぞってWebPを採用するのでしょうか？その理由は明確です。
主要ブラウザは全て対応済み
現在、Chrome, Safari, Firefox, Edgeなど、ほとんどのモダンブラウザがWebPをサポートしており、安心して利用できます。
圧倒的なファイルサイズ削減
JPGやPNGと比べて、同程度の画質を保ちながらファイルサイズを25〜35%以上も削減できます。これにより、ページの読み込み時間が劇的に短縮されます。
JPGとPNGの「いいとこ取り」
JPGのような高圧縮率の写真だけでなく、PNGが持つ**透過（背景の透明）**もサポートしています。まさに万能選手です。
サイト高速化によるSEO効果
ページの表示速度は、Googleがサイトを評価する重要な指標の一つ（Core Web Vitals）です。画像をWebPに最適化することは、ユーザー体験を向上させ、SEO評価を高める直接的な施策となります。
ファイルサイズを抑えつつ画質を保てることは、ユーザー体験の向上にも直結します。
魔法の道具「ImageMagick」をインストールしよう
ImageMagickは、画像の変換・加工をコマンド一つで行える便利なツールです。
サイズ変更や形式変換など、繰り返し作業をまとめて処理できるため、
画像を多く扱う作業では大きな時短につながります。
ImageMagick をインストール（macOS）
macOSではHomebrewを使えば、簡単にインストールできます。
brew install imagemagickWebP一括変換（mogrify）
コマンドを実行すると、同じフォルダ内に [元のファイル名].webp というファイルが自動で生成されます。*.png とすれば、PNGファイルも同様に一括変換できます。
mogrify -format webp *.jpg*.jpg：フォルダ内の JPG を全部対象.webpファイルが同じ場所に生成される
上書きに関する注意点
mogrify は非常に便利ですが、
使い方によっては元の画像ファイルを変更してしまう場合があります。
そのため、元データを残したい場合は、
別フォルダへ保存する方法を選ぶのがおすすめです。
フォルダを分けて安全に変換しよう
別フォルダへ安全に変換する方法
「元のJPGやPNGファイルはそのまま残しておきたい」というのが、実際の運用では最も安全で確実な方法です。
その場合は、magick (または convert) コマンドと for ループ（繰り返し処理）を組み合わせ、変換後のWebPファイルを専用のフォルダに保存します。
元画像を残したまま、別フォルダにWebP画像を保存する
- 変換後のWebP画像を保存するための webp フォルダを作成します。
- for ループを使い、フォルダ内のPNG画像を1枚ずつ取り出します。
- magick コマンドでWebPに変換し、webp フォルダに保存します。
mkdir -p webp
for img in *.png
do
magick "$img" -quality 85 "webp/${img%.*}.webp"
doneコマンドの解説
- -quality 85: 画質を85%に設定。画質とファイルサイズのバランスが良いおすすめの設定です。
- ${img%.*}: シェルの変数展開という機能で、sample.png というファイル名から .png という拡張子を取り除き、sample という名前だけを取得しています。
この方法なら、元の画像は一切変更されないため、安心して何度でも作業を行えます。
いつでも使える「WebP変換スクリプト」を作成する
この便利な処理を、いつでも呼び出せる「自分だけのコマンド（シェルスクリプト）」にしてしまいましょう。以下の内容を convert_webp.sh のような名前でファイルに保存します。
#!/bin/bash
#
# convert_webp.sh
# 使い方: このスクリプトを画像のあるフォルダに置いて実行すると、
# webp/ フォルダ内に変換後の画像が作成されます。
#
TARGET_DIR="webp"
QUALITY=85
# 保存用フォルダがなければ作成する
mkdir -p ${TARGET_DIR}
echo "PNG画像をWebPに変換します..."
for img in *.png
do
FILENAME=${img%.*}
echo " -> ${FILENAME}.webp"
magick "$img" -quality ${QUALITY} "${TARGET_DIR}/${FILENAME}.webp"
done
echo "JPG画像をWebPに変換します..."
for img in *.jpg
do
FILENAME=${img%.*}
echo " -> ${FILENAME}.webp"
magick "$img" -quality ${QUALITY} "${TARGET_DIR}/${FILENAME}.webp"
done
echo "✅ すべての変換が完了しました！"ファイルに実行権限をつける
シェルスクリプトとして保存した場合は、
実行権限を付与することでコマンドとして実行できるようになります。
一度作成しておけば、同じ作業を何度でも簡単に繰り返せます。
chmod +x convert_webp.shそして、実行！
あとは、画像を変換したいフォルダにこのファイルを置き、ターミナルで実行するだけです。
./convert_webp.shこれで、JPGもPNGもまとめて、安全にWebPへ一括変換する作業が自動化できました。
まとめ：コマンド一発でサイトを高速化しよう
ミナちゃんWebP、すごく便利ですね！
しかもまとめて変換できるなんて感動です♪
最後に、今回の重要なポイントをまとめます。
- WebPは、サイトの表示速度改善とSEO対策に非常に有効な画像フォーマット。
- ImageMagickを使えば、大量のJPG/PNG画像をコマンドでWebPに一括変換できる。
- 安全に作業するなら、元画像を別フォルダに保持する for ループを使った方法がおすすめ。
- よく使う処理はシェルスクリプト化することで、誰でも簡単に同じ作業を再現できる。
GUIアプリを何度もクリックする tedious な作業から解放され、コマンド一発でスマートに画像を最適化する。この効率の良さこそ、コマンドラインの醍醐味です。ぜひあなたのWebサイト運営に、この強力な自動化のテクニックを取り入れてみてください。
さらに学びたいあなたへ
📘 用途ごとに選ぶ Linux のおすすめ本
