EWWW Image Optimizerは、WordPressサイトにアップロードした画像を自動的に最適化するプラグインです。
ブログでは画像を載せるため、あまりに量が多いと、サイトの読み込みが遅くなったり、SEOにも影響します。
インストール方法と使い方を図解でやさしく解説します。
EWWW Image Optimizerは自動で画像ファイルのサイズを小さくしてくれるよ
画像を小さくし、ページの読み込み速度を上げることで、サイトのパフォーマンスとSEOを改善してくれます。
Webサイトのパフォーマンスは、Googleなどの検索エンジンでのランキングに大きな影響を与えるため、画像の最適化は非常に重要です。
EWWW Image Optimizerのインストールと設定手順
さっそくインストールしてみましょう。
と言っても、やりかたは他のプラグインと同様です。
EWWW Image Optimizerのインストール
WordPressメニューの「プラグイン」から「新規プラグインを追加」をクリックします。
「プラグインの検索」に「EWWW Image Optimizer」と入力し、「今すぐインストール」をクリックします。
ンストールができたら、EWWW Image Optimizerの「有効化」をクリックします。
「プラグインを有効化しました。」とメッセージが出て終了です。
これだけ？
インストールは終了ですが、続いて初期設定を行います。
EWWW Image Optimizerの初期設定
インストールして有効化した後は、より最適化のための設定を行います。
WordPressメニューの「設定」から「EWWW Image Optimizer」をクリックします。
初めて「EWWW Image Optimizer」を開いたときにだけこの「初期設定」画面が表示されます
ここでは「サイトを高速化」と「保存スペースを節約」にチェックを入れ、「今は無料モードのままにする」を選択し次に進みます。
・サイトを高速化
・保存スペースを節約
・今は無料モードのままにする
次の画面では、「メタデータの削除」、「遅延読み込み」にチェックを入れ、幅・高さの上限は「0」にして、「設定を保存」します。
・メタデータの削除
画像ファイルごとに記録される位置情報やなどのことで、これを削除することで容量を軽量化し、読み込み速度の高速化になります。
・遅延読み込み
画面のスクロールに応じて段階的に画像を読み込むようにする設定です。
サイトを訪れたときに一気に画像を展開すると読み込みが遅くなってしまうため、それを防ぐための措置です。
・幅と高さの上限
初期設定ではそれぞれ1,940になっています。このままだと画像が1,940ピクセルに調整されてしまいます。
0にすることで自動調整を行わないようにするという設定を行います。
WebP変換はあとで設定するよ
設定が終了したら、「完了」して次に進みます。
すると自動的に画面が遷移しますので、ここから最適化への設定を行っていきます。
「ルディクスモード」をクリックします。
変換リンクの非表示
ルディクスモードを開くと、このような画面になるので、「変換」タブをクリックし、「変換リンクを非表示」にチェックを入れ、「変更を保存」します。
変換リンクを非表示にする、とは画像変換に関するリンクを非表示にする設定オプションのことです。
この設定を有効にすると、メディアライブラリや他の関連画面で画像フォーマットを変換するためのリンクが表示されなくなります。
管理画面がシンプルになるので、メディアライブラリなどで余計なリンクが表示されなくなるため、操作がシンプルになります。
また、リンクを隠すと、誤って変換するのを防ぐことになります。
WebPへの変換
WebP?
WebPは、Googleが開発した画像フォーマットのことで、従来の画像よりもファイルサイズを削減できると言われているよ。
Webpへの変換設定を行います。
「Essetial」タブをクリックして、「Webp変換」まで画面を下にスクロールします。
Webp変換にチェックを入れます。
すると、メッセージが出ますが、そのまま「次へ」
Webpを配備するためのコードが表示されますので、
そのまま全文をドラッグしてコピーします。コピーしたコードは、ConoHaの管理画面を開いて「.htaccess」に貼り付けていきます。
ConoHaの管理画面にログインし、「サイト管理」から「サイト設定」、「応用設定」を開き、「.htaccess」のタブを開きます。
コードが書かれた一番上の余白に先ほどコピーしたコードをペーストします。
右側の鉛筆のようなマークをクリックすると書き込めるようになります。
先ほどコピーしたコードをペーストしたら、「保存」をクリックします。
成功すると次のようなメッセージが出ます。
WordPressに戻り、Webp変換の画面をスクロールして、一番下の「変更を保存」をクリックします。
先ほどは赤色で「PNG」となっていた箇所が緑色の「Webp」に変更されます。
これで設定は完了です。
新しくアップした画像は自動で圧縮
EWWW Image Optimizerで新規に追加した画像は、プラグインが自動的に圧縮してくれます。
どれくらい圧縮できたかは次の手順で確認できます。
WordPressメニューの「メディア」から「ライブラリ」をクリックします。
WordPressに追加した画像データが一覧で表示されます。
画像最適化の欄を見ると、「〇サイズ圧縮しました」とメッセージがあるので、そこで確認できます。
この例だと、15.6％から66.9％と圧縮の幅は広いですが、かなり圧縮されていることがわかります。
今までアップした画像を圧縮するには
過去の画像の圧縮処理の方法は次のとおりです。
WordPressメニューの「メディア」から「一括最適化」をクリックします。
「最適化されていない画像をスキャンする」をクリックします。
最適化されていない画像がある場合、次のように画像を最適化できる数を示してくれます。
そのまま「〇点の画像を最適化」をクリックします。
すると最適化の作業が実行されます。
完了するまでしばらく待ちます。待ち時間は画像の数によってまちまちです。
長いと数10分待ちます。
最適化が完了すると、このように完了画面が表示されます。
これでEWWW Image Optimizerの設定と使い方は終了だよ
EWWW Image Optimizerの機能
EWWW Image Optimizerの機能をまとめるよ
・画像の自動圧縮
・既存の画像の一括最適化
・WebP形式への変換
・Lazy Loading（遅延読み込み）
・様々な画像フォーマットのサポート
画像の自動圧縮
画像をアップロードすると、プラグインが自動でファイルサイズを圧縮してくれます。
画像を圧縮することでこれにより、ページの読み込み速度が速くなり、SEO対策になります。
既存の画像の一括最適化
過去にアップした画像も一括で最適化することができます。
WebP形式への変換
記述ですが、「WebPは、Googleが推奨する次世代画像フォーマット」です。
JPEGやPNGなど、他の画像形式に比べてファイルサイズが小さくなります。
EWWW Image Optimizerは画像をWebP形式に変換する機能があるため、さらに読み込む速度が上がります。
Lazy Loading（遅延読み込み）
遅延読み込みの機能をLazy Loadingといいます。Lazy Loading機能を使用すると、ページをスクロールするまで画像を読み込まないため、初めてページを訪れた時のパフォーマンスが向上します。
読み込みが遅いと、「もういいや、別のサイト行こ」となるがちなので、こういう「ユーザーの離脱率」を減らすことが目的だよ。
いろいろな画像フォーマットをサポート
JPEG、PNG、GIF、PDFなどの他のいろいろな画像フォーマットに対応していて、これらすべての形式のファイルを最適化することができます。
まとめ
EWWW Image Optimizerは、WordPressの画像を自動的に最適化してくれます。
そのため、いちいち手動で画像を圧縮する手間が減り、ブログ作成の効率を上げてくれます。
簡単にインストールできるので、ぜひ設定しておきましょう！
コメント