WebPとは？JPEG・PNGとの違いと変換方法
Webサイトを制作したり、画像をダウンロードしていると「.webp」という拡張子のファイルを見かけることが増えてきました。WebPはGoogleが開発した画像フォーマットで、現在多くのWebサービスや画像配信で標準的に使われるようになっています。
この記事では、WebPとは何か、JPEG・PNGとどう違うのか、そしてどのような場面で使うべきかを解説します。
WebPとは
WebP(ウェッピー)は、Googleが2010年に公開した画像ファイル形式です。ファイルの拡張子は.webpです。もともとWeb上での画像表示を高速化する目的で開発されました。
現在では主要なブラウザ(Chrome、Edge、Firefox、Safari)のほぼすべてでWebPの表示に対応しています。かつてはSafariが対応していなかった時期がありましたが、2020年のSafari14から対応が加わり、現在はWebP非対応の環境はほとんど存在しません。
JPEG・PNGとの比較
| 項目 | JPEG | PNG | WebP |
|---|---|---|---|
| 圧縮方式 | 非可逆圧縮 | 可逆圧縮 | 非可逆・可逆どちらも対応 |
| 透過(アルファ)対応 | 非対応 | 対応 | 対応 |
| アニメーション対応 | 非対応 | 非対応(APNGは別規格) | 対応 |
| ファイルサイズ | 中程度 | 大きめ | 小さい(同品質比で約25〜34%削減) |
| 写真向き | ◎ | △ | ◎ |
| イラスト・図向き | △ | ◎ | ◯ |
WebPのメリット
- ファイルサイズが小さい: 同じ画質のJPEGと比べてファイルサイズを約25〜34%削減できます。Webページの読み込み速度の改善に直接貢献します。
- 透過(アルファ)をサポート: PNGのように背景を透明にした画像を扱えます。ロゴやアイコン、切り抜き画像に使えます。
- アニメーションに対応: GIFと同様のアニメーション表現が可能で、GIFよりもファイルサイズが小さくなります。
- 可逆・非可逆どちらでも使える: 用途に合わせて品質優先(可逆)とサイズ優先(非可逆)を選べます。
WebPのデメリット・注意点
- 対応していないソフトがある: 古い画像編集ソフトやOS標準のビューアによってはWebPを直接開けない場合があります。Photoshopは比較的新しいバージョンから対応しています。
- 印刷物には向かない: WebPはWeb向けのフォーマットです。印刷用途ではTIFFやPDFの方が適しています。
- メールへの添付には注意: 受信者がWebPに対応していない環境の場合、ファイルを開けないことがあります。メール添付や汎用性が求められる場合はJPEGかPNGを選ぶ方が無難です。
どんな場面でWebPを使うべきか
WebPが特に効果的な用途は次のとおりです。
- Webサイト・ブログ・ECサイトに掲載する商品画像やメインビジュアル
- Webページの読み込み速度を改善したいとき(Core Web Vitalsの改善)
- 透明背景が必要でかつファイルサイズを小さくしたいとき(従来はPNG一択だった用途)
一方で、印刷用データ、メールへの添付、汎用性が必要なファイル共有の場面ではJPEGかPNGを使う方が確実です。
WebPへの変換方法
WebPに変換する方法はいくつかあります。
ブラウザだけで変換する
インストール不要で最も手軽なのが、ブラウザ上で動く画像変換ツールを使う方法です。JPEG・PNG・GIFなどの画像ファイルをツールに読み込み、出力形式にWebPを指定してダウンロードします。画像はブラウザ内で処理されるため、ファイルがサーバーに送信されない安全なツールであれば、機密性の高い画像でも安心して使えます。
Photoshopで変換する
Adobe Photoshop(バージョン23.2以降)はWebPの書き出しに対応しています。「ファイル」→「別名で保存」からWebPを選択して保存できます。
コマンドラインツールで変換する
Googleが公式に提供しているcwebpというコマンドラインツールを使うと、大量のファイルを一括変換するのに便利です。開発者環境での一括処理に適しています。