WebPとは
WebPは「ウェッピー」と読み、Googleが開発した画像形式のことを指します。画質の劣化を最小限に抑え、画像サイズを軽くすることを目的として開発されました。透過処理やアニメーション対応も可能なため、既存の画像形式のいいとこ取りをしたような画像形式です。ただし、発表された2010年9月当初は対応するブラウザがごく一部だったことから、普及がなかなか進んでいませんでした。
しかし、2018年にChrome以外にシェア率の高いWebブラウザであるFirefoxやMicrosoft Edgeが対応したこと、2020年にはAppleのiOS・iPadOS14以降のSafariに対応したことなどから、今後どんどんWebPの利用は進んでいくことと予想されます。参考：「2月デスクトップブラウザシェア、Chrome急増とEdge減少の日本」
WebPを使うメリット
WebPを使うメリットについて、3つご紹介します。
画像サイズが軽くなる
WebPを使うと、圧縮したときの画像ファイルのサイズを軽くできます。一般的に、単に画像のファイルのサイズを軽くしようとする場合、画質を粗くしたり、画像の大きさを変えたりするしかありません。しかし、WebPでは画質を保った状態でサイズを軽くできます。例えば、既存の「JPEG」と比べると、約25〜30％ほどファイルサイズが軽くなります。
ページの表示速度が速くなる
画像のファイルのサイズが軽くなることで、Webページの読み込みが早くなり、サイト全体が表示される速度が速くなります。そもそもWebPが開発された理由のひとつがWebサイトの表示速度改善なので、当然とも言えるでしょう。
サイトの表示速度は、ユーザーに見てもらいやすくするためにも重要です。せっかくユーザーがサイトを見たいと思っても、サイトの読み込み時間が長いと諦めてしまうこともあります。より多くのユーザーにWebサイトを見てもらうためには、サイトの表示速度も大切なのです。
SEO対策になる
上記のユーザーの利用しやすさとも関係しますが、ページの表示速度が速いことは、Googleの検索アルゴリズムで高く評価されます。ページの表示速度が速いサイトは、ユーザーにとってより利用しやすく、有益なWebサイトだと考えられるからです。
とはいえ、ページの表示速度に関わるのは画像の表示速度だけではありませんので、SEO対策でWebPを利用する場合はその他の要素も合わせて考えましょう。また、Webページに使われている画像全体をWebPに変換するには手間も時間もかかるため、どの事項を優先するかもポイントです。
WebPを使うデメリット
さまざまな面で便利なWebPですが、デメリットもあります。今回は、主なデメリットを2つご紹介します。
画像変換の手間がかかる
WebPは、形式に直接対応していない画像編集ソフトも多く、一度別の画像形式に書き出してからWebPに変換しなくてはならないこともあります。例えば、よく使われるIllustratorやAdobe XDなどの画像編集ソフトは直接WebPの形式で書き出すことができません。そのため、一度JPEGやPNGなど他の画像形式で書き出してから、WebPにする必要があります。
ただし、画像やイラスト・デザイン制作などで最もよく使われるPhotoshopが2022年2月に、プラグインや環境設定をしなくてもWebPで書き出すことができる最新バージョンを発表しました。最新バージョンのPhotoshopを使っている場合は、WebPを使ってみてはいかがでしょうか。
非対応のブラウザもある
シェア率の高いブラウザが多くWebPに対応したとはいえ、Internet Explorerなど一部のブラウザや、iOS13以前のSafariなど一部のブラウザは非対応です。これらの非対応ブラウザ利用者のためには、JPEGやPNGなどのこれまでの形式の画像を表示させることで対応することも可能です。また、古いブラウザやシステムはだんだん使われなくなっていくでしょうから、それほど大きなデメリットとは言えないでしょう。
WebPと他の画像形式との違い
ここでは、WebPと他の画像形式との違いについて、詳しく解説します。
WebPとJPEGの違い
WebPとJPEGの大きな違いは、JPEGでは背景などの透過処理ができないこと、アニメーションの表示ができないことです。
一方、1,670万色以上の色を表現できることは同じであり、繊細な色彩の表現が可能なことはどちらの形式でも同じです。そのため、WebPもJPEGも写真の保存に適した画像形式だとされています。
WebPとPNGの違い
WebPとPNGの違いは、PNGではアニメーション表示ができないことや、圧縮した際のファイルサイズが大きいことです。逆に、ファイルサイズが大きい分、元のデータを残したまま圧縮できる「可逆圧縮」という方式に対応していることから、一度圧縮した後でも元のデータに戻すことができます。
また、PNGは表示色が256色〜1,670万色と非常に幅が広いです。容量が大きくなるため、写真の保存には適していませんが、ロゴやシンプルなイラストを可逆圧縮かつ低容量で保存することができます。
WebPとGIFの違い
WebPとGIFの違いは、表現できる色数の違いです。GIFで表現できる色の数は最大256色のため、画像が粗くなりやすいのが特徴です。ただし、透過処理・アニメーションなどに対応しているため、JPEGやPNGと比べるとよりWebPに近い画像形式だと言えるでしょう。
GIFは前述の特徴から、グラデーション表示の少ないイラストやアイコン、フォントなどに適した画像形式とされていました。ただし、アニメーションを圧縮した時のサイズはGIFよりもWebPの方が、ファイルサイズが軽くなりますので、今後は色数の多いWebPで代替されていくことも増えていくのではないでしょうか。
WebPに変換するには？
最後に、他の画像形式からWebPに変換する方法についてふたつ紹介します。
Google公式「WebPShop」を使う
ひとつ目は、最新バージョンのPhotoshopではなく古いバージョンのPhotoshopを使っている場合、Google公式が提供しているPhotoshop用のプラグインを使って変換する方法です。「WebPshop」というプラグインをPhotoshopに導入することで、WebP画像を開いたり、編集したりすることが可能になります。
プラグインをダウンロードしたら、「bin」フォルダ内の「WebPShop.8bi」（Windows）または「WebPShop.plugin」（Mac）を、それぞれ「Photoshop」内「Plug-ins」ファイルにコピーすれば、導入完了です。
画像データ変換サイトを使う
WebPに変換できる画像データ変換サイトを使うのも手軽な方法です。特に、Google公式が提供している「Squoosh」は非常によく使われていて、アプリ版も提供されています。使い方は非常に簡単で、以下の手順で変換できます。
- 「Drop OR Paste」に、変換したい画像をドラッグ＆ドロップする。
- 必要に応じて画像を編集する。
- 「Compress（圧縮形式）」でWebPを選択する。
- 「Quality（画像の品質）」を設定する。
- 下部のダウンロードボタンをクリックし、完了。
SquooshはGoogle公式ということもあり、WebPへの変換の他、他の画像形式への変換にも非常に使い勝手の良いサイトですが、1枚ずつしか変換できないため、複数画像をまとめて変換するには手間がかかります。他にも画像データ変換サイトはたくさんありますので、使いやすいサイトを探してみるのがおすすめです。
WebPを活用し、画像サイズを軽くしてSEO対策につなげよう
WebPはGoogleが開発した画像形式のことで、これまで使われてきた「JPEG」「PNG」「GIF」などのいいとこ取りをしたような、透過処理・色数・アニメーションなどさまざまなことに対応した画像形式です。ファイルサイズも軽くなるので、ユーザーの満足度向上にも、SEO対策にも有効です。主要ブラウザのほとんどが対応したので、ぜひ、WebPを使ってみてください。
