画像圧縮・最適化【EWWW Image Optimizer】設定方法・使い方

サイトの表示速度が遅いなぁ…

WordPressでサイトやショッピングサイトを運営していくと自然とアップロードされる画像の枚数も増えていきます。

ですが画像ファイルはサイトの表示速度を低下させてしまい、
サイトの表示速度が遅いとユーザビリティが下がり、サイトからの離脱率が大きくなってしまいます。

そうならないためにオススメなプラグインがこちら！
画像圧縮・最適化プラグイン【EWWW Image Optimizer】です。

こちらを利用すれば画像ファイルが軽くなり、サイトの表示速度を改善することができます。

それでは、使い方を順番に見ていきましょう！

【EWWW Image Optimizer】セットアップメニュー

【EWWW Image Optimizer】をインストール
1.-1【EWWW Image Optimizer】新規追加
1.-2【EWWW Image Optimizer】を今すぐインストール
1.-3【EWWW Image Optimizer】を有効化
【EWWW Image Optimizer】の設定
2.-1【EWWW Image Optimizer】の設定
2.-2【EWWW Image Optimizer】の設定画面
2.-3【EWWW Image Optimizer】基本設定
【EWWW Image Optimizer】既存の画像の圧縮方法
3.-1【EWWW Image Optimizer】既存の画像の圧縮方法
3.-2【EWWW Image Optimizer】一括最適化
3.-3【EWWW Image Optimizer】一括最適化

1.【EWWW Image Optimizer】をインストール

1.-1【EWWW Image Optimizer】新規追加

まずは、【EWWW Image Optimizer】をインストールしましょう。
管理画面の左側にあるメニューから「プラグイン」をクリックし、『新規追加』をクリック。

※画像をクリックすると拡大表示します。

1.-2【EWWW Image Optimizer】を今すぐインストール

『新規追加』ページの右上にある検索ボックスで【EWWW Image Optimizer】を検索します。
「今すぐインストール」をクリック。

※画像をクリックすると拡大表示します。

1.-3 【EWWW Image Optimizer】を有効化

インストールが終了したら、「有効化」させます。
これで、【EWWW Image Optimizer】を使用する準備は完了です。

※画像をクリックすると拡大表示します。

2.【EWWW Image Optimizer】の設定

2.-1【EWWW Image Optimizer】設定

『設定』＞『EWWW Image Optimizer』をクリックします。
もしくは、『プラグイン』＞『EWWW Image Optimizer』＞『設定』をクリック。

※画像をクリックすると拡大表示します。

2.-2【EWWW Image Optimizer】の設定画面

設定画面は簡単モードがデフォルトになっているので『ルディクラスモード』へ切り替えます。

※画像をクリックすると拡大表示します。

2.-3【EWWW Image Optimizer】基本設定

ルディクラスモードに切り替わったら、まずは「基本」タブから設定を行います。

『メタデータを削除』デフォルトでチェックが入っています。

『画像のリサイズ』では自動リサイズの具体的な数値（px＝ピクセル）を指定することができます。
アップロードされた画像が設定したサイズより大きい場合リサイズされます。
デフォルトは幅も高さも上限が0に設定されています。元のサイズそのままを使用する場合はデフォルトの0のままでOK。

※画像をクリックすると拡大表示します。

続いて

『WebP変換』にチェックを入れます。
やWebP形式に対応するブラウザの場合はWebP画像を表示させるようにできます。jpgや pngといった画像フォーマットよりもサイズを小さくできるので表示速度が上がる可能性があります。

『WebP変換』チェックを入れると下に『WebP の配信方法』という項目が表示されます。
コード下の「リライトルールを挿入する」のボタンを押すと自動的に .htaccess に書き足してくれます。問題なく挿入できたら「WebP ルールが正常に検証されました」というテキストとWEBP画像が表示されます。
※うまくいかない場合は表示されたコードを直接 .htaccess の上部に追加してみてください。

「変更を保存」をクリックします。

※画像をクリックすると拡大表示します。