WebP（ウェッピー）は、Googleが開発した画像形式で、ホームページの表示速度改善を目的に設計されています。JPEGやPNGと比べてファイルサイズを大幅に小さくできるため、近年多くのホームページで採用が進んでいます。一方で、導入のタイミングによってはSEOに影響が出るケースもあり、メリットだけでなくデメリットも把握したうえで活用することが重要です。
この記事では、WebPの基本的な特徴から他の画像形式との違い、SEOへの影響、変換方法まで解説します。
WebPとは
WebPは、Googleが2010年に開発した画像形式です。拡張子は「.webp」で、JPEGやPNG、GIFといった従来の画像形式に比べて高い圧縮率を持ちながら、画質を保ったままファイルサイズを小さくできる点が最大の特徴です。
ホームページで使用する画像を軽量化できるため、ページの表示速度改善を目的に多くのホームページで採用が進んでいます。透過処理やアニメーションにも対応しており、JPEG・PNG・GIFそれぞれの特性を一つのフォーマットで実現できます。現在では主要なブラウザのほぼすべてがWebPに対応しており、実用上の障壁はほとんどなくなっています。
WebPと他の画像形式の違い
WebPはJPEG・PNG・GIFそれぞれの特性を兼ね備えた画像形式です。各形式との主な違いを紹介します。
JPEGとの違い
JPEGは写真のような色数の多い画像に適した形式で、非可逆圧縮によって高い圧縮率を実現しています。ただし、圧縮率を上げるほど画質が劣化し、保存のたびに画質が落ちていくという特性があります。また、透過処理やアニメーションには対応していません。
WebPはJPEGと同様に非可逆圧縮に対応しながら、可逆圧縮にも対応しています。同等の画質であればJPEGより25〜34％ほどファイルサイズを小さくでき、透過やアニメーションにも対応している点がJPEGにはない強みです。
PNGとの違い
PNGは可逆圧縮に対応しており、何度保存しても画質が劣化しない形式です。透過処理が可能なため、ロゴやイラストなどに広く使われています。ただし、JPEGと比べてファイルサイズが大きくなりやすいという弱点があります。
WebPはPNGと同様に可逆圧縮と透過処理に対応しながら、PNGより約26％小さいファイルサイズで保存できます。画質を落とさずに容量を抑えられる点で、PNGの上位互換として機能します。
GIFとの違い
GIFはアニメーションに対応した形式として長く使われてきましたが、扱える色数が256色に限られるため、写真のような色数の多い画像には向いていません。
WebPはGIFと同様にアニメーションに対応しながら、1,677万色以上の色表現が可能です。ファイルサイズもGIFより小さくなるケースが多く、アニメーション画像においてもWebPはより優れた選択肢といえます。
WebPのメリット
WebPは従来の画像形式と比べて多くの面で優れています。ここでは、実際に使う上で感じられるメリットを紹介します。
ファイルサイズを小さくできる
WebPはJPEGと比べて25〜34％、PNGと比べて約26％ファイルサイズを小さくできます。
画像を多く使うホームページでは、この差がページ全体の表示速度に直結します。表示速度が上がると、ページを開いてすぐに離脱するユーザーが減り、滞在時間の改善にもつながります。特にスマートフォンからのアクセスが多いホームページほど効果を実感しやすく、通信環境が限られる場面でもスムーズに画像を表示できます。
サーバーへの負荷軽減にもつながるため、アクセスが集中しやすいページでも安定した表示が期待できます。
画質が劣化しにくい
WebPは可逆圧縮と非可逆圧縮の両方に対応しています。
可逆圧縮は圧縮しても元の画質に完全に戻せる方式で、JPEGのように保存するたびに画質が落ちていくことがありません。非可逆圧縮はより高い圧縮率を実現できる方式ですが、WebPはJPEGと比べて同じ圧縮率でも画質の劣化が少なく、より滑らかな見た目を保てます。
どちらの方式でも画質の劣化を最小限に抑えられるのが、WebPの強みです。
透過・アニメーションにも対応している
WebPはPNGのように背景を透明にした画像を扱えるほか、GIFのようなアニメーション画像にも対応しています。
これまでロゴや透過画像はPNG、動きのある画像はGIFと使い分けていた場合でも、WebPに統一することで管理の手間を減らせます。PNGは透過画像をきれいに保存できる反面ファイルサイズが大きくなりやすく、GIFは256色しか扱えないため表現に限界がありました。
WebPはこれらの弱点を補いながら、より小さいファイルサイズで同等の表現を実現できます。
ブラウザの対応状況が広い
Chrome・Firefox・Safari・Edgeなど、現在主流のブラウザはほぼすべてWebPに対応しています。
以前はiPhoneのSafariが非対応だったため導入を見送るケースもありましたが、現在はその問題も解消されています。国内でもスマートフォンからのアクセスが大半を占めるホームページが増えているなかで、主要なデバイスとブラウザをほぼカバーできる点は実用上の大きなメリットです。
特別な設定をしなくても多くのユーザーに正しく表示されるため、安心して導入できる画像形式といえます。
WebPのデメリット
WebPには多くのメリットがある一方、導入前に把握しておきたいデメリットもあります。
古いブラウザでは表示できない場合がある
現在の主要なブラウザはほぼすべてWebPに対応していますが、Internet Explorerや古いバージョンのSafariなど、一部の旧式ブラウザでは表示できないケースがあります。
ただし、こうした環境を使っているユーザーは現在では非常に少なく、一般的なホームページにおいて大きな問題になることはほとんどありません。社内システムや特定の業務環境で古いブラウザを使用している可能性がある場合は、事前に確認しておくと安心です。
画像を変換する手間がかかる
JPEGやPNGで作成した画像をWebPで使用するには、変換作業が必要です。
1枚ずつ手作業で変換するのは手間がかかるため、SquooshやPhotoshopなどのツールを活用するのが現実的です。WordPressを使用している場合はプラグインで自動変換できる環境を整えることで、運用上の負担を減らせます。
WebPのSEOへの影響
WebPの導入はSEOにも影響します。プラスに働く面とリスクになる面の両方を理解したうえで活用することが重要です。
表示速度の改善でSEO効果が高まる
Googleはページの表示速度をランキング要因のひとつとして明言しています。
WebPはJPEGやPNGよりファイルサイズを小さくできるため、画像の多いページでも読み込み時間を短縮できます。特にPageSpeed Insightsの改善項目として「次世代フォーマットでの画像の配信」が挙げられ、WebPへの変換はスコア向上に直結しやすい対策のひとつです。
ユーザー行動が改善され検索順位に良い影響を与える
表示速度が上がると、ページを開いてすぐに離脱するユーザーが減り、滞在時間や回遊率の改善につながります。
Googleはこうしたユーザー行動のデータを検索順位の評価に活用しているとされており、WebPの導入による表示速度の改善が間接的に検索順位の向上につながる可能性があります。ただし、WebPに変換するだけで検索順位が大きく上がるわけではなく、あくまでSEO対策の一環として捉えることが大切です。
運用中の差し替えでクロール済み – インデックス未登録になることがある
WebPはリニューアル時に一括で導入した場合は問題が起きにくいのですが、運用中に既存の画像をWebPに差し替えると、クロール済み – インデックス未登録になるケースが確認されています。
画像をWebPに差し替えるとURLが「image.jpg」から「image.webp」に変わります。Googleはこれを別の画像として認識するため、以前と同じ画像をアップすると重複画像と判断され、クロール済み – インデックス未登録の状態になると考えられます。
WebPを運用中に導入する際は、この点を念頭に置きながら進めることをおすすめします。
WebPへの変換方法
WebPへの変換はいくつかの方法があります。ここでは代表的な2つのツールを紹介します。
Photoshopはコピーを保存からWebPを書き出せる
Photoshopの現行バージョンではWebPが標準でサポートされており、特別なプラグインなしで書き出せます。
メニューから「ファイル」→「コピーを保存」を選択し、ファイル形式の一覧からWebPを選ぶだけで変換できます。画像の編集から書き出しまでを一貫して行えるため、普段からPhotoshopを使っている方にとっては最もスムーズな方法です。
Squooshはブラウザ上で変換できる
SquooshはGoogleが提供する無料の画像変換ツールで、ブラウザ上で動作するためインストール不要で使えます。
変換したい画像をドラッグ＆ドロップするだけで操作でき、圧縮率や画質を細かく調整しながら変換後の仕上がりをリアルタイムで確認できます。WindowsでもMacでも使えるため、Photoshopを持っていない方でも手軽にWebPへ変換できます。
まとめ
WebPはGoogleが開発した画像形式で、JPEGやPNGと比べてファイルサイズを小さくしながら画質を保てる点が最大の特徴です。表示速度やユーザー行動の改善を通じてSEOにも好影響を与える可能性があり、ホームページにおいて導入を検討する価値は十分にあります。
一方で、運用中に既存の画像をWebPに差し替えるとクロール済み – インデックス未登録になるリスクには注意が必要です。リニューアルのタイミングで一括導入するか、運用中に導入する場合はこのリスクを把握したうえで進めることをおすすめします。
PhotoshopやSquooshを使えば手軽に変換できるため、まずは新しく追加する画像からWebPを試してみるのもひとつの方法です。
