🖼️
PNGやJPGを効率的にWebPへ！おすすめ変換方法3選
💡 はじめに
WebP形式は PNGやJPGよりも軽量で高画質、2025年現在では主要ブラウザでほぼ完全対応しています。
サイトの高速化やSEOにも効果的ですが、問題は「どうやって効率的に変換するか」。
この記事では、環境やスキルに合わせて選べる 3つの変換方法 を紹介します。
🌐 結論：一番早いのはオンラインツール
とにかく手軽に済ませたいなら、オンラインツールに画像をドラッグ＆ドロップするだけ。
これで一瞬でWebPに変換できます。
代表的なサービスは以下の通り：
- Squoosh（Google公式・画質調整可能）
- Convertio（多形式対応）
- PNG・JPEGをWebP画像に一括変換｜サルワカWebツール（個人的イチオシ）
👉 一番早く・簡単に済ませたいなら、この方法でOKです。
😭 社内規程でオンラインNGな人へ：コマンドラインで変換
「外部サービスにファイルをアップできない…」
そんな人には ローカルで動くコマンドライン変換 がおすすめです。
📂 基本の流れ
- ターミナル/PowerShellを開く
-
画像があるフォルダに移動する
例（Mac/Linux）:例（Windows PowerShell）:cd ~/Desktop/imagescd C:\Users\あなたの名前\Desktop\images - 変換コマンドを実行する
✅ 単体ファイルを変換（Mac/Linux）
cwebp sample.png -o sample.webp
✅ フォルダ内のPNGを一括変換（Mac/Linux）
for file in *.png; do
cwebp "$file" -o "${file%.png}.webp"
done
✅ フォルダ内のPNG+JPGをまとめて変換（Mac/Linux）
for file in *.png *.jpg; do
[ -e "$file" ] || continue
cwebp -q 80 "$file" -o "${file%.*}.webp"
done
-
-q 80→ 画質を80%に調整（デフォルトは75） - 数字を下げると軽くなる、上げると高画質
✅ Windows PowerShellで一括変換（PNG+JPG）
Get-ChildItem *.png, *.jpg | ForEach-Object {
cwebp -q 80 $_.FullName -o ($_.BaseName + ".webp")
}
👉 「意味わからんけどこのコマンド打てば一括変換できる」状態でOK。
慣れてきたら -q で画質調整を覚えるとさらに便利です。
😨 コマンドラインが怖い人へ：デザインツールで変換
どうしても「黒い画面にコマンドを打つのは怖い…」という人もいます。
そんな場合は普段の制作ツールに頼りましょう。
🎨 Photoshop
- 2022年以降のバージョンなら標準でWebP対応済み
- [書き出し形式] で WebP を選ぶだけで変換可能
🎨 Figma
- 標準ではWebPに非対応
- 「WebP Exporter」などのプラグインを入れて対応
✅ まとめ
- 最速で簡単 → オンラインツール
- 外部NGなら → コマンドラインで一括変換
- コマンドが怖ければ → PhotoshopやFigmaプラグイン
環境やルールに合わせて、自分に合った方法を選べばOK！
Discussion