ゲームBGMをすこれ

【簡単に90点以上とれる】サイト速度を改善できるプラグインまとめ

WRITER
 

スポンサードリンク



この記事を書いている人 - WRITER -
ゲーム音楽をこよなく愛するものです。 このブログではゲーム音楽に関する記事や大学生活に関する記事、ブログに関する記事を紹介します。 超絶田舎の地方国立大学に通ってます。週1くらいで更新してるので暇なときに見に来てください。たまに面白い記事書いてます。彼女募集中!!←≪重要≫  
詳しいプロフィールはこちら

サイト速度を改善したいけどCSSとかいじるのはよく分からないし面倒くさい・・・

 

サイト速度の改善はSEOやサイトの質の向上のためにも重要で、早ければ早いほどいいです。

サイト速度の測定は、他の多くのサイトでも紹介されていますが、Googleが提供しているサイト速度測定サービスPageSpeed Insightsを使うのが一般的ですが、合格点の90点以上を獲得するのはかなり大変です。

私も色々プラグインをダウンロードしたりCSSをいじったりして改善をしてきましたが、なかなか90点以上はとることができませんでした。

上の画像のように最近ようやくモバイル・PC共に90点以上取れたので特に効果のあったプラグインを紹介していきます。プラグインを有効化するだけで早くなったので人によっては今回紹介するプラグインを有効化するだけで90点以上狙えるかもしれません。

  • PageSpeed Insightで90点以上とりたい
  • 他のサイトを見ても上手くいかなかった

このような方はぜひ参考にしてみてください。

 

サイトが遅くなる主な原因

サイト速度改善に向けて試行錯誤した経験から、サイト速度を遅くしている主な原因は以下の二つです。

  • サイトで使っている画像
  • アドセンス広告

 

この二つの影響が特に大きく逆に言えばこの二つの要素に対して対策を行うことでサイト速度が劇的に向上します。

極論画像を一枚も使わず、アドセンス広告を一枚も貼らなければサイト速度はすげー早くなりますが、そうゆうわけにはいきませんよね😅

 

 

サイト速度改善に効果のあるプラグイン

私がサイト速度のスコア90以上をとるのに使用したプラグインは以下の

  • Autoptimize
  • EWWW Image Optimizer
  • Flying Scripts by WP Speed Matters

 

Autoptimize

Autoptimizeは、JavaScriptやCSSなどの最適化画像の遅延読み込みをやってくれます。

PageSpeed Insightsの「CSS の最小化」や「JavaScript の最小化」、「オフスクリーン画像の遅延読み込み」の項目の改善が期待できます。

 

設定する項目は「JS,CSS&HTML」のタブでは

  • JavaScript コードの最適化
  • JS ファイルを連結する
  • CSS コードを最適化
  • CSS ファイルを連結する
  • インラインの CSS も連結
  • すべての CSS をインライン化
  • HTML コードを最適化
  • 連結されたスクリプト / CSS を静的ファイルとして保存
  • 除外された CSS ファイルと JS ファイルを最小化
  • 404 フォールバックの使用
  • ログイン状態の編集者、管理者にも最適化を行う
  • Enable configuration per post/ page?

の項目にチェックをつけます。

 

続いて「画像」タブでは

  • 画像の遅延読み込み (Lazy-load) を利用

にチェックをつけます。 設定はこれだけ。

画像の遅延読み込みは他のプラグインを使用する方法もありますが、特に理由がなければ一つのプラグインで済むのでAutoptimizeで十分です。

 

 

EWWW Image Optimizer

EWWW Image Optimizerは画像圧縮の最強プラグインです。

EWWW Image Optimizerは、記事を書く時に画像をアップロードした時などに自動的に画像の圧縮をおこなってくれる他、ボタン一つで過去にアップロードした画像の圧縮を行なってくれます。

  • メタデータを削除
  • WebP 変換

の項目をチェックするだけで設定終了です。 

WebP変換は、改善項目の「次世代フォーマットでの画像の配信」に対して効果的で、画像をWebPというフォーマットに自動的に変換してくれます。 WebPにはブラウザによって対応してない場合があるという欠点がありますが、EWWW Image Optimizerは対応してないブラウザではWebP変換前の画像を表示するようになっています。

過去にアップロードした画像の圧縮を行う場合は、「ダッシュボード」→「メディア」→「一括最適化」から行えます。

 

Flying Scripts by WP Speed Matters

Flying Scripts by WP Speed Mattersは、不要なJavaScriptを読み飛ばすことでサイトを高速化することができます。

PageSpeed Insightsの「使用していない JavaScript の削減」の改善に効果的です。

  • Include Keywordsに読み飛ばしたい記述を入力
  • Timeoutを5sに設定(ここは好みによる)

Include Keywordsに入力するのは、PageSpeed Insightsの「使用していない JavaScript の削減」のタブを開いたとこに出てくる「~.js」という部分です。

こちらの画面だと「show_ads_impl_fy2019.js」、「jquery.min.js」をInclude Keywordsに入力すればOK。

 

PCの方は90点取れてるけどモバイルの方が取れない・・・

という方には特に効果的だと思います。

 

それでも90点取れない場合は・・・

今回紹介したプラグインを試したけれど90点以上取れなかった・・・ という方は、サーバーを高速のものに変えるといいかもしれません。

このサイトでは国内最速のレンタルサーバーであるConoHa WINGを使っているため、レンタルサーバーの性能の差が原因となっていることが考えられます。

90点以上を目指したい、100点を目指してさらに高速化をはかりたいという方はぜひ試してみてください。

この記事を書いている人 - WRITER -
ゲーム音楽をこよなく愛するものです。 このブログではゲーム音楽に関する記事や大学生活に関する記事、ブログに関する記事を紹介します。 超絶田舎の地方国立大学に通ってます。週1くらいで更新してるので暇なときに見に来てください。たまに面白い記事書いてます。彼女募集中!!←≪重要≫  
詳しいプロフィールはこちら

- Comments -

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

Copyright© WATA-BLOG(わたブログ) , 2021 All Rights Reserved.