「レンダリングを妨げるリソースの除外」という項目はプラグイン Autoptimize  を使って簡単に解決出来ます

やって来ました。

PageSpeed Insights

待望のシリーズ第二弾!!

PageSpeed Insights

を利用した時に出てくる改善出来る項目の対応方法について教えちゃいますシリーズ。

今回はレンダリングを妨げるリソースの除外の方法についてです。

▼前回の記事

「レンダリングを妨げるリソースの除外」とは?

レンダリングとは?

コードやプログラムなどの情報を人が見やすいように表現・表示させること。

リソースとは?

ある操作の実行に必要なシステムや要素などのこと。

まとめると

以上をふまえて簡単に説明すると・・・・

「ホームぺージを表示させる時に、コードやプログラムの読み込みの順番がうまく出来てなくて表示するのが遅くなっている」

という状態です。

レンダリングを妨げるリソースを除外する方法

ホームぺージによって原因や状況は違いますが、このケースで指摘されているのは下記のものです。

  • CSS
  • JavaScript
  • Googleフォント
  • もちろん、一つ一つ問題点を探して手動で一つ一つ対応する事も出来ますが、そんな面倒臭い事をせずにAutoptimize というプラグインを利用すればすぐに問題解決が出来ます。

    それでは早速にインストールしてみましょう

    Autoptimizeをインストールして有効化

    Autoptimizeをインストールして有効化

    【プラグインを追加】の画面で Autoptimize と入力してプラグインを探します。プラグインが表示されたら、【今すぐインストール】をクリックしてください。

    インストールが出来たら【プラグインを追加】をクリックしてください。

    続いて【有効化】のボタンを押してエラーが発生しなければ、初期設定は完了です。

    Autoptimizeを設定

    Autoptimizeを設定

    サイドナビの【設定】タブから【Autoptimize】を選択してください。

    【JS、CSS&HTML】タブを選択してください。

    【JavaScript コードの最適化】にチェックを入れてください。

    CSS オプション

    Autoptimize

    【CSS コードを最適化】にチェックを入れてください。

    HTML オプション

    【HTML コードを最適化】にチェックを入れてください。

    最後に【変更と保存とキャッシュの削除】を押してください。

    【追加】タブを設定

    Googleフォントを使っていない人は対応しなくてもOkです。
    Googleフォントを使っている人も、スピードチェックして問題ないのであれば対応しなくてもOkです。

    【変更を保存】を押して反映してください。

    これですべて完了です。

    スピードが改善されたか確認

    PageSpeed Insightに戻って、再度URLを入れてスピードが改善されたか確認します。

    そうした時に、エラーはまだ出ているケースがあると思います。
    今改善したばかりの「レンダリングを妨げるリソースの除外」が全て対応出来ていないケースもありますが、PageSpeed Insightsはネットワークやサーバー・クライアントの負荷に応じて、分析結果が変動しますので、1回の計測だけでパフォーマンスを正しく評価することはできません。正しく結果を評価するには、数日にわたって何回か計測を行い、そこで頻発するエラーがあれば対応して行くようしてください。

    まとめ

    今回は、設定も簡単で、あまり考えるところはないのですが、プラグイン導入後のスピードチェックとサイトチェックは確実に行ってください。
    気が付けば、表示が崩れているという事も珍しくありませんので。

    もし上記のような不具合が生じた場合は、Autoptimize自体を削除して対応してください。
    それでも、改善が出来ないという場合にはお気軽にエクセレントにご相談ください。

    ▼該当サービス
    ホームぺージレスキューサービス

    ホームへージ制作サービス

    メールでのお問い合わせ

    お問い合わせはこちら
    メールフォームの内容をご確認頂きまして送信してください。

    LINEでのお問い合わせ

    お友達登録はこちら
    お友達登録をして頂いて
    お問合せ内容をトーク画面から送信してください。

    SEO対策が得意なホームぺージ制作会社エクセレント

    筒井 章年

    Web制作歴25年。1,000サイト以上のWeb集客のサポート経験を持つ。 その経験で得た知識や経験でWeb集客の立案やコンサルティングを担当しています。集客問題を解決できるノウハウをわかりやすくご紹介いたします!

    関連記事

    無料相談行っています!!お気軽にご利用ください。
    最近の記事 おすすめ記事
    1. Instagram(インスタグラム)の位置情報に自分のお店を載せる方法

    2. Instagramでバズる方法とは? ハッシュタグは重要ではありません。アルゴリズムを解析した真実。【運用者必見です】

    3. Instagram(インスタグラム)のアルゴリズムについての記事をまとめました

    4. バズる投稿をするにはInstagram(インスタグラム)のアルゴリズムを攻略する必要があります。【運用者必見】

    5. Instagram(インスタグラム)の魅力的なプロフィールの書き方を解説します

    6. Instagram(インスタグラム)まとめ記事 ハッシュタグについてまとめました

    7. Instagram(インスタグラム)まとめ記事 プロフィールについて

    8. Instagram(インスタグラム)とは?いまさら聞けないInstagramの基礎知識

    9. Instagram(インスタグラム)まとめ記事 フォロワーを増やす方法について

    10. Instagramで攻略すべきは「発見タブ」。その発見タブについて解説します。

    1. Instagram(インスタグラム)のリール動画の音源を保存して活用する方法

    2. Instagramのリール動画やTicktockやYoutubeのショート動画にたくさんの会社が力を入れている理由

    3. Instagram(インスタグラム)で集客を始める時に知っておくべき集客のコツ12選

    4. 初心者が知っておくべき基本的なSEO対策とは?上位表示に必要なやり方・方法について解説します。

    5. 検索意図とは?SEO対策で重要な調べ方と考え方を解説します。

    6. ホームページが検索結果に表示されない時の原因と対処方法を徹底解説!

    7. 【2022年版】Web集客の種類とその方法を集客にお困りのあなたに分かりやすく解説します

    8. SEO対策の内製化を積極的に取組んでいる中小企業の多くは自社でするSEO対策に迷走している。

    9. 売れているホームぺージ = 集客型ホームぺージに共通しているぺージ構成の法則

    10. これを見れば完璧!Google Maps API 取得方法をご紹介します。

    資料を無料ダウンロード

    弊社の会社概要と、ご提供サービスのご紹介資料です。
    ご覧いただき、お気軽にお問い合わせください。

    TOP