SEO対策やコンバージョンにつながる、PageSpeed Insightsの改善方法を徹底解説

「最近、サイトの表示がなんか重い気がする」
「せっかく作ったサイトなのに、なかなか上位表示されない」

なんてお悩み、抱えていませんか？
そんな方におすすめしたい最強のツールが「PageSpeed Insights」です！

PageSpeed Insightsは、Googleが提供している無料ツールで誰でも簡単に使えるうえ、サイトの表示速度に関するお悩みを解決してくれるんです！

この記事では、PageSpeed Insightsの使い方や見かただけではなく、Web制作会社であるネオインデックスがどのようにサイトスピードを改善しているかという現場のリアルな情報まで惜しみなくお伝えするので、ぜひ最後まで読んでみてください。

そもそも、PageSpeed Insightsってなに？

一言で言うと、「Googleが公式に提供している、ウェブサイトの表示速度とユーザー体験を評価してくれる無料ツール」です。もっとざっくり言うと、「Googleがあなたのサイトを隅々までチェックして、どこが良くてどこがダメなのか、どうすればもっと良くなるのかを、めちゃくちゃ分かりやすく成績表みたいな感じで出してくれる」といったイメージですね。

これを使うことで、なぜサイトの表示速度が遅くなっているのか、どこを改善すればもっとユーザーの滞在時間を延ばせるのかなどが一目で分かり、最小限の労力でホームページをより良いものに改善できます！

PageSpeed Insightsの使い方を徹底解説！

それでは早速、PageSpeed Insightsの具体的な使い方に入っていきましょう！難しいことは何もありません。本当にシンプルですのでご安心を。

基本的な使い方

1.PageSpeed Insightsにアクセス 

Googleで「PageSpeed Insights」と検索するか、以下のURLに直接アクセスしてください。 

https://pagespeed.web.dev/ 

2.分析したいURLを入力 

トップページに大きな入力欄がありますので、分析したいウェブサイトのURLを入力します。サイトトップに限らずページごとに分析ができるので、分析したいページのURL（”/”以下を含む）を入力してください。

3.「分析」ボタンをクリック

URLを入力したら、その右隣にある「分析」ボタンをクリックします。

手順は、たったこれだけ！数秒から数十秒待つと、分析結果が表示されます。こんなに簡単なら、使わない手はないですよね。

評価項目の確認方法

分析結果が表示されたら、各項目を確認していきます。ULRの入力欄の下に、「携帯電話」と「デスクトップ」を選択できるところがあるので、調べたい方のデバイスをクリックしてください。

1.実際のユーザーの環境で評価する（フィールドデータ）

まず、ページ上部に記載されているのが、「実際のユーザーの環境で評価する」と書かれた表示速度に関する項目の分析結果です。それぞれの項目においてポイントが異なるので、分かりやすくご紹介しますね！

重要なのはこの3つの指標ですが、それに加えて以下の2つの指標もクリアできると、「合格」と判断されます！

2.パフォーマンスの問題を診断する（ラボデータ）

上記のフィールドデータが「実際のユーザーはどのように感じているか」が分かるデータだったのに対し、ラボデータは「パフォーマンスの問題がどこにあるか」を示しています。問題点と同時に、具体的な改善案も提案してくれる、頼れる相棒的な存在です。

ここでは、4つのカテゴリに分けて診断がされます。

4つのカテゴリ

• パフォーマンス

ページの読み込み速度や応答性など、ユーザー体験に直結する技術的な速度指標を評価します。特に、Core Web Vitals（先ほど紹介した、LCP・INP・CLSのことです！）に関することが、このカテゴリにおいて重要な要素です。

• ユーザー補助

さまざまな身体的条件を持つユーザー（視覚障害、聴覚障害、運動機能障害など）が、ウェブサイトを問題なく利用できるかを評価します。例えば、画像の代替テキスト（alt属性）や色のコントラスト、キーボード操作の可否などが含まれます。

• おすすめの方法

ウェブ開発において、適切な方法が採用されているかを評価します。例えば、HTTPSの使用、安全でないライブラリの回避、ブラウザの非推奨APIの回避などが含まれます。

• SEO

ウェブサイトが、検索エンジンに適切に評価されるための基本的な要素が満たされているかが評価されています。例えば、モバイルフレンドリーな設計、meta tagの適切な設定、robots.txtファイルの有無などが含まれます。

上記4つのカテゴリがどれくらい満たされているか、数値と一緒に色別で評価が一目で分かるように提示されています。それぞれの色が何を示しているのかお伝えしますね。

 これらのスコアや指標の他に、PageSpeed Insightsは「改善できる項目」として、具体的なアドバイスもくれます。「画像を最適化しましょう」「JavaScriptの実行時間を短縮しましょう」など、初心者でも分かりやすいように、どうすればスコアが上がるのかを教えてくれるんです。これ、本当にありがたい機能なんですよね。

これらの項目を上から順に見ていくことで、あなたのサイトの「健康状態」と「どこをどう治療すればもっと良くなるか」が丸わかりになります。最初は専門用語に戸惑うかもしれませんが、何度か触っているうちに慣れてくるので、ぜひ活用してみてください！

表示速度改善のための具体的な方法

さて、PageSpeed Insightsで診断結果が出たとして、具体的にどうやって改善していけばいいのか？ここが一番知りたいところですよね！

ネオインデックスでは、お客様のサイトを高速化するために、さまざまな手法を組み合わせています。ここでは、その中でも特に効果が高く、私たちが実際に現場で実践している具体的な改善方法を、特別に解説していきます。

現場のリアルな知見を、ぜひ参考にしてください！

1.HTML/CSS/Java Scriptの調整

まずは、何よりここの改善を優先して行っています！ウェブサイトを構成するHTML、CSS、JavaScriptのファイルも、余計なスペースや改行、コメントなどが含まれていると、その分ファイルサイズが大きくなり、読み込みに時間がかかるからです。

実際に、制作したサイトのPageSpeed Insightsの点数がよくなかったので、3行くらいしか書いていないJavaScriptのファイルを消したところ、改善された経験があるんです！

これほど小さなサイズのファイルでも、サイトの表示速度に影響が出るなんて驚きですよね。

なので、無駄な記述を減らして、できる限り記述量を少なくすることを心がけています。そうすることで、「レイアウトシフト」も改善されて、Core Web Vitalsの評価も改善されます。現場感覚でも、レイアウトシフトまで対応できている制作会社は限られているんじゃないかな？と思いますが、Sクラスの高品質なホームページを制作しているネオインデックスではここまで徹底しています。

ただし、このレイアウトシフトは少々厄介で、サイトの印象に大きく影響を与えるファーストビューにおいて、凝った作りにした際に指摘されやすいという傾向があります。

サイトの表示速度ももちろん大切ですが、それを重視するあまり納得のいくデザインや設計が実現できないとなると本末転倒なので、そのバランス感が悩ましいところです;。

2. 画像の最適化

PageSpeed Insightsで真っ先に指摘されることが多いのが、この「画像」の問題です。ウェブページの容量の半分以上を画像が占めることも珍しくありません。画像が重ければ重いほど、ページの読み込みは遅くなります。

ネオインデックスでは、以下の3つのステップで画像の最適化を行っています。

①画像の圧縮（容量削減）

まず基本中の基本ですが、画像の用途に応じて適切なフォーマットを選ぶようにしています。

②画像のサイズ調整（リサイズ） 

「元の画像が大きすぎる」という指摘もよく見かけます。例えば、幅3000pxの画像を、幅500pxしか表示しない場所で使っていたら、無駄に重いデータを読み込んでいることになります。

そこで、実際にウェブサイトで表示されるサイズに合わせて、画像自体の寸法（幅と高さ）を小さくします。CSSで見た目だけ小さくしても、読み込むデータの容量は変わらないので、ちゃんと画像ファイルそのものをリサイズしましょう。

さらに、ネオインデックスではスマホ、タブレット、PCなど、デバイスの画面サイズに応じて最適なサイズの画像を出し分ける「レスポンシブイメージ」という技術も使用しています。HTMLのsrcset属性や要素を使うことで実現できるので、ぜひ試してみてください！

③遅延読み込み（Lazy Load）の導入 

遅延読み込み（Lazy Load）とは、ユーザーが最初にページを開いたときに、画面に表示されている部分（ファーストビュー）の画像だけを読み込み、スクロールして表示される部分の画像は、その時になって初めて読み込むという技術です。 これにより、最初のページの読み込み速度が劇的に向上します。

JavaScriptを使って実装することができますし、WordPressならプラグインで簡単に導入できます。ネオインデックスでは、特に画像が多いサイトでこの遅延読み込みを実装しています。これだけでスコアがグンと上がることも珍しくありません！

3. CMSはWordpressを使わず、自社開発する

これに関しては、個人で対応するのは難しいかもしれませんが、ネオインデックスの表示速度対策の一環としてお伝えさせてください！

Wordpressの場合、プラグインを多用していたり高機能かつデザイン性の高いテーマを使用していたりすると、読み込むファイルが多くなってしまうため、表示速度が遅くなってしまいます。

 一方、自社開発のCMSの場合、必要な機能のみを組み込んで、余計なコードや機能を省くことができるので、Wordpressよりも表示速度を早くできる可能性が高くなります。

ネオインデックスで開発しているCMSの機能は多岐にわたり、複雑なシステムを用いているものもありますが、無駄を徹底的に省くことでサイトの表示スピードには影響のない状態を維持しています！

PageSpeed Insightsを活用すべき3つの理由

「別にPageSpeed Insights使わなくても、見た目が良ければいいんじゃないの？」

「他のスピードチェッカーでも同じでは？」

そう思う方もいるかもしれません。ですが、PageSpeed Insightsだからこそ享受できるメリットがあるんです！

1．Googleの評価基準に倣っているから

Googleは、ウェブサイトのランキングを決定する際に、ユーザー体験を非常に重視しています。そして、そのユーザー体験を測る重要な指標の一つが、まさにPageSpeed Insightsのスコア、特にCore Web Vitals（LCP、INP、CLS）なんです。

つまり、PageSpeed Insightsのスコアが悪いということは、Googleから「このサイトはユーザー体験が悪いな;」と判断され、検索順位で不利になる可能性があるということです。Googleに評価されないと、せっかく良いコンテンツを作っても、多くの人に見てもらう機会を失ってしまいます。

2．ユーザーの離脱を防ぐから

サイトがなかなか表示されず、すぐに閉じてしまったり、イライラしてしまったりという経験は恐らく皆さんあるのではないでしょうか？情報が秒で手に入る時代だからこそ、電波状況が悪い場所でもサクサク見れるサイトじゃないと、ユーザーはすぐに離脱してしまいます。

PageSpeed Insightsは、改善点を細かく分析＆提案してくれるので、それに応じて修正すれば、ユーザーが快適にサイトを閲覧できるようになり、結果的に離脱率の低下を防ぐことができます。

3．具体的な改善策が手に入るから

PageSpeed Insightsは、ただ原因を分析するだけにとどまらず、「ここをこうすれば速くなるよ」と具体的なアドバイスをくれます。そのため、専門知識のない人でも改善ポイントがわかり、表示スピードを常に最適な状態に維持することができるのは、PageSpeed Insightsならではのメリットです。

私たちWeb制作のプロでも、「え、こんな改善策あったんだ！」とハッとさせられることもあるんですよ。いわば、無料でプロのコンサルティングが受けられるようなものなんです。

つまりまとめると、PageSpeed InsightsはGoogleに評価され、ユーザーに愛され、そして結果的にビジネスを成長させるために、絶対に活用すべきツールなんです。使わない手はありませんよね。

サイトの表示速度が重要な理由

「PageSpeed Insightsの良さは分かったけど、ぶっちゃけ表示スピードってそこまで重要？」と思った方に向けて、ここではサイトの表示スピードの重要性についてご説明します。

せっかく頑張って集客してサイトに誘導しても、表示が遅いせいで台無しになることって、実はよくあるんですよ。

ユーザー体験（UX）への影響

クリックしたのにページがなかなか表示されず、結局イライラして閉じてしまったこと。皆さんも経験したことがあるのではないでしょうか？まさにこれが、表示速度がユーザー体験に与える悪影響の典型例です。

Amazonの調査によると、読み込み速度が0.1秒遅くなるごとに、コンバージョン率が1%低下すると言われています。たった0.1秒でも、これだけ大きな影響があるのは恐ろしいですよね。特に現代人は、あらゆる情報に秒速でアクセスできるのが当たり前だと思っているので、少しでも遅いとすぐに他のサイトに移ってしまうことは想像に難くないですよね。

また、表示速度が遅いとユーザーにネガティブな印象を与えてしまう可能性もあります。「ちゃんと管理されてないサイトなのかな？」「あのサイトは遅いからもう使いたくないな;」などなど。

このように、表示速度はユーザーの満足度に直結し、それが最終的にサイトの成果に大きな影響を与えるんです。

SEOランキングへの影響

先ほども少し触れましたが、Googleは公式に「サイトの表示速度を、検索ランキング要因の一つとして利用している」と明言しています。特に、2021年6月から導入されたCore Web Vitalsは、その重要性が増しているのが現状です。

とはいえ、Core Web Vitalsはあくまで「ランキング要因の一つ」です。一番大事なのは、ユーザーの検索意図に合致した質の高いコンテンツを提供すること。これがあってこその、表示速度改善です。

でも、考えてみてください。同じくらい質の高いコンテンツを提供している2つのサイトがあったとして、片方は爆速、もう片方は激遅だったら？ Googleは間違いなく、ユーザー体験の良い爆速サイトを優先しますよね。つまり、表示速度はSEOにおける「タイブレーク（同点決勝）」の役割を果たすと考えると分かりやすいかもしれません。他の要素で競合と肩を並べているなら、表示速度が勝敗を分ける決定打になるということです。

上位表示されていれば、より多くの人にサイトを見てもらうことができ、結果としてアクセス数UP、ひいてはビジネスチャンスの拡大に繋がります。

コンバージョン率への影響

サイト運営の最大の目的は「成果を出すこと」ですよね。商品の購入、サービスの申し込み、資料請求、お問い合わせ、広告クリックこれらを総称して「コンバージョン」と呼びます。

表示速度が遅いと、このコンバージョン率が目に見えて下がります。

例えば、ECサイトで商品を選んでカートに入れたのに、購入手続きのページがなかなか表示されず、途中で諦めてしまった、通称「カゴ落ち」と呼ばれる現象につながったり、お問い合わせフォームや資料請求フォームなどの入力途中で離脱してしまったり、

このように、サイトの表示速度は、ビジネスの売上や成長に直結する非常に重要な要素なんです。

だからこそ私たち制作会社の人間は、お客様のサイトを制作する際、この表示速度にも最新の注意を払っています。だって、せっかく作るなら、最高の成果を出してほしいですからね！

PageSpeed Insightsを味方につけて、サイトを次のステージへ！

以上、PageSpeed Insightsの基本的な使い方から、サイトの表示スピードの具体的な改善方法までをご紹介しました！
これらの改善策は、一つ一つは地味に見えるかもしれません。しかし、これらを組み合わせることで、あなたのサイトの表示速度は劇的に向上し、PageSpeed Insightsのスコアも大幅にアップするはずです。
サイトの表示速度は、一度改善したら終わりではありません。コンテンツが増えたり、新しい機能を追加したりするたびに、また遅くなる可能性もゼロではありません。だからこそ、継続的なチェックと改善が重要になります。
PageSpeed Insightsを味方につけて、あなたのサイトを「速くて、使いやすくて、Googleにもユーザーにも愛されるサイト」へと進化させましょう！

もしも、
「サイトスピードがなかなか改善されない」
「そもそもホームページが古いから、丸ごと一新したい！」
という方は、ぜひネオインデックスにご相談ください！
これまで3,000以上ものホームページを制作してきた豊富な実績と高い専門性をフル活用して、最高のホームページ制作をサポートいたします。

ここまで読んでくださり、ありがとうございました。
ではまた！