ホームページの表示速度を改善する方法|原因の調べ方と対策7選

ホームページの表示速度を改善する方法|原因の調べ方と対策7選

「自社のホームページ、スマートフォンで開くと表示が遅い気がする」「お客様から“ページがなかなか開かない”と言われた」――そんな経験はありませんか。表示に時間がかかるページは、内容を読んでもらう前に閉じられてしまうことがあり、せっかくの集客の機会を逃す原因になります。

とはいえ、表示速度の改善は専門的に見えて、どこから手を付ければよいか分かりにくいものです。この記事では、ホームページの表示速度が大切な理由、Googleが示している目安の数値、無料ツールでの調べ方、遅くなる主な原因と具体的な改善策を、専門知識がない担当者の方にも分かるように順を追って解説します。

ホームページの表示速度が大切な理由

表示速度が大切な理由は、大きく分けて「ユーザーの使いやすさ」と「検索エンジンからの評価」の2つです。

ユーザーが離れる原因になる

中小企業や店舗のホームページは、外出先からスマートフォンで見られることが多くあります。電波状況がよくない場所では、画像の多いページほど読み込みに時間がかかります。白い画面のまま待たされると、ユーザーは戻るボタンを押して別のサイトへ移ってしまいがちです。お問い合わせや予約につながるページほど、表示のもたつきは機会損失に直結します。

Google検索の評価要素のひとつになっている

Googleは検索セントラルの公式ドキュメントで、ランキングシステムにCore Web Vitals(コアウェブバイタル)を使用していると説明しています。ただし、検索結果で最も重視されるのはあくまで「検索した人の役に立つ内容かどうか」です。Googleも、良いスコアを得ても上位表示が保証されるわけではないとしています。表示速度は「内容が同じくらい役に立つページの中で差がつく要素」と考え、内容の充実とあわせて取り組むのが現実的です。

表示速度の目安となるCore Web Vitalsとは

Core Web Vitalsとは、Googleが定めた「ページの使いやすさ」を測るための3つの指標です。web.devで公開されている「良好」の目安は次のとおりです。

  • LCP(Largest Contentful Paint):ページ内で一番大きな画像や文章のかたまりが表示されるまでの時間。2.5秒以内が目安です。
  • INP(Interaction to Next Paint):ボタンを押す・メニューを開くなどの操作をしてから、画面が反応するまでの速さ。200ミリ秒以下が目安です。2024年に、以前の指標FIDに代わって採用されました。
  • CLS(Cumulative Layout Shift):読み込み中にレイアウトがずれる度合い。0.1以下が目安です。押そうとしたボタンが急に動いて別の場所を押してしまう、といった現象を数値化したものです。

これらは、実際にサイトを訪れたユーザーの計測データをモバイルとパソコンに分けて集計し、75パーセンタイル(訪問の4分の3が収まる値)で評価します。つまり「一部の速い環境」ではなく、「多くのユーザーがストレスなく使えるか」が問われていると言えます。

自社サイトの表示速度を調べる方法

まずは現状を把握しましょう。Googleが提供する無料ツールで確認できます。

PageSpeed Insights

調べたいページのURLを入力するだけで、表示速度の診断結果と改善のヒントが表示されます。結果には、実際のユーザーの計測にもとづくフィールドデータと、決められた条件で機械的に計測したラボデータの2種類があります。アクセス数が少ないサイトではフィールドデータが表示されないこともあるため、その場合はラボデータの数値と「改善できる項目」を参考にしましょう。

Google Search Console

Search Console(サーチコンソール)は、Google検索での自社サイトの状況を確認できる無料ツールです。「ウェブに関する主な指標」のレポートでは、サイト内のどのページで問題が起きているかをまとめて確認できます。ページ単位ではなく、サイト全体の傾向をつかむのに便利です。

測るときのポイント

  • トップページだけでなく、お問い合わせページやサービス紹介ページなど成果に関わるページも確認する
  • スマートフォンの結果を優先して確認する
  • ラボデータの数値は計測のたびに多少ぶれるため、一度の結果で一喜一憂しない

表示速度が遅くなる主な原因

表示が遅いサイトには、よくある原因がいくつかあります。

  • 画像のファイルサイズが大きい:デジタルカメラやスマートフォンで撮った写真を、そのままのサイズで掲載しているケースです。最も多い原因のひとつです。
  • プラグインや外部ツールの読み込みが多い:WordPressのプラグイン、SNSの埋め込み、チャットツール、計測タグなどが増えるほど、読み込む処理が重くなります。
  • 動画やスライダーをファーストビューに置いている:ファーストビューとは、ページを開いて最初に見える範囲のことです。ここに重い要素があるとLCPが遅くなりやすくなります。
  • サーバーの性能や設定が合っていない:サーバーの応答が遅いと、どれだけページを軽くしても表示の開始が遅れます。
  • 古いテーマやシステムを使い続けている:長年更新していないサイトでは、現在の環境に最適化されていない仕組みが残っていることがあります。

今日からできる表示速度の改善策7選

ここでは、効果が出やすく取り組みやすい順に改善策を紹介します。

画像を圧縮・リサイズする

掲載する画像は、表示される大きさに合わせて縦横のサイズを縮小し、圧縮してから使いましょう。横幅が数千ピクセルある写真を、数百ピクセルの枠に表示しているケースはよくあります。

次世代画像形式(WebPなど)を使う

WebP(ウェッピー)やAVIFは、JPEGやPNGより軽くなりやすい画像形式です。WordPressでは、変換に対応したプラグインやサーバーの機能を使う方法もあります。

画像の遅延読み込みを設定する

遅延読み込み(レイジーロード)とは、画面に表示されるタイミングで画像を読み込む仕組みです。ページ下部の画像を後回しにできるため、最初の表示が軽くなります。ただし、ファーストビューのメイン画像には設定しないほうがよい点に注意しましょう。

不要なプラグインや外部タグを整理する

使っていないプラグイン、終了したキャンペーンの計測タグ、効果の薄いSNS埋め込みなどを見直します。削除する前には、サイトの機能に影響がないかバックアップを取ったうえで確認しましょう。

キャッシュを活用する

キャッシュとは、一度作ったページのデータを保存しておき、次回以降すばやく表示する仕組みです。サーバーの機能やキャッシュ用のプラグインで設定できます。

画像や埋め込み要素にサイズを指定する

画像や動画に幅と高さをあらかじめ指定しておくと、読み込み中にレイアウトがずれにくくなり、CLSの改善につながります。

サーバーやシステムを見直す

上記を実施しても改善しない場合は、サーバーのプランやPHPなどのシステムのバージョンが古くないかを確認します。契約しているサーバー会社の管理画面で確認できることが多いです。

制作会社に相談したほうがよいケース

画像の圧縮やプラグインの整理は社内でも取り組めますが、次のような場合は専門家に相談するのがおすすめです。

  • テーマ(デザインの土台)自体が重く、部分的な修正では改善が難しい
  • どのプラグインを止めてよいか判断できない
  • 改善策を試したところ、表示崩れや不具合が起きた
  • デザインや導線もあわせて見直したい

表示速度はサイトの設計段階から大きく左右されます。リニューアルを検討している場合は、新しいサイトの要件に「表示速度の目標」を入れておくと、公開後に慌てずに済みます。年度末に向けて予算や計画を立てる時期でもあるため、今のうちに現状を測って課題を整理しておくとスムーズです。

まとめ

  • 表示速度は、ユーザーの離脱を防ぎ、検索評価の面でも意識したい要素
  • Core Web Vitalsの目安はLCP 2.5秒以内・INP 200ミリ秒以下・CLS 0.1以下
  • PageSpeed InsightsとSearch Consoleで、まずは無料で現状を把握する
  • 遅くなる原因で特に多いのは、画像の重さとプラグイン・外部タグの多さ
  • 画像の圧縮・WebP化・遅延読み込み・キャッシュ活用は効果が出やすい
  • テーマやサーバーに原因がある場合は、制作会社への相談も検討する

お問い合わせ

CONTACT

LYNQでは、ホームページの表示速度の診断・改善から、使いやすさと集客を意識したサイトのリニューアルまでご相談いただけます。「何が原因で遅いのか分からない」という段階でもお気軽にお問い合わせください。

お問い合わせはこちら

COLUMN

お役立ち情報

PAGE TOP