EWWW Image Optimizer とは
こんにちは、Gaasyuです。
今回はEWWW Image Optimizerという画像を劣化させず、それも自動で画像の容量を圧縮してくれるプラグインを紹介します。
使い方や設定などとても簡単で初心者のみならず誰でも使い易いプラグインです。
簡単に説明すると、
画像のファイルサイズを小さくすることでサイトの表示速度を改善してくれます。
EWWW Image Optimizerを紹介しおすすめする理由として
まず新しい画像をアップロードするときに自動で圧縮してくれます。
更に既にブログに掲載している画像も一括圧縮する事ができます。
とても便利なんです。
この記事に辿り着いた読者の方は恐らく
サイトが重い
サイトがなかなか表示されない
画像を簡単に圧縮したい
SEO対策の為にも表示速度のスピードを上げたい
などの理由で来られたかたと思います。
でも大丈夫です。
画像の圧縮などの表示速度の改善に手を付けていなかった方などには更に効果は期待できますよ。
では最初に気になるその実力のほどを検証しましたので紹介します。
EWWW Image Optimizerの効果検証
今回の効果検証では「PageSpeed Insights」を使用しました。
この「PageSpeed Insights」とは
ウェブページのコンテンツを解析し、ページの読み込み時間を短くするための改善方法を提案してくれるツールです。
グーグルが無料で提供してくれており、
パソコンとモバイル（スマホ）を同時に測定し、それぞれのページ読み込み速度を１００点を満点とし評価してくれます。
一つの指標として捉えて下さいね。
それでは早速検証結果に参ります！
「PageSpeed Insights」での検証結果その①
EWWW Image Optimizer導入前
EWWW Image Optimizer導入後
パソコンでの閲覧では数値上大きな変化はないものの、モバイルでの閲覧では20ポイントアップしました。49点以下の赤色表示から脱却です！
サイトの表示速度の改善につながりました。
この記事は、動く壁紙「Wallpaper Engine」についてかなり詳しく頑張って作成しました。文字数だけで約一万字ほど、画像をふんだんに使い、埋め込み動画も複数、GIF画像も入れていたのでかなり重かったはずです。
「PageSpeed Insights」での検証結果その②
EWWW Image Optimizer導入前
EWWW Image Optimizer導入後
こちらはパソコンでの閲覧が77点から91点に14ポイントアップ！表示速度の速いグループに、一方モバイルでの閲覧が26点から55点に倍以上にアップです。
この２例目もサイトの表示速度の改善が見られましたよ。
こちらの記事はブログの始め方について初心者でも迷う事がないように、とにかく画像を多く使いました。その画像も見栄えがいいようにとサイズの大きいものを使っていたので、その分圧縮され効果が大きく表れたようです。
EWWW Image Optimizerのインストール方法
それでは「EWWW Image Optimizer」のインストール方法を紹介しますね。
まずWordPressの管理画面から
＞プラグイン＞新規追加とクリックします。
＞右上の検索ボックスに「EWWW Image Optimizer」と入力。
＞「今すぐインストール」＞「有効化」の順にクリックして下さい。
プラグインの新規追加で「EWWW Image Optimizer」と「EWWW Image Optimizer cloud」とありますが
日本語表記のある「EWWW Image Optimizer 」を選択しましょう。
EWWW Image Optimizer の設定方法
次は「EWWW Image Optimizer」の設定方法です。
管理画面の左メニューから「設定」＞「 EWWW Image Optimizer 」と進みます。
設定箇所は２つ
- ベーシック
- 変換
上記以外はデフォルトのままでOKです。
ではまず「ベーシック」です
メタデータを削除
「メタデータを削除」にチェックを入れます。
メタデーターとは画像データーと共に含まれている撮影日時、場所、カメラの設定などの情報ですね。
それらの情報を削除してくれます。その分当然ファイルを縮小してくれますよ。
では次に「変換」です
コンバージョンリンクを非表示
ここでは「コンバージョンリンクを非表示」にチェックを入れましょう。
「コンバージョンリンクを非表示」とは、画像ファイルの保存形式を非表示にします。
その事により、勝手に画像の保存形式を変更できなくなります。
コンバージョンリンクが表示であれば、「png ＞jpg に変換」「jpg ＞ png に変換」が可能であり、
拡張子に変更によって起こる恐れの画質の低下を
「コンバージョンリンクを非表示」によって防いでくれます。
EWWW Image Optimizerでの実際の圧縮量の結果
では実際の「EWWW Image Optimizer」のプラグインをした場合の画像の圧縮量の結果です。
参考に何も圧縮されていない画像や、デジカメ、スマホで撮影したものであれば
下の画像を例に挙げると
下記のような結果になりました。-96.3%！激減していますね。
自撮りの写真を多くアップする場合など手間をかけずに自動で圧縮してくれるので有効だと思います。
でも実際はもっとデータ量の少ない画像を無料/有料のサイトから画像をダウンロードする事が多いと思いますので
私の場合だと下図のように
「EWWW Image Optimizer」を使用する事によって得られる効果は圧縮は20％位の結果となりました。
先ほどの-96.3%の後に見るとちょっと物足りないかも・・、。
と当然思うかもしれませんが、
冒頭に検証結果を記述した通りサイトの表示速度の改善に十分繋がっています。
「EWWW Image Optimizer」というプラグインの良さは圧縮率以上に
すでにアップした画像を一括で圧縮できる手軽さ、使いやすさにあると思います。
それでは次にその使い方を紹介しますね。
非常に簡単ですよ。
タイトルに入れておりますが
「初心者でも大丈夫」です！
EWWW Image Optimizer の使い方
この「EWWW Image Optimizer」の基本的な使い方は2つです。
・新しくアップした画像の圧縮
・すでにアップした画像を一括で圧縮
この「すでにアップした画像を一括で圧縮」がその画像が多いほどその分恩恵を得られてとても助かりますよ。
おすすめする一番の理由です。
新しくアップした画像の圧縮
まずは新しくアップした画像の圧縮です。
インストール＞有効＞はい、終わりです。
「EWWW Image Optimizer 」は、インストールするだけで新しくアップした画像を自動で圧縮してくれます。
圧縮率は、
ダッシュボード>メディア > ライブラリ」の画像一覧で確認できますよ。
先ほどの私のような結果が表示されます。
すでにアップした画像を一括で圧縮
次にすでにアップした画像を一括で圧縮の方法です。
こちらも簡単ですよ。
ダッシュボードから
メディア＞一括最適化＞最適化されていない画像をスキャンする
に進んで下さい。
すると表示が切り替わるので
＞「最適化を開始」をクリック＞はい、終わりです‼
どうですか？
簡単ですよね。
一度入れておくと後は勝手に頑張ってくれますので
是非このプラグインを活用してみてくださいね！
最後に手間は少々掛かりますが更に圧縮できるサイト「TinyPNG」を紹介します
「EWWW Image Optimizer」は、これからアップする画像、既にアップした画像を
簡単に圧縮するプラグインです。
ただ圧縮する、もっと圧縮したいのであれば
画像圧縮サイトの「TinyPNG」をおすすめします
圧縮率は高めです。
なのでデータの大きいサイズの画像はあらかじめこのサイト「TinyPNG」で圧縮しておくといいと思います。
サイトの表示速度アップには画像の圧縮はとても重要です。
SEO対策の為にも当ブログを参考にして少しでも役立ててもえたらと思います。
それではこれで
【必見！初心者でも大丈夫】サイト表示速度改善！プラグイン「EWWW Image Optimizer 」の使い
コメント