ブログの始め方から
収益化までを徹底解説

 

【2022年3月最新】EWWW Image Optimizerの使い方をわかりやすく解説【WebP設定も紹介】

EWWW Image Optimizerの使い方

「ページの読み込み速度が遅いので改善したい」
「EWWW Image Optimizerなら自動で画像を圧縮してくれるって本当?」
「インストールしてみたけど設定方法がわからない」

EWWW Image Optimizerは、自動で画像を圧縮してくれるWordPressプラグインです。

誰でも簡単にページの読み込み速度が改善できるため、おすすめのプラグインとして紹介されることの多いEWWW Image Optimizer。

1枚ずつ圧縮する手間が省けたり、過去にアップした画像を一括で最適化できたりと、メリットが多いプラグインです。一方で、WordPress初心者には「設定の難易度が少し高い」という印象を持たれています。

そこでこの記事では、EWWW Image Optimizerについて以下の点を紹介します。

  • EWWW Image Optimizerの概要
  • インストール・設定方法
  • EWWW Image Optimizerで画像を最適化する方法

最近、注目を集めている「WebP設定」についても解説するので、ぜひ参考にしてみてください。

執筆者:沖ケイタ
株式会社沖プロ代表。ブログ歴8年。ブログ収益の累計は数千万円以上。過去に100人以上のブログ初心者の相談に乗った経験あり。1600人以上が受講するWebライター向け講座「Writing Hacks」のメイン講師。
X(旧:Twitter):@namakemono0309(フォロワー:47,000人)
ブログ:https://www.proof0309.com/
 

EWWW Image Optimizerとは?30秒でサクッと解説

EWWW Image Optimizerとは?

EWWW Image Optimizerは、画像を圧縮できるWordPressの無料プラグインです。画像を圧縮すると容量が小さくなり、ページの読み込み速度が改善できます。その結果、読者のストレスを軽減し、さらにはGoogleからの評価アップにつながります。

サイトを閲覧していて「ページの読み込みが遅くてイライラする」と感じた経験はありませんか。サイトは画像を挿入するほどページの表示速度が遅くなるので、読者が離脱する原因となります。

実際に「ページの読み込みに3秒以上かかるサイトは、40%の読者が離脱する」というデータがあります。またGoogleは2018年に「ページの読み込み速度をモバイル検索の順位要素に使用する」という発表をしました。

つまり、ページの表示速度は読者の満足度やGoogleの検索順位に非常に重要な要素となります。EWWW Image Optimizerなら自動で画像を圧縮してくれるので、ブログ初心者でも簡単にページの表示速度が改善できる点がメリットです。

一方で「画像を圧縮したら画質が悪くなるのでは?」と不安に感じた方もいるのではないでしょうか。以下の写真は、圧縮前の画像です。

スクリーンショット

95.8%(2.3MB)圧縮した画像は、以下のとおりです。

スクリーンショット

多くの方は「全く気にならない」と感じたと思います。EWWW Image Optimizerは、画質の劣化を抑えながらページの表示速度を改善できるので、大変おすすめです。

EWWW Image Optimizerのインストール方法

EWWW Image Optimizerのインストール方法

まずは、EWWW Image Optimizerのインストールを行います。WordPressのダッシュボードから「プラグイン」をクリックしましょう。

スクリーンショット

続いて、画面上部に表示される「新規追加」をクリックします。

スクリーンショット

画面右上に検索窓が表示されるので、キーワードに「EWWW Image Optimizer」と入力し『今すぐインストール』をクリックします。

スクリーンショット

インストールが完了したら「有効化」をクリックしてください。

スクリーンショット

「プラグインを有効化しました。」との表示がされたら、無事に有効化が完了したサインです。

スクリーンショット

EWWW Image Optimizerの初期設定

EWWW Image Optimizerの初期設定

EWWW Image Optimizerのインストールが完了したら、プラグインの設定を行います。ここでは、以下の手順を解説します。

  1. 基本設定前の準備
  2. 基本設定
  3. WebP変換の設定

それぞれについて、詳しく見ていきましょう。

1. 基本設定前の準備

まずは、WordPressのダッシュボードの「設定」から「EWWW Image Optimizer」を選択しクリックしてください。

スクリーンショット

EWWW Image Optimizerの管理画面が表示されるので、基本タブに表示された「Enable Ludicrous Mode」をクリックしましょう。

スクリーンショット

3つのタブが8つに増えたのを確認したら、基本設定を行っていきます。

スクリーンショット

2. 基本設定

基本設定の項目は、以下の3つです。

  • メタデータを削除
  • 画像のリサイズ
  • 変換リンクを非表示

メタデータを削除

メタデータとは、画像に付随する「日時や位置などの情報」です。メタデータは、画像の容量が大きくなるだけではなく、個人情報を拡散してしまうリスクもあるので、削除しておきましょう。

基本タブに表示された『メタデータを削除』にチェックマークを入れます。

スクリーンショット

下にスクロールして、画面左下「変更を保存」をクリックして完了です。

スクリーンショット

注意
「変更を保存」のクリックは忘れがちなので、注意しましょう。

画像のリサイズ

画像の容量は「ピクセル数」も大きく関係しています。EWWW Image Optimizerでは、画像のピクセル数も変更(リサイズ)できるので、設定しておきましょう。

ただし、画像編集ソフトでリサイズを行っているという方は、設定不要なので「幅の上限0」「高さの上限0」のままでOKです。

まずは、基本タブに表示された「画像のリサイズ」を選択します。

スクリーンショット

一般的にブログでおすすめされているサイズは「幅の上限780~1200」「高さの上限0」ピクセルです。高さは「0」に設定しておくと、幅の比率に合わせて縮小されるのでおすすめです。入力が終わったら、忘れず「変更を保存」をクリックしましょう。

変換リンクを非表示

「変換リンクを非表示」にチェックを入れておくと、画像の拡張子の変更が防げます。画像の拡張子とは、ファイル形式のことです。「.jpg」「.png」などの拡張子が勝手に変更されてしまうと、画像の質が悪くなる原因となるので、忘れずに設定しておきましょう。

変換タブを開き「変化リンクの非表示」にチェックを入れます。チェックしたら「変更を保存」をクリックして、設定完了です。

スクリーンショット

3. WebP変換の設定

基本設定が完了したら、WebP変換の設定を行います。WebP(ウェッピー)とは、Google公式の画像フォーマットです。

WebP は、Web 上の画像に優れたロスレスおよび可逆圧縮を提供する最新のイメージ形式です。WebP を使用すると、Web マスターや Web 開発者は、Web をより速くする、より小さく、より豊かな画像を作成できます。WebP ロスレス画像は PNG と比較してサイズが 26% 小さくなっています。引用:GoogleⅮevelopers

EWWW Image Optimizerでは、WebPに変換し、対応するブラウザに合わせて画像変換が可能です。なお、EWWW Image OptimizerでWebP変換を行う場合、サーバーの管理画面で「.htaccess設定」を行う必要があります。

まずは、基本タブから「WebP変換」にチェックを入れましょう。

スクリーンショット

「WebP変換」にチェックを入れて「変換を保存」をクリックすると「WebPの配信方法」にコードが表示されます。

スクリーンショット

コードをコピーして、お使いのサーバー管理画面から「.htaccess」の冒頭にコードを追加します。

注意
「リライトルールを挿入する」をクリックすると、自動で「.htaccess」への追加ができます。しかし、コードが「.htaccess」の1番下に追加されるケースがあるので注意しましょう。「.htaccess」の冒頭にコードを追加するには、手動でのコピペがおすすめです。

反映されると、コード右下の「PNG」が「WEBP」に変更するので確認してみてください。

お使いのサーバーによって、ファイルマネージャーを表示する設定が必要な場合があります。「.htaccessの設定方法がわからない」という方は、サーバーのサポートサイトで確認してみることをおすすめです。

例えば、カラフルボックスのサポートサイトでは、設定方法を画像付きでわかりやすく解説しています。お困りの方は、利用してみてください。

EWWW Image Optimizerの使い方【画像最適化】

EWWW Image Optimizerの使い方

EWWW Image Optimizerは、以下の使い方があります。

  1. 新規でアップロードする画像を最適化
  2. 既にアップロード済みの画像を最適化

基本設定が完了してしまえば、あとは自動で画像が圧縮できます。過去にアップロード済みの画像も一括で最適化できるので、面倒な圧縮作業は一切必要ありません。

それぞれについて、詳しく見ていきましょう。

1. 新規でアップロードする画像を最適化

EWWW Image Optimizerの設定が完了した後は、新規でアップロードする画像は自動で圧縮できます。

画像がどのくらい圧縮されているか気になる方は、以下の手順で確認してみてください。まずは、WordPressのダッシュボードから「メディア」を選択して「ライブラリ」をクリックします。

スクリーンショット

画面右に表示された「画像最適化」を確認してみましょう。例えば、以下の場合「上の画像では92.1%」「下の画像では66.1%」圧縮ができていることが分かります。

スクリーンショット

2. 既にアップロード済みの画像を最適化

EWWW Image Optimizerは「過去にアップロードした画像も圧縮したい」という場合も、簡単に最適化できます。

注意
一度画像を最適化してしまうと元には戻せません。そのため、必ずバックアップを取ってから実施することをおすすめします。

まずは、WordPressのダッシュボードの「メディア」から「一括最適化」を選択しましょう。

スクリーンショット

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

スクリーンショット

最適化できる画像数が表示されるので「◯点の画像を最適化」をクリックしましょう。例えば、以下の場合「319点の画像を一括で最適化できる」ということになります。

スクリーンショット

ちなみに、319点の最適化にかかった時間は26分でした。画像数が多い場合は時間がかかるケースがあるので、余裕がある時に行うことをおすすめします。

【4月30日まで】WordPress移行応援キャンペーン!
「BOX1 : 40%OFF」「BOX2〜BOX8 : 50%OFF」&ドメイン永年無料

サーバー初回料金割引&ドメイン永年無料

1. サーバーBOX1「40%OFF」

初心者や小規模サイト運営に最適なBOX1プランを初回利用時40%OFFでご提供

2. サーバーBOX2〜BOX8「50%OFF」+ ドメイン永年無料特典

BOX2 〜 BOX8プランを、初回利用時50%OFFでご提供
他社からカラフルボックスへのドメイン移管手数料無料の「ドメイン永年無料特典」もご利用可能

※対象ドメインは「 .com / .net / .org / .info / .biz / .jp 」の6種類
※注意事項
他のプロモーションコード(クーポンコード)との併用は不可
キャンペーン中にサーバー契約(12ヶ月以上)で、WordPress移行無料代行を1回利用可
WordPress移行代行はスケジュールを押さえて進め、予告なくの受付終了あり
お客様都合で日程調整ができない場合、申込み取消しあり
環境により移行できない場合あり

WordPress移行代行サービス無料

WordPressサイトの移行をサポートするため、専門スタッフによる移行代行サービスを無料提供

>> WordPress移行応援キャンペーンはこちら

▼WordPressの始め方はこちら▼ 日本で一番簡単なWordPress始め方マニュアル【最短5分】WordPressブログの始め方を小学生でもわかるように解説 >>【最短5分】WordPressブログの始め方を小学生でもわかるように解説