どうも、ときパパです。
グーグル先生のPageSpeedInsightsというウェブページの読み込み時間を測定してくれるサイト。
改善できる項目に適切なサイズの画像という文言が。
画像が重いとサイトの表示速度が遅くなり、ユーザビリティが下がってしまいますよって事ですね。
あまり気にせず画像をアップしてたので１枚１枚やり直すのは大変。
どうしよっかと途方に暮れてたらEWWW Image Optimizerは、すでにアップしてある画像もまとめて圧縮できるとの事。
これは便利という事で早速取り入れてみました。
EWWW Image Optimizerで出来る事
EWWW Image Optimizer は画像を最適化することでページのロード速度を向上させます。ロード速度を向上させることで検索結果のランキングで上位に表示されたり、売上が向上したりします。またサーバーのストレージと転送量を下げることも出来ます。EWWW I.O. の自動圧縮が機能していると、新しくアップロードした画像や既にアップロードしてある画像も適切なファイルフォーマットで圧縮します。画素数重視の圧縮か高い圧縮 (視覚的に同一のイメージになります) にするかを選択することが出来ます。
EWWW Image Optimizerより引用
自動で画像サイズを劣化させることなく圧縮してくれるプラグイン。
しかもすでいアップロードした画像も圧縮してくれるとのこと。
これは有難い。ということで、インストールの方法から
EWWW Image Optimizerのインストール方法
WordPressの管理画面から「EWWW Image Optimizer」を検索してインストール。
「EWWW Image Optimizer」「EWWW Image Optimizer cloud」の２種類あるので迷うかも。
「EWWW Image Optimizer」は日本語表記があるのでこっちを選んだ方が良さそう。
EWWW Image Optimizerの設定
基本の設定
ワードプレスの設定画面に「EWWW Image Optimizer」が現れているとを確認。
まずは基本の設定。
メタデータを削除にチェックを入れる。メタデータとはカメラ情報とか位置情報とか。
これらの情報を消すことで、画像の圧縮効果がさらにアップ。
また、セキュリティー的にもチェック入れた方が良い。
変換の設定
基本の設定が終わったら、左上にある『Emable Ludicrous Mode』ボタンを押そう。
細かな設定が出来るようになります。
上の変換ボタンををしたら、変換リンクを非表示にチェック。
画像の拡張子を変更されることを防げます。
変更を保存ボタンを忘れずに。
EWWW Image Optimizerの使い方
アップ済みの画像の一括圧縮
まずは、すでにアップ済みの画像を一括で圧縮します。
「メディア」→「一括最適化」→「最適化されていない画像をスキャンする」
これで、既存の画像で最適化できる画像がスキャンされます。
私の場合、最適化できる画像が601点！！一気にこれだけの写真をやってくれるなんて素敵。
新規画像の圧縮
お次は既存画像の圧縮。
EWWW Image Optimizerは、新規投稿したら自動で画像を圧縮してくれます。
なので特に新たな設定の必要はなし。
画像最適化の確認方法
「ライブラリ」→「リストモード」→「画像最適化」
この右の欄で確認が出来ます。
導入しておきたいプラグインの一つですね。
どうも、ときパパです。グーグルのスピードテスト“PageSpeedInsights”の改善項目で、次世代フォーマットでの画像の配信って出ちゃいました。グーグル先生からお達しによると「JPEG2000,JPEG XR,WebP[…]