サイトコンテンツを作る際、画像の作り掲載すると思います。その際の画像の形式として従来はJPEG・GIF・PNG・SVCあたりが使われてましたが、それらよりも、Googleが開発した、より軽量化された画像形式がWebPです。
今後、Googleの検索エンジンはCore Web Vitals（コアウェブバイタル）などを含み、サイトの軽量化を促進していくことと思われます。サイト軽量化の最短が画像軽量化なので、サイト運用で多用される可能性が高いWebPについて知っておきましょう。
WebPとは
Googleの示した事例で、従来の画像形式からのファイルサイズの圧縮は下記になります。
- 非可逆圧縮モードで同一画像・同等画質のJPEGと比較して25-34%圧縮
- 可逆圧縮モードで同一画像・同等画質のPNGと比較して28%圧縮
（参考サイト：wikipedia「WebP」）
上記からわかるように従来の画像形式の約4分の1程度の圧縮に成功しています。このように従来より画質を落とさず圧縮ができるので、Googleが推し進めるウェブサイトの軽量化に適した画像形式が、今後WebPになる可能性は高いと考えられます。
WebPのメリット
簡単に説明すると、画像を圧縮して元に戻した時、元に戻らないのが非可逆圧縮、そのまま元に戻るのが可逆圧縮。アルファチャネルは背景を透過できるか否かです。WebPは圧縮して元に戻すことはできず、透過が利用できる画像形式ということになります。
| 画像形式の対応表 | ||||
|---|---|---|---|---|
| 対応 | WebP | JPEG | PING | GIF |
| アルファチャネル | 対応 | – | 対応 | – |
| 圧縮 | 非可逆圧縮 | 非可逆圧縮 | 可逆圧縮 | 可逆圧縮 |
上記のように、アルファチャネルにも対応していて、圧縮率が上述のよくある画像形式よりも高いことから、今後ウェブサイトにおける画像形式で1番に選ばれる可能性が高いとされています。
WebPのデメリット
以下にWebPの対応表を作りましたので、ご確認下さい。
| WebPのOS対応表 | |
|---|---|
| Android | 非可逆圧縮は4.0以降、可逆圧縮は4.3以降 |
| Windows 10 | Creators Update以降 |
| iOS | 14以降 |
| WebPのブラウザ対応表 | |
|---|---|
| Google Chrome | Google開発なので当然対応済み |
| Mozilla Firefox | 65以降 |
| Microsoft Edge | 対応済み |
| Opera | 対応済み |
| Safari | 14以降 |
上記を見て頂くとわかるように、iOSが2020年9月に行った14のアップデートでほぼ有名なOS・ブラウザがWebPに対応済みになります。WebPのデメリットであった対応OS・ブラウザを選ぶ必要性がなくなることで今後普及していくものと考えられます。現在のところMacOS版のみまだ非対応のようですが、Safariには対応しているので、スマホ側のウェブサイトにおいてはWebPは有効です。ユーザーのほとんどはスマホユーザーなので、仮にWebPを主体にウェブサイトを構築してもほぼ問題ないポジションまで来ていると推測できます。
画像形式をWebPに変換しよう
SEOの教科書で1番見られているページの「画像編集ソフトはどれを選べばいい？おすすめの画像編集ソフト7選」でも紹介している「ShortPixel」「pixlr」または、「EWWW Image Optimizer」でも可能となっています。
当サイトでも画像はまだJPEG・PNGがほとんどです。年内にかけてWebPへの変換を行う予定です。7月のSEO対策記で記したように、当サイトは非常に重いです(笑)2020年以降、来年はサイトの軽量化をしていないとGoogleにて弾かれてしまう可能性もある為、対策をしていこうと思います。皆様のウェブサイトでもサイトの画像軽量化＝WebP化、進めてみて下さい。私の方で調査している限り、順位が著しく降下したなどのデータは今のところありません。不変か上昇なので、そこまでデメリットはないと思います。
ページエクスペリエンスを向上する為に色々調べていると、WebPにするよう指示がでたりしているのが現状で、そちらに対応しているサイトはまだあまりない印象です。
株式会社ベンチャーネットが運営するメディアのSEO対策担当、兼「SEOの教科書」の編集責任者のくじらのKです。SEO対策の最新情報や、初めてSEOに関わる方にもわかりやすい情報発信を心がけてます。
