プラグイン「EWWW Image Optimizer」でサイトをWebP化して転送量を削減してみた。落とし穴があったけど、無事にWordPress利用料も抑えられた!

このサイト・および記事にはアフィリエイト広告を利用しています。

「EWWW Image Optimizer」のインストールと有効化

使う「EWWW Image Optimizer」はこちら👇です。

最終更新も2ヶ月前・インストール数も100万を超えていて、評価も高いようなので、大丈夫そうです。

インストールと有効化です。

「EWWW Image Optimizer」の設定①

有効化が終わったら、「EWWW Image Optimizer」の設定をします。

設定内容はこちら👇

  1. 無料モードを選択
  2. 「幅の上限」:1600px、高さの上限:1600px に設定
    1. PC表示でも十分綺麗に表示される大きさだから
    2. スマホ表示でも余裕で綺麗に表示されるから
    3. あと、転送量を削減したいから
  3. 完了

「EWWW Image Optimizer」の設定②

続いてWordPressのメニューに出てくる画面からの設定です。

  1. ルディクロスモードを選択(無料だから)
  2. 変換リンクを非表示にチェック
    1. 画像の拡張子を勝手にjpg⇔pngとかに変換しないように
    2. リサイズ→「既存の画像をリサイズ」のチェックを外す(これをしないとWordPressが作った同じ絵の違うサイズの画像に対しても全て「EWWW Image Optimizer」がサムネイル画像を作ってしまってストレージが爆増する。詳細は後述)
EWWW Image OptimizerでWebP化 「既存の画像のリサイズ」のチェックを外す

「EWWW Image Optimizer」で画像をスキャンして一括最適化する

「EWWW Image Optimizer」の設定ができたら、いよいよ画像の一括最適化をします。

スキャンをして最適化します。

EWWW Image OptimizerでWebP化 画像をスキャン中

スキャンすると3,000枚だったはずの画像が12,000枚ぐらいに増えているのは、WordPressが1枚画像をアップロードすると、その後ろで同じ画像の様々なサイズの画像を自動で作っているからだと思います。多分。

EWWW Image OptimizerでWebP化 スキャン
EWWW Image OptimizerでWebP化 画像の一括最適化

ブログ作成時から、小さくできる画像は小さくしていたので、元々の画像サイズがかなり小さいとWebP化できないこともあるみたいです。
(私の場合はWebP化できない画像もかなりありました。)

元画像:約3,000枚で、最適化する画像:約12,000枚で、最適化に約9時間かかったのですが、最適化中も他の作業はできますし、中止しても再開できるようでした。

EWWW Image OptimizerでWebP化 最適化は中断後、再開できる
EWWW Image OptimizerでWebP化 最適化中もブログ執筆可能

元々の画像ファイルは「EWWW Image Optimizer」の画像最適化で

一括画像最適化の前後で同じ画像のファイルサイズをWordPressの「メディア」から確認すると、651KB→127KBに確かに削減されていました🙌

EWWW Image OptimizerでWebP化 画像最適化前のファイルサイズ:651KB
EWWW Image OptimizerでWebP化 画像最適化後のファイルサイズ:127KB

一旦ストレージが爆増する→「EWWW Image Optimizer」フォルダ内の画像は全消し

前項までで、既存画像の最適化には成功しました。
ただ、ここで問題が、、、

「EWWW Image Optimizer」が画像の最適化中に、WordPressが作成した同じ絵の違うサイズの画像、全てに対して、また同じ絵の違うサイズの画像をいくつも作ってしまったために、ストレージが爆増しました。。。

  • メディアファイルに表示される画像:約3,000枚
  • WordPressが自動で作る同じ絵の画像:約3000枚×5種類
  • EWWW Image Optimizerが生成した画像:(1+2)×5種類

という感じ。

なので、先述した「EWWW Image Optimizer」の設定②」で、リサイズ→「既存の画像をリサイズ」のチェックを外すが重要です。
これをやっていれば、この後の作業は多分、不要なはず。

プラグイン「File Manager Advanced」をインストールして、WordPress内のフォルダを管理する

この事象が起こるまでは使っていなかったのですが、プラグイン「File Manager Advanced」をインストール&使うことで、「EWWW Image Optimizer」が作成した不要な画像をフォルダごと削除する、という作業をしました。

File Managerっぽいプラグインはいくつかあったのですが、「File Manager Advanced」がフォルダごと削除する、という作業が可能なようでしたので、こちらを使用しました。