「レンダリングを妨げるリソースの除外」という項目はプラグイン 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集客の立案やコンサルティングを担当しています。集客問題を解決できるノウハウをわかりやすくご紹介いたします!

    関連記事

    Instagram位置情報設定代行サービス 場所を追加
    Instagram位置情報設定方法 説明書
    最近の記事 おすすめ記事
    1. 飲食店がInstagramでのリーチ数を爆上げする裏技

    2. 集客に悩む地方ビジネスオーナーのための効果的なWeb集客完全ガイド

    3. デジタルマーケティングとは?デジタル時代の勝者になるためのデジタルマーケティング完全ガイド

    4. Instagram集客の費用はいくら?自社でできる費用対効果の高い方法とは

    5. 来店者が減少し売上が落ち込んでいる時にデジタルマーケティングを利用する具体策

    6. 定期購入者を増やすためのメールマガジン活用法

    7. イベントの告知で集客力が見込めるInstagramの活用法

    8. 地域の顧客を呼び込むための実店舗とInstagramとの連携術

    9. 集客上手な競合店のInstagramを分析し自社の集客に生かす方法

    10. ホームぺージのアクセスが思うように増えない時の5つの対策

    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