WebP Converter for Mediaを使ってWebP変換・対応させる手順

プラグイン

画像の次世代形式のひとつであるWebPを使ってウェブサイト上で画像を配信する必要性が高まってきていますよね。

google speed insightsで修正するように指摘された方も多いと思います。

ただ、すべての方がwebの技術に精通しているわけではありませんから、プラグインを使って簡単に対応できれば良いですよね。

ここでは、WebP Converter for Mediaを使って、既存の画像を一括でWebPへ変換し、あなたのウェブサイトをWebP対応させる方法をお伝えしていきます。

WebP Converter for Mediaは、「とにかく簡単に対応したい。」、「他の画像圧縮プラグインとは別に対応したい。」という方におすすめです。

1 WebP Converter for Mediaとは
2 「WebP（ウェッピー）」とは？
- 2.1 ブラウザごとに対応が必要
3 WebP Converter for MediaでのWebP（ウェッピー）配信設定方法
4 既にある画像をWebPへ一括変換する
5 実際にWebPへ変換して配信されているかの確認方法
- 5.1 実際に画像を保存して確認
- 5.2 Chromeのデベロッパーツールから確認
6 WebP Converter for Mediaアンインストール時の動作
7 まとめ

WebP Converter for Mediaとは

プラグイン公式ページ

WebP Converter for Mediaは、画像を次世代フォーマットのひとつであるWebP形式でブラウザに表示させるプラグインです。
（他の次世代フォーマットである「AVIF」にも近日対応とのことです。）

その他、画像の圧縮やリサイズ、遅延読込などの機能はなく、次世代フォーマット形式での配信専用のプラグインです。

機能の概要としては次のようになります。

WebP Converter for Mediaの機能概要

.htaccessでのブラウザ判別
.htaccessを使わない判別方法にも対応
jpeg・png・gifに対応
/uploads、/themes、/pluginsフォルダ内の画像に対応
GD、Imagickの2つの変換方法に対応
WebPのみに対応（AVIFは近日対応予定）
変換画像の画質指定機能
既存ファイルの一括変換
画像アップロード時の自動変換
WebPファイルのブラウザキャッシュ

細かな機能がありますが、初心者の方でも難しく考える必要はありませんよ。
WebP Converter for Mediaのインストール方法は一般的なプラグインと同様ですので省略します。

「WebP（ウェッピー）」とは？

従来Webで利用される画像ファイルは、「jpeg」「png」「gif」が主流でした。

Webページの表示速度は、記事の検索順位にも影響を与えるとして、画像の軽量化が課題となっていきました。

そして、次世代の画像フォーマットとして、「WebP」「JPEG200」「JPEG-XR」などが登場しました。

「WebP」とは、Googleが開発した高圧縮・軽量な新世代フォーマットのひとつのことです。

次世代フォーマットは、先ほどお伝えしたとおり主に3つありますが、現在では「WebP」一強になっていますので、Webサイトの次世代フォーマット化にはWebPを使っておけば問題ありません。

ブラウザごとに対応が必要

しかしこの画像の次世代フォーマットは、ブラウザ各種が規格を争ってきた経緯から、ブラウザによって表示できるものとできないものがあります。

次世代フォーマットの主流である「WebP」も、ブラウザの種類やバージョンによって対応状況が異なります。

つまり、あなたのサイトやブログでWebP対応するには、訪問者の使用するブラウザの種類やバージョンによって対応を変える必要が出てきます。

以降は、EWWW Image Optimizerを使ってWebP変換するときに、訪問者のブラウザによってWebPへ変換した画像を表示するのか、Jpegなど元の画像を表示するのかの判別についても対応できるように説明していきます。

WebP Converter for MediaでのWebP（ウェッピー）配信設定方法

・読込方法の選択

閲覧者のブラウザの種類やバージョンによって表示する画像ファイルを変更する必要があることは既にお伝えしています。

この、表示すべき画像を判断する方法を指定します。

.htaccessを使用する方法
.htaccessやWebサーバー（Nginx）に手を加えない方法

上のどちらかしか選択できません。

.htaccessを編集できるレンタルサーバーをお使いの場合は、上の「via .htaccess (recommended)」を選んでおけば良いでしょう。

.htaccessはFTPクライアントを使用して編集するのが一般的ですが、よくわからない方は、主要なレンタルサーバーの管理画面から.htaccessを編集する機能があるか確認してみてください。

主要3社のマニュアル

.htaccessを編集できないなど、使用している環境によっては、「Pass Thru (without rewrites in .htaccess files or Nginx configuration)」を選択してください。

・WebPへ変換するファイルの指定

WebPへ変換したいファイル形式をチェックします。（複数選択可）

デフォルトでは、gifが選択されていませんが、あなたの運営しているウェブサイトでgifの使用が多いようであれば、チェックしておきましょう。
※ gifアニメーションを変換した場合は、静止画となってしまうので注意してください。

・WebPへ変換対象とするディレクトリの指定

画像をWebPへ変換したい画像があるフォルダを指定します。（複数選択可）

通常の投稿内の画像のみを対象とするなら「/uploads」だけにチェックを入れればOKです。

他にも、使用しているテーマやプラグイン内の画像についても変換したい場合は、それぞれにチェックを入れます。

先の設定で、「.htaccessを使用しない方法」を選んだ場合や、使用しているテーマによっては正常に動作しない可能性もありますので、よくわからない場合は「/uploads」のみで良いと思います。

・変換方法の選択

変換する仕組みをどちらか選びます。

ただ、使用している環境により一方しか選択できない状態になっていることがありますが、そのままで問題ありません。

エックスサーバーの場合は、「GD」しか選ぶことができませんでした。

・出力形式の選択

変換後のファイル形式を選びますが、WebP Converter for Mediaは現在のところ「WebP」のみ対応しているので、必然的にWebPとなります。

・画像の圧縮率の選択

お好きな圧縮率を選択すれば良いと思いますが、特にこだわりがないのであればデフォルトのままで良いと思います。

数字が小さいほどファイルサイズは小さくなりますが、画質は劣るようになります。

・オプション機能の指定

オプション機能の概要は次のとおりです。

WebPへ変換したものの、元のサイズよりも大きい場合は、WebPファイルを自動で削除する
WebPファイルのブラウザキャッシュを使用する
画像のメタデータをEXIFまたはXMP形式で保存します（Imagick変換方法でのみ使用可能）
cronがメディアライブラリの外部からの画像を自動的に変換できるようにします（メディアライブラリの画像はアップロード直後に変換されます）
cronがメディアライブラリにアップロードされた画像を変換できるようにして、画像を追加するプロセスを高速化します（メディアライブラリに追加された画像が自動的に変換されない場合は、このオプションを無効にします）
すべてのドメインのWebPへのリダイレクトを強制します（デフォルトでは、WebPの画像はWebサイトのドメインにのみ読み込まれます-画像が別のドメインのURLを介して表示される場合、元のファイルが読み込まれます）
debug.logファイルへの変換中にエラーをログに記録します（WordPressでのデバッグがアクティブな場合）

cronに関するものは、ご使用のレンタルサーバーの環境に依存するものですので、よくわからない場合はデフォルトとのままで様子を見て、正しく動作しない場合にチェックを外すなどしてください。

下から2番目のリダイレクトの話は、CDNを利用していたり、外部サイトの画像を直リンクしている場合に、外部ファイルを見るのではなく、あなたのサーバーに変換したWebPファイルを表示させるようにするということだと思います。
チェックなしのままで良いかと思います。

・すべての設定完了後に保存します

保存ボタンをクリックして設定を保存します。