サイト診断「Lighthouse」でいつも支障になるのは「次世代でフォーマット画像を提供する」と言う項目。
プラグインを探してみても、あまりWebP変化はなかったのですが、使っているプラグイン「EWWW Image Optimizer」で「WebP(ウェッピー)」に変換、それも一括で出来る設定方法がわかりました。
恐るべしEWWW Image Optimizer
画像の管理や縮小で多くの方が使用している「EWWW Image Optimizer」
しかし画像の縮小率は少ないので、外部サイト「TinyPNG」を使用している人が多いと思います。
私もそうで「EWWW Image Optimizer」は画像管理だけになっていました。
「WebP」に変換できないもんかとサイトの「メディア」を見ていると
ん??
保存された画像情報は「WebP」になっています??
でも表示は「.jpg」??
変に思い色々調べてみると・・・
ありました~!!
なんと「EWWW Image Optimizer」で出来るんです!!
私がプラグインEWWW Image Optimizerで画像をWebPへ変換した作業を紹介します。
EWWW Image Optimizer WebPへの設定変更
EWWW Image Optimizerの通常設定はいろんなサイトで作られていますので参考にしてください。
WPの管理ベージから「設定」➡「EWWW Image Optimizer」
EWWW Image Optimizerの設定画面の下の「WebP変換」をチェックを入れる
と画面メニューが増えます。
そこで確認すると現在の画像表示は「PNG」
「リライトツールを挿入する」をクリック
設定が終わると画像表示は「WABP」に変更になりました。
設定保存を忘れずにクリック
これからアップされる画像はすべて「WebP」で保存、表示されます。
ではすでにある画像は?と言うと「一括」で「WebP」に変換できるのですが・・・大きいサイトや長年運営しているサイトは、画像の多さで画像変換にかなり時間がかかります。
このサイトでさえ30分以上かかりました・・・
それを踏まえて、画像一括WebP化へ!
画像一括 WebP化の作業
管理画面から「メディア」➡「一括最適化」
管理画面左のメニューの二つにチェックを入れ「最適化されていない画像をスキャン」をクリック
スキャンされ「○○○点の画像を最適化」をクリック
大きいサイト、画像が多いサイトは結構な時間がかかります。
(ちなみに長年使用していたお店のHPは4時間以上かかりました・・・)
最適化完了でサイトの画像は「WebP」に変換されました。
「Lighthouse」で診断してみると
改善され無くなっています!
試しに自分のサイトを開いて記事内の画像を右クリックで「画像保存」するとファイル名がちゃんと「webpファイル」になっています。
「画像圧縮量が少ない」と言われている「EWWW Image Optimizer」ですが、実は素晴らしい機能が付いているんだと改めて感心しました。
この先ネットでは「webp形式」の画像が主流になると言われています。
実際Googleのサイト診断もwebpの画像形式を勧める状態になっていますので、今後それも含めたプラグインが多くなるかもしれません。
以上「私が作業したwebp化」を紹介しました!
コメント