ホームぺージを開設するなら今!

国内No.1のレンタルサーバー
\エックスサーバーのお得な情報/

※ 2022年10月時点、 hostadvice.com調べ。

サイトスピードとは?PageSpeed Insightsによる計測・改善方法を解説

\この記事をシェアする/

カワウソ

当メディアはリンクフリーです。貴社のSNSやブログでご紹介いただけると嬉しいです。

この記事のレベル
初心者
(3.0)
重要度
(3.0)
難しさ
(3.0)

こんにちは、編集長のカワウソです!

「サイトスピードはSEOで重要ってよく聞くけど、具体的に何をすればいい?」と悩んでいませんか?

そこで今回は、サイトスピードの計測方法や改善方法を解説します。

カワウソ

この記事は次のような人におすすめ!

  • SEO(検索エンジン最適化)に注力したい人
  • 売上の拡大やコンバージョンの獲得を目指す人
  • サイトスピードの計測方法や改善方法を知りたい人

この記事を読めば、サイトスピードに関する基礎知識を身に付けることができます。
ホームページで成果を上げるために知っておいて損はない基礎知識なので、SEOに取り組む予定がない企業の方もぜひご覧ください。

なお、サイトスピードの計測方法や改善方法のみ知りたい方は、以下をクリックすれば、基礎知識を読み飛ばしできますよ。

サイトスピードの計測にはPagespeed Insightsがおすすめ

それではどうぞ!

サイトスピードとは

サイトスピードとは、「Webページを読み込む速さ」のこと

分かりやすく言うと、Webページにアクセスしてから、画面が表示されるまでの時間です。

サイトスピードとは、Webページにアクセスしてから、画面が表示されるまでの時間のこと

サイトスピードはなぜ重要なのか

サイトスピードが重要な理由は、主に以下の3つです。

※「SEOって何?」という方は、さきに以下の記事をご覧いただくと、サイトスピードについてより理解が深まります。

SEO対策とは?ホームページ初心者が制作時に意識すべきポイント6つ

それぞれ解説します。

検索のランキング要素

Googleは、サイトスピードを「検索のランキング要素に使用している」と公表しています。

読み込み速度これまでもランキング シグナルとして使用されていましたが、デスクトップ検索を対象としていました。そこで 2018 年 7 月より、ページの読み込み速度をモバイル検索のランキング要素として使用することになりました。

引用:Google 検索セントラル「ページの読み込み速度をモバイル検索のランキング要素に使用します」

そのため、サイトスピードが遅いと、SEOに悪影響を及ぼすおそれがあります。

ただ同時に知っておくべき点は、SEOに悪影響を及ぼすのは「ユーザーがかなり遅いと感じるようなページのみ」ということ。

これを「Speed Update」と呼びますが、対象となるのは、ユーザーがかなり遅いと感じるようなページのみで、ごくわずかな割合のクエリにしか影響しません。

引用:Google 検索セントラル「ページの読み込み速度をモバイル検索のランキング要素に使用します」

そのため、まずは自社ホームページのサイドスピードが致命的な問題を抱えていないか、チェックすることが重要なのです。

知っておきたい「ページエクスペリエンス」

SEOにおけるサイトスピードの理解度を深めるためには、併せて「ページエクスペリエンス」も知っておきましょう。

ページエクスペリエンスとは、ユーザーがWebページに訪れたときの、コンテンツ(情報)そのものの価値以外の体験のこと。つまり、サイトスピードはページエクスペリエンスの一部です。

Googleが提唱するページエクスペリエンスには、以下のようなものが含まれます。

ページエクスペリエンスの種類

▲出典:Google 検索セントラル ブログ 「Google 検索へのページ エクスペリエンスの導入時期」

Core Web Vitals
(コアウェブバイタル)
LCP(ページの読み込みパフォーマンス)、FID(インタラクティブ性)、CLS(視覚的安定性に関する実際のユーザーエクスペリエンスを測定する指標)の3つのセット。
Mobile Friendly
(モバイルフレンドリー)
スマホ用に表示が最適化されているかどうか
HTTPS Webサイトの接続(通信)が安全かどうか
No Intrusive Interstitials ページのコンテンツにユーザーが容易にアクセスできるかどうか
(例)コンテンツを閲覧するときに妨げとなるポップアップなど

これらはランキング要素の一部です。

とくにサイトスピードに大きく関わるのは、「Core Web Vitals(コアウェブバイタル)」であり、2021年6月から段階的にランキング要素に組み込まれました。

2021 年 6 月中旬より、ランキング システムの一部としてページ エクスペリエンスの使用を開始します。

(中略)

以前発表したように、ページ エクスペリエンスの更新では、3 つのウェブに関する主な指標、LCP、FID、CLS(および CLS に対する Chrome の最近の修正)を含む、いくつかのページ エクスペリエンス シグナルが考慮されます。

引用:Google 検索セントラル 「ページ エクスペリエンスの更新に対応するための期間、ツール、詳細情報」

※Core Web Vitalsの3つの指標は、あとの「PageSpeed Insightsの使い方(結果の見方)」で詳しく解説します。

ユーザーの満足度に影響する

サイトスピードが速いと、ユーザーの満足度を向上できます。

なぜなら、表示が速いWebページは、ユーザーにとって使いやすいためです。

たとえば、ホームページにアクセスしたものの、なかなか表示されずに、ストレスを感じたご経験はないでしょうか?

Googleのマーケティング情報サイトによれば、ページの読み込みに3秒以上かかると、訪問者の53%が離れてしまうとのことです。

The average time it takes to fully load a mobile landing page is 22 seconds, according to a new analysis.1 Yet 53% of visits are abandoned if a mobile site takes longer than three seconds to load.2 That’s a big problem.

引用:Think with Google「Find Out How You Stack Up to New Industry Benchmarks for Mobile Page Speed」

▼Google翻訳

新しい分析によると、モバイル ランディング ページを完全に読み込むのにかかる平均時間は 22 秒です。しかし、モバイル サイトの読み込みに 3 秒以上かかると、訪問者の 53% が放棄されます。 これは大きな問題です。

そのほか「Google 検索の基本事項」でも、サイドスピードの最適化は推奨されていますよ。

訪問者がページを利用しやすいよう手助けする
・ページの読み込み時間を最適化します。表示の速いサイトはユーザーの満足度を高め、ウェブ全体の質を向上させます(とくにインターネット接続速度が遅い場合)。

引用:Google検索セントラル「Google 検索の基本事項」

コンバージョンの獲得に影響する

サイトスピードが速いと、コンバージョンの獲得にもよい影響を与えます。

コンバージョンとは

コンバージョンとは、ホームぺージの目標としている「特定のアクションをユーザーが起こしてくれた状態」を指します。分かりやすく言うと、ホームぺージ上の成果です。

コンバージョン(CV)とは?意味・種類・選び方など解説

実際に、サイトスピードの改善により、売上やコンバージョン率をアップさせた企業例をGoogleが紹介しています。

AutoAnythingがページの読み込み時間を半減させたとき、売り上げは12%から13%に上昇しました。

小売業者のFurniture Villageは、サイトの速度について監査を実施し、発見した問題に対処するための計画を立てました。これにより、ページの読み込み時間が20%短縮され、コンバージョン率が10%増加しました。

引用:web.dev「スピードが重要な理由とは?」

前述のとおり、ページの読み込みが速いWebページは、ユーザーの満足度を高めます。
満足度が高まったユーザーは、結果的に「コンバージョンしやすい状態」になるのです。

カワウソ

売上やコンバージョンに影響するなら、SEOに取り組む予定がない企業の方でも、自社のサイトスピードに問題がないかは、チェックしておきたいですよね。

サイトスピードの計測にはPagespeed Insightsがおすすめ

Pagespeed Insights(ページスピード インサイト)は、Googleが提供する無料のページパフォーマンス計測ツールです。

PageSpeed Insights

▲出典:Google「Pagespeed Insights」

WebページのURLを入力するだけで、簡単にサイトスピードを計測できるのが特徴。

また、Webページのパフォーマンスをスコアで表示してくれます。同時に改善策も提示してくれるので、おすすめですよ。

メモ

Google Analyticsでも、サイトスピードの計測が可能です。

ただ、前のバージョンであるUA(ユニバーサルアナリティクス)では、レポートメニューから簡単に「平均読み込み時間」を確認できましたが、最新バージョンのGA4(Google Analytics 4)では、カスタムで設定する必要があります。

そのため、必要性を感じるまでは、Pagespeed Insightsを使用しましょう。

PageSpeed Insightsの使い方(結果の見方)

ここからは、PageSpeed Insightsを使ってサイトスピードを計測する方法を解説します。

計測するページのURLを入力する

PageSpeed Insightsのページにアクセスします。
計測したいページのURLを入力して、「分析」ボタンを押します。

PageSpeed Insights(URLの入力 > 分析)

結果を確認する

分析が完了すると、結果が表示されます。

まず、「携帯電話」と「デスクトップ」から見たい方を選びましょう。

タブで簡単に切り替えられます。

PageSpeed Insights(デバイスの選択)

このあと、以下2つのデータについて見方を解説します。

実際のユーザーの環境で評価する(フィールドデータ)

次に、「実際のユーザーの環境で評価する」のデータを見てみましょう。

指定したWebページ(URL)について、過去28日間のユーザーデータ(フィールドデータ)が、以下6つの指標で表示されます。

PageSpeed Insights(実際のユーザーの環境で評価する)
Core Web Vitals
Largest Contentful Paint
(LCP)
ユーザーがWebページにアクセスしたときに、メインコンテンツ(最も大きなテキストまたは画像)が表示されるまでの時間。
First Input Delay
(FID)
ユーザーが最初にWebページを操作(リンクのクリックやボタンのタップ)したときから、ブラウザがその操作に応答するまでの時間。
Cumulative Layout Shift
(CLS)
ページの表示中に発生した予期しないレイアウトシフト(コンテンツの移動など)を計るための指標。0に近い(数字が低い)ほど、そのページが快適である証になる。
その他の重要な指標(Other Web Vitals
First Contentful Paint
(FCP)
ユーザーがWebページにアクセスしたときに、最初のコンテンツ(テキストまたは画像)が表示される(視覚的な反応がある)までの時間。
Interaction to Next Paint
(INP)
応答性を評価する実験的な指標。
Time to First Byte
(TTFB)
セットアップ時間と Web サーバーの応答性を測定するための基本的な指標。

Core Web Vitalsの3つの指標については、以下の数値が目安となります。

指標 良好 改善が必要 低速
LCP 2.5 秒以下 4 秒以下 4 秒を超える
FID 100 ミリ秒以下 300 ミリ秒以下 300 ミリ秒を超える
CLS 0.1 以下 0.25 以下 0.25 を超える

参考:Serch Consle ヘルプ「ウェブに関する主な指標レポート」

なかでも、Largest Contentful Paint (LCP)の指標を参考にするとよいでしょう。
GoogleのエンジニアであるPhilip Waltonは、Largest Contentful Paint (LCP)の重要性を説いています。

Largest Contentful Paint (最大視覚コンテンツの表示時間、LCP) は、知覚される読み込み速度を測定するための重要なユーザーを中心とした指標です。
(中略)
良好なユーザー体験を提供するために、サイトは Largest Contentful Paint が 2.5 秒以下になるように努力する必要があります。

引用:web.dev「Largest Contentful Paint (LCP)
注意

指定したWebページ(URL)のユーザーデータが不足している場合は、「データがありません」と表示されるか、またはホームページ全体でみた「オリジン」のデータのみが表示されます。

PageSpeed Insights(オリジン)

これでは指定したWebページ単体のパフォーマンスを評価できません。その場合は、次で解説する「パフォーマンスの問題を診断する」のデータを参考にしましょう。

パフォーマンスの問題を診断する(ラボデータ)

次に、「パフォーマンスの問題を診断する」のデータを見てみましょう。

メモ

ここでは「Lighthouse」という計測ツールで分析した結果(ラボデータ)が表示されます。実際のユーザー環境のデータではないので、参考程度にしましょう。

PageSpeed Insights(パフォーマンスの問題を診断する)

サイトスピードは、「0〜100」のスコアで表示されます。
スコアは以下の3種類で分類されるので、良好かどうかチェックしましょう。

良好 90~100
改善が必要 50~89
低速 0

そのほか「ビューを開く」から、以下6つの指標を確認できます。

PageSpeed Insights(ビューを開く)
First Contentful Paint
(FCP)
テキストまたは画像が初めてペイント(表示)されるまでにかかった時間。
Speed Index ページのコンテンツが取り込まれて表示される速さ。
Largest Contentful Paint
(LCP)
最も大きなテキストまたは画像が描画されるまでにかかった時間。
Time to Interactive ページが完全に操作可能になるのに要する時間。
Total Blocking Time タスクの処理時間が 50 ミリ秒を上回った場合の、コンテンツの初回描画から操作可能になるまでの合計時間(ミリ秒)。
Cumulative Layout Shift
(CLS)
ビューポート内の視覚要素がどのくらい移動しているかを測定する指標。
注意

スコアは推定値であり、計測するたびに変動する可能性があります。複数回計測して平均値を取るなどの工夫が必要です。
またスコアにはCore Web Vitalsだけではなく、Other Web Vitalsのデータも含まれます。

サイトスピードの改善方法

では最後に、サイトスピードの改善方法を解説します。

注意

サイトスピードの改善方法によっては、バグの発生などが原因で、ホームページの表示に影響が出るものもあります。事前にバックアップを取るとともに、ご自身で対応が難しそうな場合は、Web制作会社などの技術者に依頼しましょう。

画像を最適化する

画像を最適化してファイル容量を減らすと、サイトスピードが速くなる可能性があります

たとえば、ジュースをコップに注ぐときのことを考えてみてください。
ジュースの容量が少ないほど、速く注ぎ終わりますよね。

また画像を最適化するときに、一緒に知っておきたいのが「画像フォーマット(種類)」です。

一般的に画像フォーマットは、「JPEG」「PNG」「GIF」などが認知されています。
※それぞれ以下の記事で詳しく解説しています。

【初心者向け】ホームぺージ画像マニュアル!作り方や入れ方など

ただGoogleは、自社で開発した新世代の画像フォーマット「WebP(ウェッピー)」を推奨していますよ。

WebPの特徴は、画質を保ったまま、ファイル容量を圧縮できること。
また、透明背景やアニメーションにも対応しています。

WebPの特徴

つまり「WebP」は、「JPEG」「PNG」「GIF」のよいところを、すべて取り入れたフォーマットだと言えるでしょう。

メモ

WebPに対応した画像編集ソフトはまだ少なく、なかには非対応のブラウザもあります。
WordPressで作ったホームページなら、「Converter for Media」などのプラグインを活用するのが、おすすめ。画像をWebPに自動変換してくれたり、ブラウザによってフォーマットの振り分けを行ってくれる優れモノです。

CSS、HTML、JavaScriptなどのソースコードを軽量化する

各ソースコードの不要な記述を削除すると、サイトスピードが改善する可能性があります

ソースコードに不要な記述が多いと、その分読み込むデータ容量が増え、ページの表示速度が遅くなってしまうのです。

使用していないコード、不要な改行、空白、コメントアウトなどは、削除するようにしましょう。

ソースコードの軽量化

とはいえ、Web制作スキルがない初心者の方であれば、ソースコードのどの部分が不要か、判断が難しいですよね。

初心者の方には、自動でソースコードを軽量化してくれる無料のオンラインツールがおすすめ。テキストの貼り付けまたはファイルをアップロードするだけで、簡単にソースコードを軽量化してくれます。

そのほか、WordPressで作ったホームページなら、プラグインを活用するのもよいでしょう。
なかでも「Autoptimize」というプラグインがおすすめ。簡単な設定で導入でき、初心者でも迷わず使うことが可能です。

注意

Autoptimizeにも、画像の最適化に関する機能があります。「Converter for Media」など、ほかに画像を最適化するためのプラグインを有効化している場合は、競合するおそれがあるので、Autoptimize側の画像の最適化に関する機能はオフにしましょう。

キャッシュを活用する

キャッシュを利用すると、不要な通信が減るため、サイトスピードが速くなる可能性があります

キャッシュとは

Webページにアクセスしたときに読み込んだデータを、一時的に保存しておくことです。次回同じWebページにアクセスしたときに、キャッシュのデータを読み取ることで、サイトスピードを速くできます。

(例)ブラウザキャッシュ

ブラウザキャッシュとは

キャッシュを活用していない場合は、同じWebページにアクセスしたときに、前回と同じデータ量をダウンロードする必要があります。

一度だけならまだしも、度々訪れるであろうWebページのサイトスピードが毎回遅いと、ユーザーはストレスを抱えてしまいますよね。

キャッシュの活用は、レンタルサーバーの機能を使うと簡単です。

たとえば、弊社が提供するレンタルサーバー『エックスサーバー』では、以下2つのキャッシュ機能をご用意しています。

  • ブラウザキャッシュ設定
  • サーバーキャッシュ設定

※サーバーキャッシュ設定を有効にすると、ホームページを高速・安定化させる「Xアクセラレータ」機能も有効となります。

詳しくは、以下のマニュアルをご覧ください。

ブラウザキャッシュ設定
サーバーキャッシュ設定
Xアクセラレータ(エックスアクセラレータ)

サーバーの応答時間を減らす

サーバーからの応答時間を減らすことで、サイトスピードの向上につながります

スペックが低いサーバーは、サイトスピードが遅くなる要因になってしまうでしょう。

ハイスペックで信頼性の高いレンタルサーバーなら、サーバーの応答時間を短縮できます。

弊社『エックスサーバー』は、圧倒的なハイスペックサーバーを月額990円〜利用可能。大量のアクセスも高速に処理を行い、安定した速度環境を提供します。

不明点やトラブルも24時間365日サポートいたしますので、初心者の方でも安心してご利用いただけますよ。

まとめ

今回は、サイトスピードの基礎知識をはじめ、計測方法や改善のポイントについて解説しました。

まとめ
  • サイトスピードとは、「Webページを読み込む速さ」のこと
  • サイトスピードが致命的に遅いと、SEOに悪影響がある
  • サイトスピードが速いと、売上やコンバージョンの獲得によい影響が出る
  • サイトスピードの計測には、「PageSpeed Insights」がおすすめ
  • サイトスピードの改善は、画像やコードの軽量化など数種類を組み合わせて行う

SEOに注力する方はもちろん、そうでない方にとってもサイトスピードは重要です。
サイトスピードを改善すれば、売上やコンバージョンの獲得に良い影響が出るでしょう。

それでは、素敵なホームページの完成を祈っております。

以上、最後まで読んでいただき、ありがとうございました。

安定度の高いレンタルサーバーをお探しの方へ

エックスサーバーは高速かつ高い安定性を誇る高性能レンタルサーバーです。
国内シェアNo.1のレンタルサーバーであり、16万社の導入実績があります。

2月3日12時まで半額キャッシュバックキャンペーン開催中です!
.comや.netなど大人気ドメインも永久無料と過去最大級にお得です。

さらに2月2日18時までえらべるプレゼントキャンペーンも開催中です。
星野リゾート宿泊ギフト券やiPadなどの豪華景品が当たるビッグチャンス

ぜひこのお得な機会にホームページ開設をご検討ください!

※ 2022年10月時点、hostadvice.com調べ。

ホームページ制作を無料で依頼したい方

法人向けレンタルサーバー「Xserverビジネス」なら、
ホームページ無料制作サービス」が付いているため、
申し込むだけで2日でホームページが完成します!

ホームページ無料制作サービスの詳細はこちら!

Xserverビジネスだと「.com」以外にも「.co.jp」や「jp」などのドメインも無料になります。

当メディア「初心者のための会社ホームページ作り方講座」では、初心者の方にわかりやすく会社のホームページを始められる方法を紹介しています!

これから始める方はこちらのホームページの作り方をぜひご覧ください!

【初心者向け】会社ホームページの作り方を基礎から解説

ホームページの始め方・立ち上げに関する、ご質問・ご相談はツイッターDM( @kawauso_xsv )までお気軽にどうぞ!

URLをコピーしました!