近年、WebPを使用したWebサイトが増えてきました。そのため、WebPについて詳しく知りたい方も多いのではないでしょうか。

WebPは今後ますます普及していくと思われますから、詳しく知っておくことが大切です。

この記事では、WebPの概要やメリット、注意点、画像をWebPに変換する方法、WebPをJPGに変換する方法を解説します。

WebP（ウェッピー）とは？

WebP（ウェッピー）とは、Webサイトの表示速度短縮を目的にGoogleが開発している画像の拡張子（画像形式）のことです。2010年9月に初めて発表され、現在普及が進んでいます。

ここでは、WebPとは何なのか解説します。

WebPは拡張子のひとつ

WebPは拡張子のひとつであり、ファイルの拡張子は「.webp」です。拡張子とはファイルの種類を表すもので、ファイル名の末尾にある「.」（ピリオド）と、その後ろに続く英数字のことです。

また、WebPはJPGやPNGなどと比べるとファイルサイズが25％ほど小さく、GIFをWebPに変換した場合には画質を保持したまま半分のファイルサイズになります。さらに、WebPは透過・アニメーションの両方に対応しており、色数も1670万色以上に対応しています。

主要ブラウザの多くがWebPに対応している

WebPは2010年9月に発表されて以降長らく普及しませんでしたが、2018年にMicrosoft EdgeとFirefoxがWebPに対応すると発表し、普及が進みました。

現在では、Google ChromeやMicrosoft Edge、Firefox、Safariなど主要ブラウザの多くがWebPに対応しています。

WebPとJPG・PNGの違い

WebPやJPG、PNGはすべてデータを圧縮し、画質を落としたものです。データの圧縮には、2種類の圧縮方法があります。1つは可逆圧縮（ロスレス圧縮）で、もう1つは非可逆圧縮です。

可逆圧縮（ロスレス圧縮）は、元のデータの損失を発生させずに圧縮する方法です。1度圧縮しても完全に元の状態に戻すことができます。ただし、非可逆圧縮と比べると圧縮率が低いため、ファイルサイズが大きくなります。

非可逆圧縮は、元のデータの損失が発生する圧縮方法です。可逆圧縮とは異なり、1度圧縮すると元通りに復元することはできません。その分、画質の劣化を最低限に抑えつつ高い圧縮率でデータを圧縮できます。

JPGは非可逆圧縮であり、PNGは可逆圧縮ですが、WebPはそのどちらにも対応しています。

WebPのメリット

WebPにはメリットが複数あります。ここではWebPのメリットを紹介します。

透過・アニメーションの両方に対応している

まず、WebPは透過とアニメーションの両方に対応していることが大きなメリットです。

既存の拡張子では、透過に対応しているPNGはアニメーションに非対応であり、GIFは透過とアニメーションの両方に対応しているものの256色しか表現できません。

また、JPGは透過とアニメーションのどちらにも非対応です。そのため、以前は、例えば「透過画像はPNG、透過画像でないものはJPG、アニメーション画像はGIF」といったように拡張子を使い分ける必要がありました。

しかし、WebPであれば透過とアニメーションの両方に対応可能です。色数も1670万色以上に対応しているので、これからはWebサイトで使う画像をWebPのみにしても理論上は問題ありません。

拡張子を使い分ける必要がなくなるため、画像作成やWebページ作成などの効率化も実現できます。

他の拡張子に比べてファイルの容量が軽い

WebPは、他の拡張子と比べてファイルのサイズが軽いこともメリットです。

同品質のJPGと比べると、ファイルサイズは25～34%、PNGと比べると26%小さくなります。

また、GIFよりサイズを小さくすることも可能です。GIFをWebPに変換すると、画質を保持したままファイルサイズが半分になります。

さらに、WebPはファイルサイズが小さいため、Webサイトの表示速度改善も期待できます。Webサイトの表示速度が遅いと、ユーザーがサイト閲覧を諦めてしまうこともあるため、Webサイトを閲覧してもらうには表示速度が重要です。

WebPによるWebサイトの高速表示化は、大きなメリットといえるでしょう。

加えて、Webサイトの表示速度が速くなることは、SEOにもよい影響をもたらします。

Webサイトの表示速度が速いと、ユーザーがWebサイトから早々に撤退する可能性が低くなり、結果的に滞在時間が長くなります。Googleの検索アルゴリズムでは、ユーザーの滞在時間が長いほど高く評価されるため、Webサイト内の画像をWebPにすれば上位表示される可能性が高くなるでしょう。

実際、Googleが無料で提供しているPageSpeed Insights（Webサイトの表示速度を評価するツール）やLighthouse（Webサイトを分析するためのGoogle Chrome拡張機能）では、WebPの使用が推奨されています。

サーバー使用料の節約につながる

WebPは、サーバー使用料の節約にもつながります。

Amazonが提供しているAWSやMicrosoftが提供するAzureなどのサーバー使用料は、トラフィック量（通信量）に応じて料金が変化する従量課金制です。

従量課金制の場合、Webサイトに画像を設置するほど通信料が増え、サーバー使用料が増加します。ファイルサイズが小さいWebPにすれば通信量も少なくなるため、サーバー使用料の節約に期待できます。

画像をWebPに変換する方法

WebP画像を持っていなくても、既に持っている画像をWebPに変換することができます。

ここでは、画像をWebPに変換する方法を2つ紹介します。

Squooshを使ってWebPに変換する

Squoosh（スクワッシュ）というGoogleが提供する無料のWebツールを利用して変換する方法です。

Squooshを利用すれば、ブラウザ上で画像をWebPに変換できます。パソコンだけでなく、スマートフォンからもアクセス・利用できます。

まず、SquooshのWebサイトにアクセスし、WebPに変換したい画像をドラッグ&ドロップします。すると画像編集画面に切り替わるので、変換後のフォーマットをWebPに設定し、右下に設置されているダウンロードボタンをクリックします。

これで変換完了です。

WebPShopを使ってWebPに変換する

Photoshopを使用してWebPに変換する方法です。

まず、PhotoshopはそのままではWebP画像を読み込んだり書き込んだりすることができません。そのため、WebPShopというプラグインをインストールする必要があります。

WebPshopはGoogleが提供する無料のプラグインで、GitHubというWebサイトからダウンロード可能です。ダウンロードしたら、「bin」というフォルダを開き、Windows利用者の方は「Windows」、Mac利用者の方は「Mac」と記載されているフォルダを開きます。

次に、Windows利用者の方は「WebPShop.8bi」、Mac利用者の方は「WebPShop.plugin」をPhotoshopの「Plug-ins」内にコピーします。インストールはこれで完了です。この手順により、PhotoshopでWebP画像の読み込みや書き込みができるようになります。

WebPに変換したい画像をPhotoshopで読み込み、WebP形式で保存すれば、WebPに変換できます。

WebPを導入する際の注意点

WebPを導入する際に注意していただきたいことが3つあります。

1つ目は、WebPに対応しているソフトが少ないことです。世界中に多くのユーザーがいるPhotoshoでさえも2022年2月に正式対応しました。そのため、まだ浸透しきっているとはいえないでしょう。

次に注意していただきたいのが、パソコンによってはWebP画像を開くとビューワーではなくブラウザで開いてしまうことです。

そして、WebPはウェブサイト表示用の画像形式であることにも注意しましょう。自分で作成・編集した画像を保存する際、その画像がウェブサイト表示用の画像でない場合は、JPGやPNGなどで保存した方がよいでしょう。

WebPファイルをJPEGに変換する方法

使用しているパソコンブラウザがWebPに未対応の場合、WebPをJPGに変換して利用することが多くあります。

ここでは、JPGへの変換方法を紹介します。

WebPをサポートしていないブラウザを使ってJPGに変換する

まず、JPGに変換したいWebP画像のURLをコピーします。

次に、WebPをサポートしていないブラウザでそのURLを開きます。すると、画像形式がJPGあるいはPNGに変更されて画像が表示されるはずです。画像形式が変更されていることを確認できたら、その画像を右クリックし「名前を付けて画像を保存」をクリックしましょう。

そして、「ファイルの種類」ボックスがJPGになっていることを確認し、「保存」をクリックしましょう。これでJPG画像を保存できます。

ブラウザの拡張機能を使ってJPGに変換する

Firefoxの拡張機能（アドオン）を使ってWebPをJPGに変換することもできます。

まず、Firefoxの画面右上にある「≡」をクリックし、「アドオンとテーマ」をクリックします。

次に、上部にある検索欄に「Save WebP as PNG or JPEG (Converter)」と入力し、ダウンロードしましょう。

インストール後、JPGに変換したいWebP画像を右クリックし、「WebPを別名で保存」をクリックします。すると、JPGを選択できるようになっているので、JPGを選んで画像を保存しましょう。

まとめ

ここまでWebPのメリットや注意点、画像の変換方法などについて紹介しました。

WebPはファイルサイズが軽く、透過・アニメーションのどちらにも対応しており、色数も1670万色以上の表現が可能です。そのため、今後も普及が進んでいくと考えられます。

注意点や画像の変換方法などを覚えて、WebPを活用していきましょう。