5月7日(火) まで最大54%OFF1,000円クーポン(コノハウィング)

【1分でWebP変換】SWELLで「EWWW Image Optimizer」を設定する手順

プロモーションが含まれる場合があります
ewww-image-optimizer
  • URLをコピーしました!

「EWWW Image Optimizer」は、画像最適化プラグインです。WordPressで画像をアップロードする際に、自動でリサイズ、圧縮してくれます。

そのため、画像圧縮サイトでの作業手間を短くできます。

やたろう

SWELLで使って1年。不具合ないです。

この記事では、SWELLに「EWWW Image Optimizer」を導入する手順と使い方をご紹介します。

この記事を読めば、10分でプラグインを設定できます。

この記事を書いている人
プロフィール
筆者のプロフィール画像
やたろう
  • ConoHaWINGユーザー4年目
  • SWELLユーザー3年目
  • SEO検定一級合格
  • 月収6ケタ(プラチナランク)
  • 某ASPの社員
A8プラチナ会員
A8:プラチナ会員

スクロール&拡大できます

SEO検定1級
SEO検定1級
登場人物
登場人物
この記事でわかること(もくじ)

EWWW Image Optimizerとは【画像最適化プラグイン】

EWWW Image Optimizerとは?
EWWW Image Optimizer

EWWW Image Optimizer「以下EIO」は、画像最適化プラグインです。ワードプレスに画像をアップするとき、自動でリサイズ、圧縮してくれます。

やたろう

これからアップする画像だけでなく、アップ済みの画像も圧縮してくれます。

EIOは、無料版と有料版(Cloud)があります。無料の場合「1回の圧縮で500枚以内、圧縮率は20%」と制限があります。有料に制限はありません。

ココがポイント

個人ブログなら、無料版で問題ないです。

有料版は、大企業やプロのブロガーさん向けプランです。

EWWW Image Optimizerを導入するメリット
  • 劣化なく画像を圧縮できる
  • いちいちフォトショでリサイズしなくて良い
  • サーバーへの負担が少なくなる
  • Webp形式に対応しているのでサイトが軽くなる
  • ドメインパワーが上がりやすい
  • 画像のメタ情報も削除できる

通常、画像を圧縮する場合「compressjpeg」「iloveimg」など、外部ツールを利用します。しかし、いちいちアップロードして圧縮するのは、かなり面倒です。

EIOは、画像をアップロードするときに、自動で圧縮してくれます。例えば「compressjpegやiloveimg」で、画像1枚を圧縮するのに30秒かかる場合、100枚画像を圧縮したら50分です。

つまりEIOを使うことで、1時間近く、作業時間を節約できます。

EIOの設定手順を詳しく解説【一括でWebP変換】

インストール手順と初期設定
インストール手順と初期設定

ここからは、EIOのインストール手順と初期設定について、画像で解説いたします。

STEP
EWWW Image Optimizerをインストール
EWWW Image Optimizerをインストール
EWWW Image Optimizerをインストール

まず、ワードプレスからプラグインをインストールします。

  1. 画像「プラグイン」をクリック
  2. 画像、キーワードから「EWWW Image Optimizer」を検索
  3. インストール完了したら有効化する
設定画面を開く
設定画面を開く

「EWWW Image Optimizer」のプラグインを有効化したら、初期設定をします。

ワードプレス管理画面の左ナビから、以下進めます。

  1. ツール「設定」をクリック
  2. 「EWWW Image Optimizer」をクリック
STEP
設定

次は、詳細設定です。

簡単モードに移行
簡単モードに移行

「EWWW Image Optimizer」設定画面トップへ。画像①の「Enable Ludicrous Mode」(簡単モード)をクリックすると、詳細設定画面に遷移します。

詳細設定
詳細設定
  1. 「基本」タブをクリック
  2. メタデータ削除にチェック
  3. 画像のリサイズ
  4. Webp変換にチェック

メタデータ削除

②のメタデータとは、画像情報です。

スマホなどで撮影した写真をブログにアップする際、Exifデータ(撮影情報や位置情報などのデータ)が記載されているケースがあります。

Exifデータ
Exifデータ

情報漏えいを防ぐため、メタデータは削除がおすすめです。

画像のリサイズ

③「画像のリサイズ」で、リサイズサイズを指定できます。

1,200ピクセル以上を推奨します。

※「500PX」のように、リサイズ設定が小さいと、SearchConsole(サーチコンソール)から警告がきます

WebP(ウェッピー)変換にチェック

WebP自動変換
WebP(ウェッピー)拡張子

WebP(ウェッピー)変換にチェックします。

WebPとは、Googleが開発した画像フォーマット。画質を劣化させず軽量化できるメリットがあります。

画像形式WebPJPEGPNGGIF
圧縮方式非可逆圧縮非可逆圧縮可逆圧縮可逆圧縮
透過
アニメーション
WebP(ウェッピー)特徴表
やたろう

画像をWebP(ウェッピー)にするだけで、サイト表示速度が上がり、SEOが有利になるメリットがあります。

「WeaPの配信方法」のコードを全コピー

サイトにWebPを導入する手順を解説します。

  • 「WebP変換」にチェック
  • コードをコピー
コピーしたコードをサーバーの「 .htaccess」に貼り付ける

コノハウィングにログインして、コピーしたコードをコノハウィングの「 .htaccess」に貼り付けます。

  • サイト管理
  • 対応設定
  • .htaccess設定
コピーしたコードを貼り付ける
  • 「えんぴつマーク」をチェック
  • コピーしたコードを最上部にペースト
  • 保存

保存できたら、WordPressに戻ります。コノハウィングはログアウトしてOK。

表示が「WEBP」に変わる

「EWWW Image Optimizer設定画面」に戻ったら、①保存→「F5」でページ更新します。

表示が「WEBP」に変わってれば正しく設定されています。

表示が緑色「WEBP」に変れば「コノハウィング .htaccess」が正しく設定されている証拠。

メディア→一括最適化

WordPress管理画面の①メディア→②一括最適化をクリック。

最適化されてない画像をスキャンする

「最適化されてない画像をスキャンする」をクリック。

JPGやPNGが「WEBP」に変換されました

JPGやPNGが「WEBP」に変換されました。

アップロード済みの画像も「WEBP」に自動変換されます。

STEP
その他設定
赤枠はデフォルトでOK
赤枠はデフォルトでOK

上記画像の赤枠は、デフォルトのままで大丈夫です。

EWWW Image Optimizerの使い方【画像圧縮】

実際に画像最適化してみる
最適化

「EWWW Image Optimizer」の設定が終わったら、実際に画像の最適化をしてみましょう。

「EWWW Image Optimizer」の使い方は2通りあります。

  1. これからアップする画像を圧縮、最適化
  2. アップ済みの画像を圧縮、最適化

順番に解説します。

これからアップする画像を圧縮、最適化

無料素材のサイズが大きい画像の詳細
無料素材のサイズが大きい画像詳細

「EWWW Image Optimizer」を使うことで「どれだけ最適化されるか?」検証します。画像は 「4000ピクセル×2667ピクセル」の大きい画像で検証します。

ワードプレスにアップロード
ワードプレスにアップロード

ワードプレスに「4000ピクセル×2667ピクセルの画像」をアップロードします。

画像の自動最適化
画像の自動最適化

ワードプレス管理画面の「メディア」から、アップロードした画像を確認。

すると、以下に自動調整されてました。

  • ファイルサイズ:3.67MB→87KBに削減
  • サイズ(画像):4000ピクセル×2667ピクセル→900ピクセル×600ピクセルにリサイズ

圧縮だけでなく「EWWW Image Optimizer」で設定したサイズにリサイズされてました。

「EWWW Image Optimizer」は、外部ツール不要で圧縮リサイズできます。時間が節約となるので、サラリーマンにはありがたい無料プラグインです。

アップ済みの画像を圧縮、最適化

EWWW Image Optimizerは、過去にワードプレスにアップした画像も、ワンクリックで最適化できます。

最適化の手順1
画像をスキャンする
  1. 「メディア」をクリック
  2. 「一括最適化」をクリック
  3. 「最適化されていない画像をスキャンする」をクリック
155点の画像を最適化
155点の画像を最適化

過去、圧縮していない画像「155点」が自動抽出されます。

自動で最適化中
自動で最適化中

「最適化ボタン」をクリックすると、画像の最適化が始まります。

完了と最適化ログ
完了と最適化ログ

画像最適化は、1分ほどで完了しました。

WebP(ウェッピー)設定をした場合、WebPに変換されます。

一括最適化完了
一括最適化完了
やたろう

ワンクリックで「画像サイズ1.7%(49 B)減少」できました。

「EWWW Image Optimizer」で時間の節約【まとめ】

まとめ
まとめ

まとめです。

「EWWW Image Optimizer」は、画像の自動圧縮プラグインです。使う画像が多いほど、作業の短縮ができます。

  • ブログに使える時間が増える
  • サイト表示速度が速くなる
  • SEOで上位表示されやすくなる

といった効果が得られます。

しかも、「EWWW Image Optimizer」は無料で利用できます。これからずっと、画像のリサイズと圧縮に工数を取られません。ワンクリックで「SEO対策」ができます。

それって、とっても効率的だと思いませんか?

よかったらシェアしてね!
  • URLをコピーしました!
この記事でわかること(もくじ)