次世代画像フォーマットWebP（ウェッピー）って凄い！

上のアイキャッチ画像はWebPフォーマット画像をアップロードしました。データ量はなんと驚きの19.3KB

下の画像がオリジナルJPEGフォーマット画像で52.5KB

オリジナルJPEGフォーマット画像と比較して、WebPフォーマット画像がほとんど画質の劣化がないことがわかると思います。

Maru

そこで、

WebP（ウェッピー）とは何か？
WebPは導入するとどんなメリットがあるのか？
従来使用されていた画像フォーマットとWebPフォーマットの違いは？
WebPの使い方は？

そんな疑問に、初心者にもわかりやすく解説していこうと思います。

次世代画像フォーマットWebP（ウェッピー）
1. WebP対応ブラウザの推移
WebPフォーマットと JPEG・PNG・GIFフォーマットの違い
WebP変換方法
まとめ

次世代画像フォーマットWebP（ウェッピー）

WebP（ウェッピー）とは、Googleが開発した新しい画像を表示する方法（画像フォーマット）
Web用の画像形式として開発されました。

2021年7月バージョンアップWordPress5.8から、WebP（ウェッピー）が使えるようになりました。今後、WebPがスタンダード化していく流れのようです。

現在、Webサイトで一般的に使用されている画像フォーマットは、JPEG、PNG、GIF。これら一般的画像フォーマットと比較すると、WebPは画像の画質を低下することなく圧縮し、画像データを軽量化。軽量化すると、そのWebサイトの表示は高速化できると同時に、リッチなサイトが実現。WebPはSEO対策上でも有効な手段になります。

拡張子（ファイルの種類を表示、ファイル名の後に記載）は「.webp」

参考：GoogleDevelopers

An image format for the Web | WebP | Google for Developers

Learn about this image format that creates smaller images for the web and get links for converter downloads and support.

WebP対応ブラウザの推移

Webp（ウェッピー）の仕様が公表され、ツール提供開始したのは2010年9月。

当時は、ほとんどのブラウザがWebP非対応でした。Webサイト上にWebPフォーマット画像を設置しても、閲覧する側のユーザーが使用するブラウザのほとんどはWebP非対応。非対応ブラウザ使用していると、ユーザーがサイトを訪問してもWebP画像は表示できませんでした。ブラウザ非対応が足かせになり、WebPに大きなメリットがあってもなかなか普及は進まなかったようです。

その後、以下の通り、代表的なブラウザがWebPに対応するようになりました。
2018年 Firefox、Microsoft EdgeがWebp対応
2020年 Apple iOS-14以降Webp対応

下図は、WebP画像形式に対するブラウザ対応状況の詳細資料です。

資料：BrowserStack.Inc　2021年8月ブラウザテスト

グリーン･････WebP対応しているブラウザ、中に記載された数字はブラウザのバージョン

2020年以降、このように主要ブラウザでWebp対応することになり、普及が一気に加速しそうです。2021年8月、主な非対応ブラウザはInternet Explorer。2022年6月16日、Internet Explorer11のサポートが終了し、Internet ExplorerでWebサイト閲覧できなくなる予定。将来的に、大部分がWebP対応ブラウザになる見込みです。

サイト運営するうえでも、WebP移行する時期かもしれません。