サイト速度改善に役立つプラグインならこの3つ【まるっと解決】

サイト速度改善に役立つプラグインならこの3つ【まるっと解決】 サイト速度改善
ブロガーさん
  • 自サイトがなんだか重い気がする。。。
  • 自サイトの表示速度を改善したい。

そんな疑問が解決できる記事を書きました。

本記事の内容

  • サイト速度改善に役立つ3つのプラグインの紹介
  • サイト速度改善に関する豆知識

執筆者情報

僕が運営する当サイトは、これから紹介するプラグインの導入やその他施策により、PageSpeedInsightsで34点→67点の表示速度スコア改善に成功しています。

コアラ

さっそく解説していきます。

\当ブログで使用中のテーマ/

 

サイト速度改善に役立つプラグイン3選

サイト速度改善に役立つプラグインならこの3つ

はじめに結論。

サイト速度改善に役立つお手軽プラグインはこの3つ。

プラグイン目的
1Compress JPEG & PNG images画像圧縮
2Autoptimize・コード圧縮
・画像読み込み遅延
3WP Fastest Cacheキャッシュ活用

順に解説していきます。

導入する前に自サイトの表示速度を確認しておこう!

3つのプラグインを導入する前に、PageSpeedInsightsで現在の自サイトの表示速度を確認しておきましょう。

使い方が分からなければ、こちらの記事を参考ください。
(1分でできます)

【最新版】PageSpeedInsightsの使い方と計測結果の見方を解説

【最新版】PageSpeedInsightsの使い方と計測結果の見方を解説

①Compress JPEG & PNG imagesプラグイン

Compress JPEG & PNG imagesプラグイン

以下について順に解説します。

  • Compress JPEG & PNG imagesってどんなプラグイン?
  • Compress JPEG & PNG imagesの導入方法
  • 画像の最適化ベストプラクティス

Compress JPEG & PNG imagesってどんなプラグイン?

Compress JPEG & PNG imagesは、画像の最適化に必須の画像圧縮を行ってくれるプラグインになります。

ページのほとんどが静的な個人サイトにおいて、画像のファイルサイズが一番大事と言ってもいいでしょう。

なぜなら、画像のファイルサイズは、Webサイトを構成するHTMLやCSSコードに比べて明らかに大きいから。

このプラグインを導入すれば、WordPressに画像をアップロードするときに自動で圧縮してくれます。

EWWW Image Optimizerではだめなの?

よく比較されるのですが、画像圧縮プラグインの有名どころとして、EWWW Image Optimizerプラグインというものもあります。

こちらを採用しても全然かまいませんよ。

細かい話は抜きにして簡単にまとめると、下表のとおり。
※両者無料版の場合です。

EWWW Image OptimizerCompress JPEG & PNG images
圧縮方針画像劣化を最小限に抑えて圧縮圧縮最優先
圧縮率Compress JPEG~に比べると、低い高い
サーバーへの負荷高い
※ページの表示速度に影響が出る可能性がある
低い
無料版でできること何枚でも圧縮可能500枚/月まで
おすすめな人・画像の枚数が多い
・画像(写真)を最大限売りにしたサイト
・画像の枚数がそこまで多くない
・ページの表示速度を損ないたくない
Compress JPEG & PNG imagesは月500枚となっていますが、実はWordPressは画像をアップロードした瞬間にいくつかの表示サイズに合わせた画像を複製します

それらの画像すべてに圧縮の設定をしていると、月100枚くらいとなるので注意。

コアラ
結局どちらがおすすめ?と聞かれれば、僕も使用しているCompress JPEG & PNG imagesと答えます。

なぜかと聞かれれば、以下の理由です。

  • 圧縮最優先のため、EWWW~より画像劣化があると言っても、見た目上は分からないレベルだから
  • サーバーの負荷が低く、ページ速度を損なわないから
  • 月100枚程度で今のところ問題ないから

導入方法

こちらのサイトでていねいに解説されているので参考ください。

>>【画像圧縮】Compress JPEG & PNG images プラグインの設定と使い方

画像の最適化は「リサイズ」してから、「圧縮」がベストプラクティス!

画像の最適化は「リサイズ」してから、「圧縮」がベストプラクティス!

画像の最適化は以下の手順で行うのがベストプラクティスです。

  1. 画像のリサイズ
    (Bulk Resize Photosを使用。JPG化も合わせて行う。)
  2. 画像の圧縮
    (WordPressに画像アップロードすれば、Compress JPEG & PNG imagesプラグインが自動で圧縮してくれる)
Bulk Resize Photosは画像サイズを縮小してくれるツール。

ついでにファイル形式をPNG➡JPG化も行ってくれます。

あなたのサイト記事の表示幅に合わせて画像サイズをリサイズしてみてください。

ブロガーにおすすめの画像リサイズツール「Bulk Resize Photos」がスゴイ!

ブロガーにおすすめの画像リサイズツール「Bulk Resize Photos」がスゴイ!

画像サイズの目安
特に画質にこだわりがなければ、アイキャッチ画像なら、200KB以内。
その他画像は80KB以内くらいを目安にしてみてください。
コアラ
あくまで目安です。

豆知識:JPGとPNGについて

画像の拡張子でよく見かけるJPGとPNGの違いについて、ご存知ない方は以下を参照ください。

JPG
自然物、色がにぎやか、多様色に向いている。
PNG
人工物、使われる色の数が少ない、単色系に向いている。

それぞれに適したもののほうがファイルサイズも軽くなります。

Twitterのブロガー界隈でよく、なんでもかんでもJPG化をおすすめしているのを見かけますが、PNG形式のほうが軽くなることもあるので注意。
コアラ
とはいえ、良く分からなければJPGにしておきましょう。

②Autoptimizeプラグイン

Autoptimize

以下について順に解説します。

  • Autoptimizeってどんなプラグイン?
  • Autoptimizeの導入方法

Autoptimizeってどんなプラグイン?

こんなプラグインです。

  • CSSやJavaScriptコードを圧縮してくれる
  • 画像を遅延読み込みしてくれる

コードの圧縮とは?

コードの圧縮とは、改行やスペースやコメントなど、無駄な記述を省いてファイルサイズを小さくすること。

必要なコードは消されないので安心してくださいね。

画像の遅延読み込みとは?

ページを開いたとき、画面外の画像ってどうせ見えないですよね?

Autoptimizeの導入により、画面外の画像はあとで読み込むように設定できます。

もちろん、最初にすべての画像を読み込むより、表示速度も向上します。

導入方法

こちらでていねいに解説していますので参考ください。

Autoptimizeプラグインの設定方法【注意点あり】

Autoptimizeプラグインの設定方法【注意点あり】

画像の遅延読み込みは、表示が崩れたりすることもあります。

実際に自サイトのページを読み込んでみて画面を確認してみてください。
※特にスマホ画面で確認されることをおすすめします。

③WP Fastest Cacheプラグイン

③WP Fastest Cacheプラグイン

以下について順に解説します。

  • WP Fastest Cacheってどんなプラグイン?
  • WP Fastest Cacheの導入方法
  • WP Fastest Cache導入の注意点

WP Fastest Cacheってどんなプラグイン?

WP Fastest Cacheプラグインは、キャッシュの活用を図るプラグイン。

キャッシュとは?
閲覧したサイトの情報を記憶して、次に速く読み込めるようにする機能のことです。

これを活用することで、表示速度を改善できます。

導入方法

こちらのサイトでていねいに解説されているので参考ください。

>>WP Fastest Cacheの使い方・設定方法【キャッシュ改善のおすすめプラグイン】

注意点:カスタマイズしたら、キャッシュクリアをお忘れなく

WP Fastest Cacheを導入すると、テーマのカスタマイズなどを行った際に、画面に反映されないことがよくあります。

それは、カスタマイズ前のキャッシュが残ってしまうためです

面倒ですが、カスタマイズを行った際はキャッシュをクリアするようにしましょう。

▼キャッシュのクリアはWordPressのホーム画面からできます。

キャッシュのクリア

サイト速度改善に役立つお手軽プラグイン3選 まとめ

サイト速度改善に役立つお手軽プラグイン3選 まとめ

いかがでしょうか。

すべて導入できましたら、再度PageSpeedInsightsにて表示速度を計測してみてください。
少し改善されていることと思います。

プラグインを入れすぎると読み込みに時間がかかり、重くなりがちです。
なのでプラグインは厳選すべきではあります。

とはいえ、今回紹介したプラグイン3種はあまり時間をかけずに表示速度の改善が図れるので、サクッと解決したい人には超おすすめです。

コアラのまとめ

サイト速度改善に役立つプラグインならこの3つ

  1. Compress JPEG & PNG imagesプラグイン
    圧縮してくれます。
  2. Autoptimizeプラグイン
    コードや画像の最適化をしてくれます。
  3. WP Fastest Cacheプラグイン
    キャッシュを活用することで速く読み込めるようになります。

この記事が少しでもお役に立ちますと幸いです。

【画像最適化】WordPressに画像を掲載するまでの手順を解説

【最新版】PageSpeedInsightsの使い方と計測結果の見方を解説

【最新版】PageSpeedInsightsの使い方と計測結果の見方を解説