画像をWebPに変換とは？
画像をWebPに変換するツールです。JPGやPNGなどの形式をWebPに変換します。WebPはGoogleの画像フォーマットで、見た目の品質を損なわずにファイルサイズを小さくできます。ページの読み込み時間短縮やCore Web Vitalsの改善に役立ちます。
WebP は Google が開発したフォーマットで、JPEG 型の非可逆圧縮と PNG 型のアルファ透過を組み合わせています。品質 80 でも写真は JPEG より 25〜35% 小さくなり、見た目はほぼ同じです。PNG スクリーンショットは 50〜70% 縮みます。エンコードはすべてあなたの端末上で canvas API により実行されます。
使い方
- JPG・PNG・BMP・WebP・GIF・AVIF・SVG・HEIC のファイルを 1 枚以上アップロード欄にドロップするか、端末から選びます。
- 品質プリセットを選ぶかスライダーを動かす、もしくはロゴやスクリーンショットでピクセル単位の保持が必要なときはロスレスをオンにします。
- 「すべて変換」を押し、各ファイルを個別に保存するか、結果をクリップボードへコピーするか、ZIP でまとめてダウンロードします。
使用するタイミング
- Shopify や WordPress に商品写真をアップする前に容量を落とす。
- ドキュメントの PNG スクリーンショットを、透過のまま小さい WebP に置き換える。
- 1KB が開封スピードに影響するメルマガ素材を準備する。
結果
ブロガーが2.4 MBの商品写真をJPGからWebPに80%の品質で変換します。変換後のファイルはわずか680 KBで、72%の削減を実現しながら、画面上では品質の違いがわかりません。
よくある質問
- 品質はいくつに設定すべき?
- ほとんどの写真は 80 がスイートスポットで、ファイルは大幅に縮みつつ画質劣化は気づかれません。サムネイルやヒーロー画像など容量重視なら 65。印刷や輪郭がはっきりしたグラフィックでのみ 90 以上が必要です。
- WebP は PNG と同じように透過に対応していますか?
- 対応しています。WebP はアルファチャンネルを保持するので、ロゴ、アイコン、透過 PNG スクリーンショットも正しく変換されます。出力ファイルは元の PNG より小さいことがほとんどで、半分程度になる場合も少なくありません。
- WebP はすべてのブラウザで表示できますか?
- Chrome、Firefox、Safari 14 以降、Edge など主要なブラウザはすべてネイティブ対応です。古い Safari や IE は非対応ですが、実トラフィックでは事実上ほぼ存在しません。メールクライアントだけは JPEG のフォールバックを残しておくと安心です。
- PNG スクリーンショットを透過を保ったまま変換できますか?
- はい。PNG をドロップして品質を選べば、アルファチャンネルは WebP 出力に保持されます。シャープな境界線や文字を含む場合は、品質 85 以上にしてエンコーダーで輪郭がぼけないようにしてください。
- 変換後のファイルが元より大きくなることがあるのはなぜ?
- すでに高圧縮済みの JPEG を元にして品質 95+ で変換すると、WebP の方がわずかに大きくなることがあります。WebP の利点が出るのは 70〜85 の範囲です。さらに小さくしたい場合は、品質を一段ずつ下げて試してください。