WordPressでは既にjpeg形式よりも圧倒的にファイル容量が少ないWebP形式での画像をそのまま扱うことができるようになっているのはご存じかと思いますが、それは最近になってほとんどのメジャーブラウザが対応するようになる前までは積極的に使われてはいませんでした。
そこで活躍したのが「Convert for Media」「WebP Express」「EWWW Image Optimizer」といったプラグインで、今でも利用している方は多いでしょう。
自身ではかつてこれら3つのプラグインを使用していた時期もあり、「EWWW Image Optimizer」最新版での動作は存じませんが、その他2つのプラグインは以下のように機能するものでした。
- サイトディレクトリの別の場所へ、サイト内すべての画像からWebP形式に変換したものを保存する
- 画像のあるページへのアクセスがあった際には元画像の代替として1の画像を出力する（jpgとして出力しつつMimeタイプだけをwebpとすることで、対応していないブラウザでも表示可能にしている）
つまり画像のあるページにアクセスがあるごとにこれを繰り返すことになるため、サーバーへの負担の増加させてしまう可能性があることと、判断して出力する時間がかかってしまうことで表示速度に影響が出ることが考えられ、アクセスの多いサイトほどその傾向が高まる可能性があるということです。
ただ最近のブラウザではほとんどがWebP形式の画像を直接開ける（表示できる）ようになり、わざわざアクセスの度に代替出力しなくても、最初からWebPを使えばいい時代になりました。
しかしながら、パソコンに標準装備されているメディア系のソフトウェアや、外部から入手できるソフトウェアもWebP形式の画像を常用的に扱えるものが少なく、保存時に指定して保存するか、ウェブサービスを通じて変換してからサイトへアップロードする必要があり、面倒臭さがぬぐえませんでした。
そこで追加したのが本機能です。jpgのまま画像をアップロードすることで、元画像はもちろん、WordPressがアップロード後に生成する各サイズの画像もすべてWebP形式に変換して保存するようになっています。
これにより、他の置き換えプラグインなどを常時有効にする必要なくスムーズにWebP画像を扱えるようになります。
また、本機能ではjpgまたはjpeg形式の画像のみWebPへ変換しますので、透過pngなどその他形式の画像に影響を与えることはありません。
恐らく本ページをご覧になる方へお伝えする必要はないと思いますが、WebP形式の画像での出力を行うことで、ページを表示する際のファイル転送量を大幅に削減でき、ページの表示速度が大幅に改善されることからページの評価に良い影響が出る可能性が高いので、WordPressに限らずウェブページの画像をWebP形式で出力することはとても有効な手段でしょう。
本機能を使うにはサーバー上で「GD」「ImageMagick」などの画像処理プログラムが稼働している必要がありますが、WordPressが正常に稼働しており、アップロードと同時に問題なくサムネイルなど別サイズの画像が生成されている環境であれば機能します
本機能はjpg/jpeg形式のみをwebpへ変換します。その他の形式の画像は処理をスキップしますので、pngや透過pngその他の形式の画像には影響がありません。
本機能の有効化と仕様
本機能は、「メディア」→「アップロード」→「webpへの自動変換」を有効化すれば、その後にアップロードするjpg形式の画像はすべてWebP形式に変換されて保存されるようになります。
もちろんWordPress標準でWebPは扱えますので、そのまま投稿や固定ページへ画像として、ギャラリー内の画像として、カバーブロックの背景画像としてそのまま使えます。
ただし、前述したように機能有効化後以降の画像に対してのみ処理を行いますので、既にアップロードしている画像や挿入している投稿や固定ページなどの画像には反映されないため、すべてをWebP形式の画像で構成するためには次項の方法で対処する必要がある点にご注意ください。
過去の画像をすべてwebpで出力（表示）する手順
サイト内の過去の画像をWebP形式のものに置き換えるには、以下のような手順を踏む必要があります。
- 画像置き換え用プラグインを停止する（これにより元のjpg形式の画像が出力されるようになる）
- メディアに保存ざているjpg形式の画像をすべてWebP形式の画像に変換する
- 投稿や固定ページに挿入されている画像および画像リンクのURLをすべてWebP形式の画像のものに変換する
これらは以下の手順で行っていくことで対応できますが、画像の数に応じてかかる時間や工数が変わってきますので、一読してから時間に余裕のある時に行うようにしてください（行わなくても元のjpg形式の画像で出力されるだけなので、ページの表示自体に問題は発生しません）。
画像置き換え用プラグインを停止する
「Convert for Media」「WebP Express」「EWWW Image Optimizer」．．またその他のWebP形式で画像を出力しているプラグインを停止します（削除は完全に移行が完了してから行ってください）。
プラグインによって停止時の振る舞いが違うかも知れませんが、停止と同時にWebPでの出力が停止され、元のjpg形式での出力に切り替わると思います（要確認）。
移行作業前にこの処置を行わないと思わぬトラブルが発生することがありますのでご注意ください
メディアに保存ざているjpg形式の画像をすべてWebP形式の画像に変換する
これには「Regenerate Thumbnails」というWordPress公式で配布されているプラグインを使うと比較的簡単に置き換えができます（管理画面のプラグイン追加から「Regenerate Thumbnails」を検索するとすぐに見つかります）。
が、この作業で形式を変換した画像のURLとそれが挿入されている投稿の画像URLが異なるとたちまち画像が表示されなくなってしまいますので、本プラグインの「メディア」→「アップロード」→「webpへの自動変換」を有効化することと、同じ画面内にある「メンテナンス期間中の置き換えモードを使用する」を有効にします。
「メンテナンス期間中の置き換えモードを使用する」を有効にすることで、フロントエンドではアクセスがある度にjgp形式の画像のURLに対応するWebP形式の画像URLが存在するかを確認し、あればWebP形式、なければjpg形式の画像を出力することができ、メンテナンス中に訪問者へ画像が表示されないという不具合を回避できます。
このオプション機能は冒頭で紹介した置き換えプラグインと同様に画像を探して置き換えるという作業を繰り返すため、常時有効にすることはおすすめしません。なるべく早くすべての画像がWebP形式で出力されるようにすることをおすすめします。
「Regenerate Thumbnails」プラグインを有効化したら画像の再生成を行います。
このプラグインでは、個別の画像、メディア一覧で選択した画像、サイト内のすべての画像を対象に画像の再生成をすることができますが、個別に再生成するのは時間がかかりますし、サイト内のすべてを一括で行うとサーバーによっては高負荷がかかってしまったり変換時にエラーが出てしまったりすることもあるので、メディア一覧1ページずつ再生成するのがおすすめです。
メディア一覧を開いたら、そのリスト左上にチェックを入れて、一括操作プルダウンで「サムネイル生成」を選択して「適用」をクリックします。
以下のような画面になりますので、「すでに正しいサイズで存在するサムネイルの再生成をしない (高速)。」のチェックを外した上で「サムネイルを再生成」をクリックします。
すべてのページで再生成を繰り返し、終了すればこの処理は完了です。「Regenerate Thumbnails」プラグインは停止・削除して構いません。
投稿や固定ページに挿入されている画像および画像リンクのURLをすべてWebP形式の画像のものに変換する
この段階でメディアライブラリ一覧の「アップロード先」に表示されているリンクをクリックして、投稿や固定ページの編集画面を開き、さらにプレビューや表示でフロントエンド表示をさせてみてください。
これまでの処置が正しく行われていれば、フロントエンドでは画像が問題なく表示され、編集画面では画像の代わりにalt属性として指定している文字列か、「alt属性が設定されていません」というような文字列が表示されるはずです。
つまりこの段階では先ほど有効化した「メンテナンス期間中の置き換えモードを使用する」でフロントエンドの画像は表示できてているが、投稿編集画面側では画像URLに訪ね当たらないためalt属性もしくはalt属性がないと表示されているのです。
これを解消するには、編集画面でそれらが表示されている画像ブロックをクリックし、「大」「中」「小」「フルサイズ」といったサイズ変更プルダウンを変更します（これにより正しく紐づけが行われ、編集画面側でも画像が表示されるようになります）。
また、画像にリンクを設定している場合（特にWordPress標準のライトボックス機能を持たせている場合）には、ファイルへのリンクも無効になっていますので、一旦リンクを解除してから再度「クリックして拡大」などを指定して、正しくURLが紐づくようにします。
ページ内すべての画像に対してこれらを繰り返し、また、メディアライブラリ一覧に出ている「アップロード先」として表示されているリンクすべてでこの作業を行えば、手動でメンテナンスが完了します。
実はこれが一番確実な方法ではあるものの、画像や投稿・固定ページがたくさんある場合に手動でコツコツ作業するのは大変なので、「Search Regex」というプラグインを使って一括変更する方法が現実的かも知れません。
「Search Regex」を有効化すると、ツールメニューに「Search Regex」というリンクが出るのでクリックし、以下のように入力して「検索」をクリックします。
カスタム投稿タイプなどを使っている場合には画面上部の「シンプルモード」を「高度なモード」に変更して投稿タイプを含めるようにします
すると以下のように表示されるので、表示されているものが画像のURLやリンクURLであることを確認した上で、「置換」欄に「.webp」と入力して、一覧上で拡張子が「.webp」になっているのを確認してから「置換」ボタンをクリックします。
検索結果は古い順（IDの若い順）に出力されるので、変換後、一旦投稿一覧の最終ページにある画像が含まれた投稿の編集画面およびフロントエンドを表示させて、画像がきちんと表示されているかを確認してから次に進むと確実です
終わったら再び「検索」をクリックすると再度対象となるコンテンツが表示されるので、「置換」をクリックするというのを繰り返して、「検索」をクリックしても何も表示されなくなるまで繰り返せば完了です。
完了したら「Search Regex」は停止・削除して構いません。
すべての変換と置き換えが完了したら、最初に有効化したHima Art Utilityのメディア→アップロードにある「メンテナンス期間中の置き換えモードを使用する」のチェックを外し、フロントエンドの画像が表示されていれば作業終了です。
テーマの中には画像のURLを指定して何かの画像を出力する機能があったり、Hima Art Utilityの機能のようにユーザー画像に直接URLを指定したりする機能がある場合があります。最終的にそれらを確認し、すべての画像が表示されるようになれば終了です。
