EWWW Image Optimizerで画質が劣化しない設定と使い方

EWWW Image Optimizer

画像をたくさん掲載しているページは重いなどと言い出すのは、確かに一昔前の発想です。
スマホでも画像、動画を楽々再生できる時代です。

しかし画像を最適化しないまま放置しておくと、SEO上不利と言われたらどうしますか。
趣味サイトならいざ知らず、アフィリエイトで稼ごうと思っているブログでは見過ごすわけにはいきません。

昨年、Googleのウェブマスター向けガイドライン「技術に関するガイドライン」の一部が変更され、Googleはこういっています。

Google のインデックス登録システムは、CSS と JavaScript を有効にすることで一般的な最新のブラウザと同じようにウェブページをレンダリングしていると先日お伝えしました。本日、Google ではこの内容を踏まえ、技術に関するウェブマスター向けガイドラインを一部更新いたします。

新しいガイドラインでは、最適なレンダリングおよびインデックス登録のため、ページ内で使用している JavaScript、CSS、画像ファイルに Googlebot がアクセスできるようにする必要がある。

引用先
ウェブマスター向け公式ブログ

この発言を裏付けするものがこちらです。

PageSpeed Insights画像最適化の警告

これはGoogleのウェブマスターツールのWebサイトの読み込み時間を測定する「PageSpeed Insights」において、画像の最適化を警告された場面です。

JavaScriptやCSSもたくさん指摘を受けていますが、今回は画像の最適化プラグイン「EWWW Image Optimizer」を導入して、画像サイズの改善を行います。

EWWW Image Optimizerは、次の3つの機能を備えています。

  • 画像アップロード時に自動でサイズを圧縮
  • 過去にアップロードした画像サイズの一括圧縮
  • WordPressテーマ(テンプレート)内の画像を一括圧縮

私の目測では圧縮後の画質の劣化は全く感じられませんでした。
一度設定してしまえば、後は自動で圧縮してくれますので、是非ともインストールをおすすめします。

1.EWWW Image Optimizerの設定方法

設定画面は英語ですが、ほとんどデフォルト(初期値)のまま、画像の通り行えば特に問題はありません。

EWWW Image Optimizerのインストール

WordPress管理画面から「プラグイン」→「新規追加」を選択し、検索窓から「EWWW Image Optimizer」を検索してください。表示されたEWWW Image Optimizerの「いますぐインストール」ボタンを押します。

1-1.Basic Settings(基本設定)

EWWW Image Optimizerの基本設定

インストールが完了すると管理画面メニュー「設定」→「EWWW Image Optimizer」が追加されます。

EWWW Image Optimizerの設定項目は「Basic Settings(基本設定)」「Advanced Settings(圧縮設定)」「Conversion Settings(画像変換の設定)」の3つです。
「Cloud Settings(クラウド設定)」は有料オプションなので飛ばします。

EWWW Image Optimizerの基本設定

「Basic Settings」タブにある「Remove metadata」にのみチェックを入れてください。
画像ファイルに付加された、作成日付、場所、緯度経度などの不要なメタデータを削除し、その分画像が圧縮されます。

1-2.Advanced Settings(圧縮設定)

EWWW Image Optimizerの圧縮設定

「disable pngout」にのみチェックを入れてください。
「optipng optimization level」は圧縮率の設定ですが、(default=2)のままで十分に最適化されます。

「disable jpegtran「disable optipng」「disable gifsicle」にチェックを入れてしまうと、Google推奨のjpeg、png、gif規格の画像最適化が無効になってしまいます。

1-3.Conversion Settings(画像変換設定)

EWWW Image Optimizerの画像変換設定

「Hide Conversion Links」のみにチェックを入れてください。

このチェックを外した場合、WordPressのメディアライブラリで、「JPG→PNG変換」が行えます。
必要性が無いため、この機能をオフにしましたが、変換機能を使いたい場合は、チェックを外してください。

2.EWWW Image Optimizerの使い方

以下の3通りの圧縮を行います。

  • 画像アップロード時に自動でサイズを圧縮
  • 過去にアップロードした画像サイズの一括圧縮
  • WordPressテーマ(テンプレート)内の画像を一括圧縮

2-1.新規アップロード画像の自動圧縮

EWWW Image Optimizerは、設定が完了していれば、これまで通りWordPressのアップローダーを使って、画像を新規投稿するだけで自動で圧縮してくれます。
管理画面メニューの「メディア」 → 「ライブラリ」から圧縮を確認することができます。

EWWW Image Optimizerの圧縮確認

上図では、32.7%(25.9KB)減り、「Reduced by 32.7%(25.9KB)」、圧縮後のファイルサイズが53.12KB「Image Size 53.12kB」になったことが分かります。

2-2.アップロード済み画像の一括圧縮

EWWW Image Optimizerをインストールする前にアップロードした画像を一括で圧縮することができます。
管理画面メニュー「メディア」→「Bulk Optimize」をクリックします。

EWWW Image Optimizerのアップロード済み画像の一括圧縮

上図では135個の圧縮されていない画像が検出されています。「Start optimizing」を押して圧縮を開始します。

EWWW Image Optimizerのアップロード済み画像の一括圧縮完了

「Finished」が表示され、圧縮が完了します。

2-3.WordPressテーマ内の画像を一括圧縮

WordPressのテーマ(テンプレート)によっては、圧縮されていない画像があります。
2-2項目同様、管理画面メニュー「メディア」→「Bulk Optimize」をクリックします。

EWWW Image Optimizerのテーマ内の画像を一括圧縮

「Scan and optimize」をクリックします。
自動で圧縮が完了します。

管理画面メニュー「メディア」→「Unoptimized Images」では、最適化されていない画像リストが表示されます。

3.まとめ

EWWW Image Optimizerのテーマ内の画像を一括圧縮

前回の68点から76点に改善され、画像の警告は消えました。

EWWW Image Optimizerは、Webサイトの画像ファイルを最適化できるプラグインです。
画像ファイルのサイズを軽量化し、データ通信量を減らすことでブログの表示が高速化するとともに、Googleのウェブマスター向けガイドラインにも適合した結果が伴います。

あなたのブログも画像の最適化を図り、SEOに効果的な表示速度の高速化を実現してください。

シェアする
2 コメント

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*