ご覧いただきありがとうございます。
ブログを運営していく上で欠かせない、サイトスピードの改善に悩んでいませんか？「読み込みスピードが遅い」という理由で記事を読んでもらえなくなるのは残念ですよね。
私自身も改善に四苦八苦しましたが、模索した結果、いくつかの方法を組み合わせてようやくPageSpeed Insightsの赤色を脱出することができました。
本記事では、そんな私が実践したことの1つ、「レンダリングを妨げるリソースの除外」の対処法について解説していきます。
✔️サイトスピードが上がらなくて困っている人
✔️PageSpeed Insightsの「レンダリングを妨げるリソースの除外」という項目を改善したい人
プラグインを導入することで改善が期待できます♩初心者の方でも対処できるので、一緒に頑張りましょう！
「レンダリングを妨げるリソースの除外」とは？
「PageSpeed Insights」というツールを用いることで、自分のサイトのサイトスピードと改善できる項目を知ることができます。
まだ使ったことがない方は、こちらの記事で使い方を紹介しています。
この項目の中にある「レンダリングを妨げるリソースの除外」を解決していきます。
まずはスクロールせずに表示される場所の読み込みから始めて、見えない部分は後回しにしてもらうように設定できれば解決に繋がります。
なるほど。でも、その設定難しそう…。
プラグインを使えば、簡単に設定することができます！
【Autoptimize】の導入・使い方
【Autoptimize】というプラグインは、CSS、JS、画像、Google フォントなどを最適化することでサイトの応答を高速化してくれるプラグインです。私はこちらを導入することで、改善に繋がりました。
導入方法・使い方を解説します！まずは必ずバックアップをとってから導入しましょう！
- 手順①ワードプレスでプラグインをインストール
「プラグイン」→「新規追加」→検索窓に「Autoptimize」と入力→「今すぐインストール」をクリック
- 手順②有効化
「有効化」をクリック
- 手順③設定画面へ
「設定」→「Autoptimize」をクリック
- 手順④「最適化」の項目にチェックを入れていく
「JavaScriptコードの最適化」に✔️
「CSSコードを最適化」に✔️
「HTMLコードを最適化」に✔️
ぶちその他の項目は触っていません。
- 手順⑤保存
「変更の保存とキャッシュの削除」をクリック
- 手順⑥完了！
自分のサイトのレイアウトなどが崩れていないかチェックしてください。もし崩れているようなら、最適化したチェックを外しながら様子をみてください。
お疲れさまでした！
まとめ
以上、「レンダリングを妨げるリソースの除外」の対処法をご紹介しました。
難しいコードをいじることなく、プラグインを使って簡単な設定をすることでサイトスピードの改善が見られました。
赤色を脱出！
このプラグインだけではなく、いくつかの方法を組み合わせてここまでサイトスピードを改善することに成功しました。もし「このプラグインだけではまだ足りない！」という方がいらっしゃいましたら、よろしければこちらの記事を参考にしてみてください。
このブログは、サーバーはConoHa WING、テーマはCocoonを使用しています。
最後までご覧いただき、ありがとうございました！
↓ブログ村に登録しています。ポチッと押して応援していただけると嬉しいです♪
コメント