画像の保存形式と言えば何を思い浮かべますか？ホームページで一般的に使われているものですと、「JPEG」「PNG」「GIF」などが思い浮かぶと思います。
近年ホームページで使われている画像形式に「WebP（ウェッピー）」というものがあります。
WebPは他の画像形式より圧縮率が高く、サイズが軽いことで知られています。
今回はそんな「WebP」について解説していきます。
目次
WebPとは？
WebPとはGoogleが2010年に開発した画像形式で、他の画像形式よりも圧縮率が高いことが大きな特徴です。
これまで主に使われてきた「JPEG」や「PNG」よりも画像の劣化を抑えつつ、サイズの軽量化ができています。
また、背景の透過やアニメーションにも対応しており、幅広い用途での使用が可能です。
高性能な画像形式でしたが、対応ブラウザが限られていたため、なかなか普及が進んでいませんでした。
しかし、2024年6月現在では、WebPはChrome・Edge・Firefox・Safari・Operaなど、ほとんどのブラウザで対応しています。
参照：Can I use…
WebPのメリット
サイズを軽くしても劣化が少ない
これまでは画像のサイズを少なくするために圧縮すると、画質が荒くなったり、画像のサイズを小さくするしかありませんでした。
しかし、WebPは他の画像形式よりも、サイズを軽くしても劣化を抑えることが可能です。
WebPと比較すると、PNG形式なら26％、JPEG形式なら25～34％ほどファイルサイズが軽くなります。
参考：An image format for the Web（Google）
ページの読み込みが速くなる
もともとWebPは、Webサイトを高速表示することなどを目的として開発されました。
画像ファイルが軽くなることで、Webページの読み込みが速くなるため、ホームページ全体の表示速度も速くなります。
昨今では画像を多く使うホームページも多いため、WebPを使うことの大きなメリットとなります。
SEO対策になる
Googleなどの検索エンジンでは、ページの表示速度を検索順位を上げるための評価ポイントのひとつとしています。
WebPを使ってページの読み込みを早くすることで、ユーザーの離脱を防ぐだけでなく、間接的にSEO対策にもなります。
WebPの変換方法
従来の「JPEG」や「PNG」の画像を「WebP」にしたい場合はどうしたらいいのでしょうか。
WebPに変換する方法はいくつかございます。
「Squoosh」を利用する
参照：Squoosh
「Squoosh（スクーシュ）」は、Googleが提供する画像軽量化サービスです。
サイトにアクセスし、画像をドラッグ＆ドロップするだけで、画像の変換が可能です。
圧縮形式もWebP以外に軽量化されたJPEG・PNGなどを選択できますし、1枚ずつ画像の品質を目で確認しながら保存することができます。
ただし、細かい調整ができる反面1枚ずつしか変換ができないため、大量の画像を変換するのは不向きと言えます。
1枚1枚の細かい調整が不要で、一度に多くの画像を変換したい場合は「サルワカ道具箱」など別のサービスを利用する方が手間が省けるかもしれません。
「Photoshop」で保存する
Photoshopのバージョン23.2以降では、WebP形式の編集・保存が可能です。
ただし、「書き出し」や「Web用に保存」ではWebPを選択できないため「コピーとして保存」より、「WebP」を選択して保存する必要があります。
この時に画質等を調整することが可能です。
WordPressプラグインを利用する
もしホームページでWordpressを使っており、ホームページ上の画像をWebPにしたいということでしたら、プラグインの「EWWW Image Optimizer」がおすすめです。
「EWWW Image Optimizer」の設定には「WebP変換」が搭載されています。
「WebP変換」の設定を行うことで、これからアップロードする画像は自動でWebP形式に変換されます。
さらに、これまでアップロードしてきた画像も一括最適化を行うことで、WebPに変換することができます。
まとめ
これまでは表示されないブラウザなどがあり使われていなかったWebPですが、ここまで解説したように従来の画像形式よりも高い圧縮率と品質を持つフォーマットです。
画像サイズを少なくすることで、ユーザビリティやSEOの効果を高めることにもつながります。
もし、ご利用のホームページにWebPを導入したいけれどよくわからない、画像が大量で対処している時間がない、といった場合はぜひ一度フォイスにご相談ください。
