WordPressサイトにおいて、スピードは命。サイト速度は、Googleのアルゴリズムにおける重要な要素です。高速なウェブサイトは、SERPでより上位に表示され、アクセス数の増加が期待でき、ユーザー体験にも大きな影響を与えます。サイトが素早く表示されれば、訪問者はより長い時間サイトに滞在し、コンテンツを目に通してくれる確率も上がり、ひいてはコンバージョンにもつながります。高速サイトはいいこと尽くめ。

今回は、サイトを高速化する方法ではなく、WordPressユーザーであれば経験する速度テストの課題について取り上げます。WordPressサイトの高速化ページの表示速度に関しては、それぞれのリンクよりご覧ください。実は多くの方が、誤った方法で速度を測定していることをご存知でしょうか?

スピードの測定方法は、それほど大きな問題ではないように思えますが、改善点を分析する際には非常に重要になります。誤った方法で測定を行えば、実際の速度よりも低速という結果が出る可能性があります。

そこでこの記事では、サイト速度の正しい測定方法、そして速度を測定し、改善点を追跡するのに便利なツールを見ていきます。

サイト速度を測定する前に

速度テストを実行する前に、以下2つがWordPressサイトで有効になっているかを確認してください。

  1. キャッシュ
  2. コンテンツデリバリネットワーク

不明な場合、ウェブ開発者またはご利用のホスティング会社に確認してください。また、サイトをこれから立ち上げる場合には、上記2つの設定を行った上で、テストを実行してください。

1. キャッシュを設定する

Kinstaをご利用の場合は、サーバーレベルのページキャッシュがすでに有効になっているため、特別な設定は不要です。ただし、ステージング環境では、開発やデバッグの目的でデフォルトでキャッシュが無効になっています。ステージング環境でキャッシュを有効にするには、MyKinstaのサイトの「ツール」画面で、「サイトキャッシュ」セクションの「利用する」をクリックしてください。

Kinsta以外をご利用の場合は、その会社のドキュメントを確認し、キャッシュが設定されているかを確認してください。共用サーバーまたはVPSを使用している場合は、WordPressのキャッシュプラグインをインストールする必要があるかもしれません。

2. コンテンツデリバリネットワーク(CDN)を使用する

コンテンツデリバリネットワークに馴染みがない方は、まず『WordPress CDN─読み込み速度を最大72%アップ』をご覧ください。CDNを使用すると、ほぼ確実にサイト速度が高速化されます。サイトがホストされているデータセンターの場所や訪問者がどこからアクセスしているかにもよりますが、CDNによって読み込み時間が50%以上短縮されることが明らかになっています。

Kinstaのすべてのホスティングプランでは、CDNを無料でご利用いただけます。また、CDNの有効化はとてもシンプル。

ステップ1

MyKinstaにログイン後、サイトを選択し「CDN」をクリックします。

Kinsta CDN
Kinsta CDN

ステップ2

表示されるポップアップウィンドウで「CDNを利用する」をクリックすれば完了です。

CDNを有効化
CDNを有効化

Cloudflareのアカウントをお持ちの場合、また利用を検討している場合は、WordPressサイトにCloudflareをインストールする方法設定方法をご覧ください。また、KinstaのCDNについてCloudFlareの自動プラットフォーム最適化などのリソースも参照してみてください。

サードパーティのCDNサービスを利用する場合、WordPressサイトでのセットアップ方法に関するドキュメントを確認してください。CDN Enablerなどの無料プラグインで設定可能です。

ウェブサイトの速度を正しく測定する方法

キャッシュとCDNの設定を終えたら、早速WordPressサイトの速度を測定していきましょう。

測定に便利なおすすめツールはこちらでご紹介しています。今回は、一般的に使用されているPingdomを使用した例を見ていきます。

速度テストの実施場所

ほぼすべての速度測定ツールでは、テストを実施する場所を世界中から選択することができるようになっています。テストの実施場所は、WordPressサイトが運営されているデータセンターとの相対的な関係があるため、非常に重要です。TTFBネットワークレイテンシなどが関係してきます。Kinstaのお客様は、世界36箇所から、任意の場所を利用することができます。

また、データセンターに近い場所と遠い場所の両方から測定することが重要です。これによって、CDNの効果も確認することができ、さらにCDNを一時的に無効にしてテストを行えば、その違いも明確に分かります。

いずれにしても、実施場所には一貫性を持たせてください

複数回テストを実施すること

今回は、キャッシュについてあまり掘り下げませんが、WordPressホスティングやプラグイン、そしてCDNの両方のキャッシュがサイトの高速化に必要であることを覚えておいてください。

よくある誤解として、多くの人が速度テストを一度しか行わない傾向にあります。速度を一度測定しただけでは、コンテンツがWordPressホスティングやCDNにまだキャッシュされていないため、高速化される前の速度が結果に出てしまう可能性があります。また、WordPressサイトやCDNのキャッシュをクリアしたばかりの状態でも同様のことが起こり得ます。

コンテンツやメディアがキャッシュから配信されているかどうか、確認する方法があります。

速度測定ツールでは、HTTPヘッダー(レスポンスヘッダーとも)が表示され、各リクエストに関する詳細を確認することができます。

KinstaのCDNを有効化した開発サイトをセットアップし、Pingdomでテストを実施したところ、以下のような結果になりました。

速度テストの結果
速度テストの結果

下のスクリーンショットを見ると、最初のリクエストはプライマリドメインへのもので、つまりKinstaのサーバーから読み込まれています。その下には、残りのリクエストがKinstaのCDN(xxxx.kinstacdn.com)から読み込まれていることが分かります。

Kinstaのサーバーのリクエストには、x-kinsta-cacheヘッダーが表示されています。キャッシュから配信されていない場合は、MISSが表示されます。このヘッダー名はホスティング会社によって若干異なることがあります。

その下のCDNのリクエストの場合は、x-cacheというヘッダーです。まだキャッシュから配信されていない場合は、MISSが表示されます。このヘッダー名もCDNサービスによって異なることがあります(Cloudflareを利用している場合のヘッダー名はcf-cache-status)。

速度テストの詳細
速度テストの詳細

適切に速度を計測するには、利用しているWordPressサーバーとCDNの両方のキャッシュから読み込まれていなければなりません。キャッシュから配信されている場合は、x-kinsta-cachex-cache両方のヘッダーにHITが表示されます(以下スクリーンショット参照)。「HIT」を示すには、通常数回テストを実行する必要があります。具体的には、3回実施するのが確実です。

Pingdomのような速度測定ツールでは、一度テストを行うと、少し間隔を空けなければならないため(通常は数分)、少し時間を置きながら複数回実行してください。

WordPressサーバーとCDNキャッシュ
WordPressサーバーとCDNキャッシュ

また、WordPressサーバーがCDNの前にキャッシュでHITを返すことがあります。その場合は、テストの結果ページを下にスクロールして、黄色のバーを確認してみてください。このバーは、TTFB(ページ表示までの待ち時間)を示しており、ページやアセットがキャッシュから配信されていない場合に大きく上昇します。

この確認が重要になる理由は、実際にこのテストを行った結果、キャッシュから読み込んだサイトの方が50%高速になったためです。今回テストに使用したのは小規模な開発サイト。大規模なサイトでは、この割合はさらに大きくなることが予想されます。このように、サイト速度の正しい測定方法を理解しておくことが大切です。

キャッシュを使用した速度テスト
キャッシュを使用した速度テスト

また、ホスティングサーバーやCDNへのリクエストのほかにも、Facebook、Google アナリティクス、Google Fontsなど、外部リクエストもありますが、これはまた別の記事で掘り下げていきます。併せて、WordPressサイトの外部サービスを特定し分析する方法Pingdomの使用方法WordPressでフォントを変更する方法などもご覧ください。

【2024年版】おすすめのサイト速度測定ツール

ここからは、選りすぐりのサイトの速度測定ツールをご紹介していきます。なお、見識者の間では、理想の速度は2秒以内と言われています。また、知覚的なパフォーマンスと実際のパフォーマンスには差異があることも念頭に置いてください。

速度テストを行うにあたってのルールとして、使用するツールは1つに絞ること。各ツールにはそれぞれ異なる指標があり、テスト結果を他のツールのそれと比較することは不可能です。ツール選びに正解・不正解はありません。使用しやすいものを1つ選択して、テストを実施してください。

Googleのウェブマスター・トレンド・アナリストであるGary Illyes氏は、以下のようにつぶやいています。

各ツールはそれぞれに違う指標を持っていても、各指標はそのツールにおいて正確なデータ。完璧なツールはないから、単に好きなものを選べば問題ない。(和訳)

1. Pingdom

Pingdomは、市場をリードするウェブサイト監視サービスで、無料の速度テストで最も知られています。サイトのすべてのリクエストが滝グラフで表示され、読み込み順、ファイルサイズ、読み込み時間でフィルタリングすることもでき、潜在的な改善点を特定するさまざまな機能があります。また、総リクエスト数や読み込み時間、ページサイズなども確認できるのがメリットです。

類似の速度テストツールと比較して、圧倒的に使用しやすいのが長年にわたる人気の秘密。初心者にはベストな選択肢です。

PingdomのWebsite Speed Test
PingdomのWebsite Speed Test

100点満点の速度パフォーマンススコアも取得でき、全部で12ある基準それぞれに点数が付きます。サイト速度を即座に改善する手がかりを見つけるのにも役立ち、100点満点を目指すことも可能です。ただし、スコアにはあまりこだわりすぎないこと。サイトの速度を改善することが大切です。

また、Pingdomでは、実行したテストの結果が保存されるため、時間の経過とともに速度の向上を追跡することもできます。

2. Google PageSpeed Insights

Googleは、2010年にページの表示速度はSEOの重要なランキング要因であると発表しています。Google PageSpeed Insightsは、モバイル端末とPCでのページのパフォーマンスを測定することができるテストツールです。

Google PageSpeed Insights
Google PageSpeed Insights

このツールは、Lighthouseがベースとなっており、パフォーマンスを0〜100点で評価します。点数が高ければ高いほど良く、85点以上は高パフォーマンスと評価されます。レポートページでは、パフォーマンスを向上に役立つヒントが表示され、モバイル端末でのユーザー体験に関する推奨事項も確認できます。これに関連して、『Google PageSpeed Insights—100点満点を獲得することの真実』もぜひご覧ください。

サイトを検索結果の上位に表示させるには、Googleの推奨事項に注目するのが賢明です。また、「ブラウザのキャッシュを活用する」という提案の解決方法についてはこちらを参考にしてみてください。

3. Google アナリティクス

Google アナリティクスには、サイトの速度を計測する機能があります。GA管理画面の「行動」メニューから利用でき、ウェブページに記述したコードスニペットから情報を取得します。

この機能では、以下3つのレイテンシの指標を測定します。

  • サイト上のページビューのサンプルに対するページ読み込み時間
  • 追跡したい個別のヒット、イベント、ユーザーインタラクションの実行速度または読み込み時間
  • ブラウザがドキュメントを処理し、ユーザーインタラクションが可能になるまでにかかる時間
Google アナリティクスのサイトの速度測定
Google アナリティクスのサイトの速度測定

この結果は、全体的な比較には役立ちますが、データが無作為に抽出されたものであることから、速度測定ツールとして使用することは推奨されません。

Google アナリティクスの速度測定の精度に関する懸念について、Joe Christopher氏が有益な記事を公開しています。また、Tedd Rodman氏も、サイト速度の平均値を大幅に狂わせる頻発するエラーについて報告しており、基本的には、他のツールを使用する方が得策かもしれません。

4. WebPageTest

WebPageTestは、Google ChromeのエンジニアであるPatrick Meenan氏によって開発されました。オープンソースのプロジェクトで、世界中のさまざまな場所から、実際のブラウザ(IE、Chromeなど)を使って、無料で速度テストを行うことができます。速度テストからさらにデータを取得したい上級者向けの画期的なツールです。

WebPageTest
WebPageTest

WebPageTestでは、マルチステップのトランザクション、動画キャプチャ、コンテンツブロック、ファーストビューとリピートビューの比較、接続速度の変化など、高度な測定を行うことができます。また、滝グラフとリソースの読み込みレポートで、サイト全体の改善に役立つ有益な情報を確認できます。

5. GTmetrix

GTmetrixも人気のある速度測定ツールで、Pingdomの代替ツールとしてよく知られています。使いやすく、初心者でもすぐに使いこなすことができるのが魅力です。Google PageSpeed InsightsとYSlowによるパフォーマンス評価と推奨事項を組み合わせ、包括的な分析を提供してくれるため、速度の最適化に必要なものが全て揃った万能ソリューションと言えます。

GTmetrix
GTmetrix

GTmetrixは、重要なデータを把握しやすいよう、ページ上部にサマリーを表示し、総ページ読み込み時間、ページサイズ、リクエスト数が一覧表示されます。また、リクエスト一覧を滝グラフで表示し、問題点やボトルネックを簡単に特定することができます。滝グラフはオンラインで確認することもダウンロードすることも可能です。

さらに、無料のアカウントを作成すると、過去20回のテスト結果が記録されます。これによって、過去のデータと比較したり、テストの実施場所、ブラウザ、接続速度などの設定を保存したりすることができます。

GTmetrixの詳しい使い方についてはこちらをご覧ください。

6. KeyCDNのWebsite Speed Test

KeyCDNのWebsite Speed Testを使用すると、WordPressサイト全体の速度を驚くほど素早くかつ容易に測定することができます。データは滝グラフの内訳とサイトのプレビューが表示されるシンプルな構成。世界各地にある14の場所からテストを実施でき、各地域でのアセットの読み込み時間を正確に計測することができます。

KeyCDNのWebsite Speed Test
KeyCDNのWebsite Speed Test

また、テスト結果は公開・非公開から選択することができ、後で他の人に共有したり、今後のためにブックマークしておくことも可能です。内訳レポートでは、リクエストメソッド(GET/POST)、HTTPステータスコード(「200 OK」または「404 Not Found」など)、ファイルタイプ、コンテンツサイズ、待機・受信時間、合計読み込み時間、およびサイト上で発生した総HTTPリクエスト数など、さまざまな指標の概要が表示されます。

KeyCDNは、他にもPingテスト、HTTP/2テスト、HTTPチェック、Tracerouteツールなど、便利なパフォーマンステストツールを無料提供しています。

7. DareBoost

DareBoostは、サイトの速度テスト、ウェブパフォーマンス監視、サイト分析(スピード、SEO、品質、セキュリティ)を実現するオールインワンツール。一部機能の制限はありますが、有料版とは別に、月に最大5回まで無料で速度テストを行うことができます。無料とは言え、取得できるレポートは一流です。

DareBoost
DareBoost

DareBoostの速度テストは、以下のカテゴリにまたがる80以上の指標を分析してくれます。

  • キャッシュポリシー
  • リクエスト数
  • セキュリティ
  • アクセシビリティ
  • コンプライアンス
  • 品質
  • jQuery
  • ブラウザレンダリング
  • データ量
  • SEO対策

WordPressサイトのどこに問題があり、改善が必要なのかを一目で確認することができます。また、他のツールとは異なる独自のセキュリティレポートも入手可能です。サイトがクリックジャッキングに晒されているかどうか、コンテンツさらされているかどうか、コンテンツセキュリティポリシー(CSP)ヘッダーが設置されているかどうか、そしてSSL証明書に関する情報などを確認することができます。そしてデザインもなかなか洗練されています。

上司や代行業者への報告が必要な場合には、チェックしておきたい選択肢です。

DareBoostのレポート
DareBoostのレポート

8. Web Page Analyzer

Web Page Analyzerは、サイトの速度、サイズ、構成を分析するのに役立つ無料ツール。スクリプトが個々の要素のサイズを計算し、ウェブページ構成要素の各タイプを集計。ページ特性に基づき、ページの表示速度を改善するための推奨事項を提示してくれます。

Web Page Analyzer
Web Page Analyzer

具体的には、接続速度の違いによるサイトの表示速度を測定することができます。詳細なデータが必要な場合は、データを分解し、各要素のサイズと解説を表示可能。分析結果の最後には、パフォーマンスの高いページとともに、パフォーマンスに関する11の項目について解説と推奨事項も表示されます。ただし、このツールはしばらく更新が行われていないため、HTTP/3のサポートなどは期待できなさそうです。

9. YSlow

次にご紹介するのは、Yahoo!のページパフォーマンスツールであるYSlow。これは、ブラウザのアドオンとしてインストールすることになりますが、完全無料で、ほぼすべての主要ブラウザに対応しています。

YSlow
YSlow

Yahoo!は、サイトの速度に影響を与える34の要因を特定しており、そのうち測定可能な23の要因を集中的に分析することができます。YSlowの公式サイトには、この23の「ルール」が詳細とともに掲載されているため、目を通してみてください。

分析結果は、各要因がA〜Fのスコアで採点されます。

以前は最も人気の高い速度テストツールでしたが、現在ではこのプロジェクトも失速しており、最後の更新は数年前。GitHubのページには、100以上の未解決の課題が残ったままです。有益なデータを取得できるアドオンではありますが、より新しく、定期的にサポートや更新が行われているテストツールを選択する方が賢明かもしれません。

10. Google Chrome デベロッパー ツール

Google Chrome デベロッパー ツールのネットワークパネルは、Chromeや他のChromiumベースのブラウザの一部として提供されています。簡単に使用でき、ローカルでのデバッグやテストに適しているため、開発者の間で支持を集めています。ネットワークパネルは、Command+Option+I(Mac)またはControl+Shift+I(Windows、Linux)で簡単に起動することができます。起動するとサイトの滝グラフ分析が生成され、各アセットのパフォーマンスを掘り下げることができます。

ネットワークパネルの滝グラフ
ネットワークパネルの滝グラフ

Chrome 60に追加されたもう1つの素晴らしい機能として、リクエストをブロックすることができます。これは、サードパーティのサービスやスクリプトがサイトに与えるオーバーヘッドを調べるのに非常に便利です。

リクエストをブロック
リクエストをブロック

デベロッパー ツールには、Lighthouseが統合されています。Lighthouseとは、ウェブページの質を向上させるための自動オープンソースツール。パフォーマンス、アクセシビリティ、PWA(プログレッシブウェブアプリ)などの監査が可能です。分析は、「Lighthouse」タブから実行可能です。0〜100点のスコアで、リクエストを解析し、レンダリングブロックを引き起こす可能性のあるスクリプトを検出したり、画像の圧縮率を測定したりすることができます。取得した結果は、他のユーザーとの共有も簡単です。

ウェブパフォーマンス監査
ウェブパフォーマンス監査

デベロッパー ツールのその他の機能には、キャッシュの無効化、ネットワーク接続のスロットル、ページレンダリングのスクリーンショット、TTFB診断などがあります。

11. Site Relic

Site Relicは、最近リリースされた無料の速度テストツールです。9つの地域で、モバイルとPCの両方でサイトの表示速度を簡単に測定することができます。また、全地域のTTFBを一度に確認することも。

Site Relic
Site Relic

各地域のレポートでは、全体の読み込み時間、ページサイズ、TTFB、リクエスト総数、タイプ別リクエスト数、レスポンスコード別リクエスト数を容易に確認することができ、ツール内にある滝グラフのレポートもよくできています。

Site Relicのテスト結果
Site Relicのテスト結果

12. dotcom-monitor

dotcom-monitorには、無料の便利機能が多数搭載されていますが、その1つが速度テストツール。世界25箇所から、サイトの速度を即座に測定することができます。Firefox、Chrome、iOS、Androidなど、さまざまなブラウザにも対応しています。

dotcom-monitorの速度テスト
dotcom-monitorの速度テスト

テスト結果のレポートでは、以下のような情報を確認できます。

  • 場所別サマリー
  • 最も高速な要素(上位10%)
  • 最も低速な要素(上位10%)
  • 包括的な滝グラフ
  • DNS、接続、SSL、リクエスト、TTFB、ダウンロードなど、サーバー側の要素別内訳
  • エラー検出と診断

13. New Relic

New Relicは、アプリケーションパフォーマンス監視、サーバー監視から、モバイル監視やリアルタイムのユーザーインサイトまで、あらゆる機能を提供しています。有料サービスですが、その他のツールで取得できる以上のデータが必要であれば、投資の価値ありです。

New Relic
New Relic

Kinstaでは、稼働率とパフォーマンスの監視に、New Relicの2つの製品(アプリケーションパフォーマンスモニタリングSyntheticsモニタリング)を使用しています。

ウェブトランザクション時間の分析
ウェブトランザクション時間の分析

特に便利なのは、WordPressのプラグインセクション。どのプラグインやテーマが最も応答時間が長いかを瞬時に確認することができます。

WordPressプラグインの応答時間
WordPressプラグインの応答時間

サイトが遅くなったと感じたら、New Relicを使用すれば、すぐにその原因を検出可能です。通知を受け取り、すぐに対処することができます。これには、速度を低下させている可能性のある外部サービスや広告ネットワークも含まれます。Kinstaではお客様に最高のサポートを提供するため、高性能なNew Relicを利用しています。

New Relicの外部サービス
New Relicの外部サービス

まとめ

正しくWordPressサイトの速度を測定する方法を理解することで、パフォーマンスを的確に確認することができます。例えば、Kinstaに移行した後のサイトの速度の違いを確認するのにも役立ちます。

サイトの速度は、ビジネス成功の鍵を握る要素。速ければ速いほど、成功する可能性が高まります。超高速なサイトを目指すなら、速度最適化に役立つ速度測定ツールを活用してみてください。

あなたはサイト速度の測定にどのようなツールを使用していますか?以下のコメント欄でぜひお聞かせください。

Brian Jackson

Brianの最大の情熱の一つは10年以上使用してきたWordPressです。複数のプレミアムプラグインさえ開発しています。Brianの趣味はブログや映画やハイキングなどです。TwitterでBrianとつながりましょう。