ウェブ改善・解析25話 ページ表示速度はどこまで気にするべき?中小企業サイトの現実的な考え方

PageSpeed Insightsを参考にWebサイトの表示速度を確認するWeb担当者

Contents

Webサイトの改善について調べていると、「ページの表示速度を速くした方がよい」という話を目にすることがあります。

PageSpeed Insightsで自社サイトを調べてみたところ、思ったより点数が低く、

「このままではまずいのではないか」
「すぐに専門業者へ依頼して改善した方がよいのか」
「100点になるまで修正する必要があるのか」

と不安になった経験がある方もいるかもしれません。

確かに、ページの表示速度はWebサイトの使いやすさを左右する重要な要素です。

しかし、中小企業のWebサイト運用では、PageSpeed Insightsの点数だけを追いかけて、必要以上に時間や費用をかける必要はありません。

大切なのは、「何点だったか」だけを見るのではなく、実際にページを開いた人がストレスを感じる状態になっていないか、問い合わせや予約につながる重要なページに問題がないかを確認することです。

今回は、ページ表示速度をどこまで気にすればよいのか、中小企業サイトの実務に合わせて整理していきます。

表示速度は大切。ただし「速ければ速いほどよい」だけではない

ページを開いてもなかなか内容が表示されなければ、利用者にとって使いやすいサイトとは言えません。

特にスマートフォンでは、自宅や会社の高速なWi-Fi環境だけではなく、外出先のモバイル回線などさまざまな通信環境からアクセスされます。

トップページの大きな画像がいつまでも表示されない、ボタンを押しても反応が遅い、読み込み途中でレイアウトが動くといった状態であれば、改善を検討した方がよいでしょう。

一方で、

「PageSpeed Insightsで100点ではないから問題がある」

と単純に判断する必要もありません。

PageSpeed Insightsで表示されるパフォーマンススコアは、Lighthouseによる一定条件下での測定結果をもとに算出されています。また測定環境などの影響によって数値が変動することもあります。

そのため、中小企業のWeb担当者が最初に見るべきなのは、点数そのものよりも、

「実際にサイトを使ったときに明らかな遅さを感じるか」

という部分です。

PageSpeed Insightsの点数だけで判断しない

Webサイトの実際の利用状況と速度テスト結果を比較するイメージ

表示速度を確認するときによく使われるのが、GoogleのPageSpeed Insightsです。

URLを入力すると、スマートフォンとパソコンそれぞれについてページのパフォーマンスを確認でき、改善候補も表示されます。

非常に便利なツールですが、表示された一つの数字だけを見てサイト全体を評価しないことが重要です。

「実際のユーザー」と「テスト環境」のデータは意味が違う

PageSpeed Insightsでは、大きく分けて二つの視点からページを確認できます。

一つは、Chrome UX Report(CrUX)をもとにした実際のユーザー環境のデータです。

もう一つは、Lighthouseによる一定条件下でのテストデータです。

十分な実ユーザーデータがあるページでは、「実際のユーザーの環境でどの程度のパフォーマンスになっているか」を確認できます。一方、アクセス数などの条件によって実ユーザーデータが表示されないページでも、Lighthouseによる診断結果は確認できます。

つまり、表示されたパフォーマンスの数字はすべて同じ意味ではありません。

「点数が低かった」という結果だけを見るのではなく、

実際のユーザー環境で問題が出ているのか、それともテスト環境上で改善候補が見つかっているのか

を分けて考えると、必要以上に数字を恐れずに済みます。

100点を目標にしなくてもよい

PageSpeed Insightsを使い始めると、どうしてもスコアを上げること自体が目的になりがちです。

70点なら80点へ。
80点なら90点へ。
90点になったら100点へ。

しかし、Webサイトの本来の目的はPageSpeed Insightsで高得点を取ることではありません。

会社やサービスについて知ってもらい、問い合わせ、資料請求、予約、購入などにつなげることが目的です。

GoogleのLighthouseの資料でも、100点を取ることは非常に難しく、必ずしも期待されるものではないと説明されています。

たとえば、すでに十分な速度で表示されているページの点数を90点からさらに高くするために大きな費用をかけるよりも、

  • 問い合わせボタンを分かりやすくする
  • サービス説明を読みやすくする
  • フォームを入力しやすくする
  • スマートフォン表示を改善する

といった施策へ時間を使った方が、サイトの目的によっては成果につながりやすい場合があります。

表示速度改善も、Webサイト全体の改善施策の一つとして優先順位を考えることが重要です。

まずは自分のスマートフォンでページを開いてみる

専門的な測定を行う前におすすめしたいのが、実際のスマートフォンで自社サイトを確認することです。

できれば普段使用しているスマートフォンから、Wi-Fiだけでなくモバイル回線でも確認してみます。

トップページを開いたときに、

「何も表示されない時間が長い」

「大きな画像がなかなか出てこない」

「スクロールしようとしても動きが重い」

「ボタンを押した後の反応が遅い」

と感じるのであれば、改善を検討する価値があります。

逆にPageSpeed Insightsの点数が多少低くても、主要な内容がすぐに表示され、操作に大きなストレスがなければ、緊急性は比較的低いと判断できる場合もあります。

Web担当者だけでは判断しづらければ、社内の人に一度サイトを開いてもらうのも有効です。

普段そのサイトを管理していない人の方が、「ここは待たされる」「この画像が出るまで長い」といった違和感に気づきやすいことがあります。

サイト全体ではなく「重要なページ」から確認する

中小企業サイトの場合、すべてのページを同じ優先度で高速化する必要はありません。

たとえば100ページあるWebサイトで、すべてのページについて細かな速度改善を行おうとすると、大きな作業量になります。

そこでまず確認したいのが、成果につながる主要ページです。

代表的なのは、

トップページ、主力サービスページ、料金ページ、ランディングページ、問い合わせページ、予約ページなどです。

検索結果や広告、SNSなどから多くの利用者が最初に訪れるページがあれば、そのページも優先します。

特に、

「アクセスが多い」かつ「問い合わせにつながる」ページ

に明確な速度問題がある場合は、優先的に確認する価値があります。

反対に、ほとんどアクセスされない過去のお知らせページのスコアを細かく改善するより、利用者の多いサービスページを先に確認した方が効率的です。

まず直したい典型例1:大きすぎる画像

Webサイトに使用する大きな画像ファイルを適正化しているイメージ

中小企業サイトで比較的よく確認したいのが、画像です。

現在のスマートフォンやデジタルカメラで撮影した写真は高解像度になっているため、そのままWebサイトへアップロードすると非常に大きなファイルになることがあります。

Webページ上では横幅数百〜千ピクセル程度で表示しているのに、元画像は数千ピクセルあるというケースもあります。

特にトップページのメインビジュアルや施工事例、不動産物件、商品写真、スタッフ紹介などで大量の高解像度画像を使用しているサイトは注意が必要です。

まずは、

「必要以上に大きな画像を使っていないか」

を確認しましょう。

画像サイズの適正化や圧縮、適切な画像形式の利用などによって、見た目を大きく変えずにデータ量を抑えられる場合があります。

表示速度改善というと難しいプログラム修正を想像するかもしれませんが、画像を見直すだけでも改善につながるケースがあります。

まず直したい典型例2:トップページに動画や動きを詰め込みすぎている

動画やアニメーションを多く使用したWebページの負荷を確認するイメージ

会社のイメージを伝えるために、トップページへ動画やアニメーションを使用しているWebサイトも増えています。

動画や動きのある表現そのものが悪いわけではありません。

問題になるのは、

「必要性を考えず、大きなデータや複数の動きを読み込ませている状態」

です。

たとえばページを開いた直後に大容量の背景動画を読み込み、その下でも複数のスライダーやアニメーション、外部コンテンツを動かしていると、端末によっては表示や操作が重くなることがあります。

演出を減らせばよいという単純な話ではありません。

「この動画はサービス理解に必要なのか」

「このアニメーションがなくても内容は伝わるのか」

という視点で整理します。

見栄えのために追加した機能によって、利用者が本来見てほしい内容まで待たされているのであれば、見直す価値があります。

まず直したい典型例3:使っていない機能や外部サービスが増えている

Webサイトを長期間運用していると、少しずつ機能が増えていきます。

アクセス解析、広告計測、チャット、SNS表示、地図、予約システム、Webフォント、各種マーケティングツールなど、外部サービスと連携することもあります。

WordPressであれば、プラグインが増えているケースもあるでしょう。

もちろん、必要な機能を表示速度だけを理由に削除する必要はありません。

ただし、

「以前使っていたが現在は使っていない」

「何のために入れたのか分からない」

という機能が残っている場合は、一度整理してみる価値があります。

不要な機能を減らすことは、表示速度だけでなく、管理やセキュリティの面からもWebサイトを整理するきっかけになります。

ただし、WordPressプラグインなどを自己判断で削除するとサイトの機能や表示に影響する場合があります。役割が分からないものは、削除前に制作会社や管理担当者へ確認しましょう。

まず直したい典型例4:最初に見たい内容がなかなか表示されない

Webページ上部の主要コンテンツが表示されるまでの速度を確認するイメージ

ページ全体が完全に読み込み終わる時間だけでなく、利用者が最初に必要とする内容がいつ表示されるかも重要です。

たとえば会社のサービスページを開いたとき、

大きなメイン画像が長時間表示されず、会社名やサービス内容も見えない状態

になっていれば、利用者は「ページが壊れているのかな」と感じるかもしれません。

一方で、ページ下部にある画像の読み込みが多少遅くても、上部のサービス名や説明、問い合わせへの導線がすぐ確認できれば、利用者への影響は比較的小さい場合があります。

つまり、

ページのすべてを一律に速くすることだけでなく、「最初に必要な情報を早く見せる」ことも大切です。

この考え方を持っておくと、改善の優先順位を決めやすくなります。

Core Web Vitalsは「利用者の体験を見る指標」と考える

PageSpeed Insightsを確認すると、「Core Web Vitals」という言葉が出てくることがあります。

専門用語なので難しく感じますが、中小企業のWeb担当者が最初から細かな仕組みまで理解する必要はありません。

現在のCore Web Vitalsでは、大きく三つの観点からユーザー体験を確認します。

LCPは主要なコンテンツが表示されるまでの速さ、INPはクリックやタップなどの操作に対する反応、CLSは読み込み中にレイアウトがどの程度動くかを見る指標です。

良好とされる目安は、75パーセンタイルでLCPが2.5秒以内、INPが200ミリ秒以下、CLSが0.1以下です。

ただし、数字そのものを暗記する必要はありません。

実務では、

「主要な内容がなかなか出てこない」
「ボタンを押しても反応しない」
「読んでいる途中でレイアウトが動く」

といった利用者側の問題を数字で確認する仕組みだと考えると分かりやすいでしょう。

「赤だから全部直す」ではなく改善内容を見る

PageSpeed Insightsでは、改善できそうなポイントが複数表示されることがあります。

ここで注意したいのが、表示された項目を上からすべて対応しようとしないことです。

改善項目の中には、比較的簡単に対応できるものもあれば、Webサイトの構造や使用しているシステムに関係し、大きな改修が必要なものもあります。

たとえば、

画像を適正化するだけで大きく改善できるケースと、使用しているテーマやJavaScript、外部サービスなどを含めて検討しなければならないケースでは、必要な作業が大きく異なります。

そのため、

効果の大きさ × 対応コスト × ページの重要度

で優先順位を付けると実務的です。

重要なサービスページで大きな画像が原因になっているのであれば優先度は高くなります。

一方、利用者への影響がほとんどなく、修正に大きな開発費が必要な項目であれば、すぐに対応しない判断もあり得ます。

速度改善でサイトを壊してしまわないことも大切

表示速度を改善するためのWordPressプラグインや設定も数多くあります。

キャッシュ、JavaScriptやCSSの最適化、画像の遅延読み込みなど、設定によって改善できるものもあります。

ただし、設定を変更した結果、

メニューが開かなくなった、フォームが動かなくなった、画像が表示されなくなった、レイアウトが崩れた

というトラブルが起こる可能性もあります。

特にすでに問い合わせを受け付けている稼働中のWebサイトでは、数ポイントのスコア改善よりも、主要機能が正常に動くことの方が重要です。

速度改善を行った後は、必ずスマートフォンとパソコンの両方で主要ページを確認し、問い合わせフォームなども実際にテストしましょう。

中小企業サイトなら、この順番で確認すると分かりやすい

スマートフォンとパソコンを使って主要Webページの表示速度を確認する様子

表示速度について何から始めればよいか分からない場合は、次の順番で確認すると整理しやすくなります。

  1. 自分のスマートフォンでトップページを開く
  2. 主力サービスページや料金ページを確認する
  3. 問い合わせページまで実際に操作する
  4. 明らかに待たされる場所がないか確認する
  5. PageSpeed Insightsで主要ページを調べる
  6. 実ユーザーデータがあれば確認する
  7. 改善候補の中から画像など対応しやすいものを確認する
  8. 改善後にもう一度実機で操作する

この順番なら、「とにかく点数を上げなければ」という状態になりにくくなります。

ツールは問題を見つけるために使い、最終的には実際の利用者が使いやすくなったかどうかを確認することが重要です。

まとめ:点数ではなく「利用者を待たせていないか」を見る

ページ表示速度は、中小企業サイトでも無視してよいものではありません。

特にスマートフォンでページがなかなか表示されない、操作しても反応しないといった状態であれば、改善を検討する価値があります。

ただし、PageSpeed Insightsの点数だけを見て、

「100点にしなければならない」

と考える必要もありません。

まず確認したいのは、

利用者が実際に使ったときにストレスを感じる状態になっていないか

という点です。

そのうえで、トップページ、主力サービスページ、料金ページ、問い合わせページなど、成果につながりやすいページから優先して確認します。

大きすぎる画像や不要になった機能など、比較的分かりやすいところから改善できることもあります。

Webサイト改善では、表示速度だけを単独で考えるのではなく、内容の分かりやすさ、スマートフォンでの操作性、問い合わせ導線などとのバランスを見ることが大切です。

PageSpeed Insightsは「点数を競うツール」ではなく、利用者にとって使いやすいサイトにするための問題発見ツールとして活用していきましょう。

Share the Post: