こんにちは、阿久梨絵です!
Web サイトの表示速度を上げたいとき、画像の軽量化はとても大切です。
その中でも WebP 形式は、JPEG や PNG よりも軽く、画質も保ちやすい便利なフォーマットです。
この記事では、Google が提供する公式ツール cwebp を使って、Mac と Windows の両方で WebP 変換を始める方法をやさしく紹介します。
「コマンドラインは苦手…」という方でも安心して進められるよう、順番に説明していきます。
WebP 変換ツール「cwebp」とは
cwebp は Google が提供している 画像を WebP に変換するためのコマンドラインツールです。
・JPEG / PNG / TIFF などを WebP に変換できます
・品質(画質)を細かく調整できます
・PNG の透明度(アルファチャンネル)も保持できます
・劣化なし(ロスレス)変換にも対応しています
Web サイトの最適化やブログ運営にとても役立つツールです。
Windows でのインストール方法
① Google 公式ページからダウンロードします
公式ダウンロードページ
https://developers.google.com/speed/webp/download
1. ページを開く
2. Windows 用 ZIP をダウンロード
3. ZIP を解凍すると bin フォルダの中に cwebp.exe が入っています
インストール作業は不要で、解凍するだけで使えます。
② PATH を通すと便利です
毎回フォルダを開かなくても使えるように、PATH に追加する方法もあります。
1. 解凍したフォルダの bin のパスをコピー
2. Windows の「環境変数」を開く
3. PATH に追加する
これでどのフォルダからでも cwebp が実行できます。
macOS でのインストール方法
① Homebrew を使う方法(最も簡単)
Homebrew を使っている場合は、この一行で完了します。
brew install webp
PATH 設定も不要で、すぐに cwebp が使えるようになります。
② Google 公式バイナリを使う方法
Windows と同じ公式ページから macOS 用 ZIP をダウンロードできます。
1. 公式ページへアクセス
2. macOS(arm64 / x86_64)を選んで ZIP をダウンロード
3. 解凍すると bin フォルダに cwebp が入っています
そのまま使うか、PATH に追加すればどこからでも実行できます。
WebP への変換方法(基本の使い方)
最もシンプルな変換
cwebp input.png -o output.webp
・input.png:変換したい画像
・-o output.webp:出力ファイル名
これだけで WebP が作れます。
品質を調整したいとき(-q オプション)
cwebp -q 80 input.jpg -o output.webp
・-q 80 は「品質80」です
・数字が大きいほど画質が良く、ファイルサイズは大きくなります
・Web 用なら 70〜85 がバランスの良い範囲です
PNG の透明度を保持したまま変換したいとき
透明 PNG のアルファチャンネルは自動で保持されます。
cwebp input.png -o output.webp
特別なオプションは不要です。
劣化なし(ロスレス)で変換したいとき
cwebp -lossless input.png -o output.webp
画質を一切落とさずに WebP に変換できます。
アイコンや UI 素材など、劣化させたくない画像に向いています。
よく使うオプションまとめ
| オプション | 説明 |
|---|---|
-q <0-100> | 品質を指定します |
-lossless | 劣化なしで変換します |
-m <0-6> | 圧縮の最適化レベルを指定します |
-resize W H | リサイズして出力します |
-o <file> | 出力ファイル名を指定します |
必要なものだけ組み合わせれば大丈夫です。
まとめ
画像を WebP に変換する方法は、一見すると専門的でむずかしそうに感じられます。
ですが、実際に手を動かしてみると、Mac でも Windows でも、たった一行のコマンドで変換できるシンプルな作業だと気づけます。
今回紹介した cwebp は、Google が提供している信頼性の高いツールで、次のようなメリットがあります。
・JPEG や PNG よりも 軽くて高速に読み込める WebP を簡単に作れる
・-q オプションで 画質とファイルサイズのバランスを自由に調整できる
・PNG の 透明度(アルファチャンネル)をそのまま保持できる
・-lossless を使えば 劣化なしのロスレス変換も可能
・Mac でも Windows でも 数分で導入できる手軽さ
Web サイトの表示速度は、読者の離脱率や SEO にも影響します。
だからこそ、画像最適化は「小さな工夫で大きな効果が出る」取り組みのひとつです。
そして、cwebp はその第一歩としてとても頼もしい存在です。
WebP 変換は、難しい技術ではなく、あなたのコンテンツをより快適に届けるための小さな工夫です。
今回のガイドが、その一歩を踏み出すきっかけになれば嬉しいです。
阿久梨絵でした!
