先日メインブログの閲覧スピードを上げるために、画像の軽量化をしてみました。
画像の軽量化は今まで放置してきましたが、今回やってみて、スマホ側はさほど効果はなかったのですが、PC側ではかなり数値が良くなりました。
ただ、WebPの場合、対応しているブラウザでしか見られません。
そこで、画像をWebPに自動変換し、かつ、ブラウザによって画像の振り分けを行ってくれるのが、今回ご紹介している「WebP Converter for Media」です。
今回実際にやってみた手順やDL方法など、ご紹介します!
「WebP Converter for Media」の入手先
「WebP Converter for Media」は、ダッシュボード→新規プラグインを追加から、ワード検索でも探せます。
見つかったら「今すぐインストール」→「有効化」をクリックして準備完了です。
設定はわかるところだけでもOK
「WebP Converter for Media」の使い方は簡単なのですが、設定はわかるところだけでもOKです。
まずは、Jpeg画像などをWebPに変換する作業が待っています。
画像の容量が多いほど、変換には時間がかかりますが、うっかりページを閉じないように注意してください。
ちなみに、画像の変換は以下からできます。
まず、ダッシュボードの設定から「WebP Converter for Media」をクリックしましょう。
設定画面が表示されたら、まずはテーマ内の画像も変換が必要なケースが多いので、こちらにチェックを入れておきましょう。
下の方にスクロールして、該当のページを探してください。
こちらは、すでに変換を終えた画像ですが、100%になる前に、もしかしたらエラーみたいなのが入ることがあります。
ただ、再度変換をかければOKな場合も多いので、まずは一括最適化をしてみましょう。
その後の画像をいちいち変換するのは大変なので、こちらはONにしておくと良いかもしれません。
一括変換中にエラーが出た場合は?
エラーの種類にもよりますが、以下のようなエラーが出た場合は、パーマリンクの設定を確認してみてください。
具体的には、パーマリンクが「基本」になっていなければOKです。
以下のページは、数字ベースなのでエラーが出ませんでしたが、基本とするのは避けた方が良いと思います。
一番良いのは投稿名らしいですが…
すでに数字ベースに設定してあるので、クロールエラー対策として、あえて昔のままにしてあります。
使ったページの画像を右クリックから保存すると、以下のように「WebP」と拡張子が表示されているので、変換がされているのが確認できます。
デベロッパーツール(該当の画像をクリック後に、F12をクリック)で、ネットワーク→タイプをクリックでも「WebP」の確認ができます。
本来はこちらで確認するのが正しいみたいです。
画像をWebPに変換するならプラグインを使おう!
それでは、ワードプレスの画像をWebPに変換するプラグインをご紹介してみました。
画像のサイズが大きくなると、画像の量が増えると共に、ページの閲覧が遅くなる可能性もあるので、もし気になる場合は、WebPに変換しておきましょう。
今回のプラグインは、WebPに変換しつつも、Jpeg表示だけのブラウザにも対応しているとのことなので安心して使えます。
気になるブログがあれば、こちらも確認して、画像サイズなどが最適か調べてみましょう。
私のブログの場合、PCは合格となりましたが、スマホは今後の課題です。
記事が参考になりましたら、嬉しいです!^^