ランディングページの読み込み速度を確認するための10ページの速度ツール

公開: 2018-09-18

ほとんどのサイトは、ページの読み込み中に訪問者の半分を失います。 これは信じがたい衝撃的な現実ですが、今日の平均Webページバウンス率が58.18%であることを考慮すると、そうではないかもしれません。 さらに悪いことに、クリック後のランディングページの平均バウンス率は60〜90%の範囲です。

モバイルページは、遅いページ速度の影響も同様に受けます。 2016年のGoogleとSOASTAの調査によると、バウンスされたセッションのモバイルWebサイトの平均読み込み時間は、バウンスされていないセッションよりも約2.5秒遅くなりました。

通常、ウェブサイトの読み込みが速いほど、SEOランキングが高くなり、サイトへのアクセスが長くなり、エンゲージメントが増え、コンバージョン率が高くなるだけでなく、バ​​ウンス率も低くなります。 ロード時間とバウンス率の間にはこのような強い相関関係があるため、マーケターは最大の結果を得るためにページ速度ツールを利用する必要があります。

ページ速度をテストするための最も信頼できるツールを分析する前に、それに影響を与える最も一般的な要因とページ要素を見てみましょう。

ページ速度はどのように影響を受けますか?

ページリクエストが行われると、フロントエンド側とサーバー側の両方のコンポーネントがそれぞれの操作を完了する必要があります。 したがって、フロントエンドを最適化した後でも、サーバー側(サーバーによるページの生成方法)を最適化することで、読み込み時間をさらに短縮できます。

ページ速度ツールの読み込み時間

両側がシーケンシャルであるため、それらの累積時間は合計ページ読み込み時間と見なされます。

上の画像のどこかでページ速度を遅くする最も一般的な要因には、次のものがあります。

  • 大きな画像とテキストグラフィック
  • ビデオ
  • ページの長さ
  • スクリプト、フォント、プラグイン(HTML、JavaScript、CSS)
  • 不要なリダイレクト
  • 地理(国、都市、組織、ISP、ネットワーク速度)
  • 帯域幅

次のツールは、これらのさまざまな問題のテストに役立ち、Webサイトの速度をよりよく理解できます。

最も信頼できる10のページ速度ツール

注:これらのツールはそれぞれ、独自の機能、レポート、および結果を分析する方法を提供します。つまり、異なるページ読み込み時間の結果を受け取る可能性があります。 テスト場所とWebサイトがホストされているサーバーとの間の地理的な距離も影響します。 さらに、ツールを初めて実行すると時間がかかる場合があるため、テストを複数回実行し、結果の平均を取ることをお勧めします。

1.GTmetrix

ページ速度ツールGTmetrix

GTmetrixは、27ページの推奨速度(Google速度テスト)と19のYSlow推奨(Yahoo速度テスト)の組み合わせを使用してサイトを分析します。 レポートの上部には、AからFまでのパフォーマンススコアと、読み込み時間、ページサイズ、リクエスト数などのページの詳細が表示されます。

読み込み時間は、デフォルトで「完全に読み込まれた時間」として提供されます(訪問者が最初にページに移動してからネットワークアクティビティがなくなってから2秒後までの時間)。 「オンロード時間」はオプションです(Webページの処理が終了し、画像、テキスト、スクリプトを含むページ上のすべてのリソースのダウンロードが完了した場合)。 レポートの残りの部分は、PageSpeed、YSlow、ウォーターフォール、タイミング、ビデオ、および履歴の6つのセクションに分かれています。

GTmetrixを使用すると、Webサイトのパフォーマンスをテストしてさまざまな接続タイプと比較し、ページの読み込み速度にどのように影響するかを確認できます。 これは、サイト訪問者が使用する可能性のあるインターネット接続の可能なタイプ(ケーブル、DSL、3Gモバイル、2Gモバイル、および56Kダイヤルアップ)をシミュレートするための接続調整機能を提供します。 可能なブラウザとしてChromeまたはFirefoxを選択することもできます。

このツールには7つのテスト場所がありますが、合計28の専用テストサーバーを提供します。 5米国、ダラス。 7英国、ロンドン。 2ブラジルのサンパウロ。 1オーストラリアのシドニー。 1インドのムンバイ。 1つは中国の香港にあります。

GTmetrixは、HTTP / 1.1の多くの欠点と制限を解決しようとすることで、HTTP /1.1よりも高速にWebページをロードするHTTP / 2をサポートします。 HTTP / 2の利点は次のとおりです。

  • 多重化と同時実行性(同じTCP接続で複数の要求をすばやく連続して送信できます)
  • ストリームの依存関係
  • ヘッダー圧縮
  • サーバープッシュ

さらに、GTmetrixは、モバイルパフォーマンステストも提供する数少ないページ速度ツールの1つです。 2台のSamsungGalaxy Nexus電話を使用しているため、ユーザーはこれらのデバイスでの実際のページ読み込みに基づいてパフォーマンスレポートを生成できます。

2. Pingdom

ページ速度ツールPingdom

Pingdomを使用すると、3つの主要な場所からWebサイトの速度をテストできます。

  • テキサス、ダラス
  • オーストラリア、メルボルン
  • カリフォルニア州サンノゼ

無料版についてはGoogleのPageSpeedの推奨事項に、有料版についてはYSlowの推奨事項に基づいてパフォーマンスグレードを提供します。 Pingdomは、読み込み時間、ページサイズ、リクエスト数、サイトが他のサイトに対してどのようにテストされるかも表示します。 追加の洞察には、コンテンツタイプ別のページサイズ、ドメイン別のページサイズ、コンテンツタイプ別およびドメイン別のリクエストの内訳が含まれます。

Pingdomスピードテストの主な利点の1つは、ユーザーにパフォーマンスの洞察が提供され、どこで改善できるかを概説できることです。 ただし、GTmetrixとは異なり、Pingdomはオンロード時間(完全にロードされた時間ではない)のみを提供し、接続スロットリングを提供せず、HTTP / 2をサポートしません。

3. Google PageSpeed Insights

ページ速度ツールPageSpeedInsights

PageSpeed Insightsは、改善のための推奨事項を提供し、次の2つのパラメータに基づいて、ページを0から100ポイントまでスコアリングするGoogleスピードテストです。

  1. 折り畳みを超える読み込みまでの時間(ユーザーが新しいページをリクエストした後、ページが折り畳みの上にコンテンツを表示するまでの合計時間)
  2. 全ページの読み込みまでの時間(ユーザーがページを要求した後、ブラウザーがページを完全にレンダリングするのにかかる時間)

スコアが高いほど、サイトはより最適化され、85を超えるものは、ページのパフォーマンスが良好であることを示します。

PageSpeed Insightsは、ページのデスクトップバージョンとモバイルバージョンの両方のレポートを提供します。 URLを2回取得します。1回はモバイルユーザーエージェントを使用し、もう1回はデスクトップユーザーエージェントを使用します。 モバイルレポートには、ビューポート構成、タップターゲット(ボタンとリンク)のサイズ、およびフォントサイズを含む「ユーザーエクスペリエンス」と呼ばれる追加のカテゴリが含まれています。

PageSpeed Insightsチームは最近、リストの次の「ThinkwithGoogle」で新しいページスピードツールをリリースしました。

4. Googleで考える:自分のサイトをテストする

ページスピードツールGoogleモバイル

これとの違いは、モバイルページの速度のみをテストすることです。

結果ページの上部には、読み込み時間と推定訪問者損失(読み込み時間のためにページから失われた訪問者の割合を表す)があります。

ページ速度ツールAMPテスト

「読み込み時間」は速度インデックス(完全に読み込まれた時間ではありません)であり、3Gネットワ​​ーク内のMotoG4デバイスでChromeを使用して表示されているページコンテンツが表示されるまでにかかる時間を測定します。 (注:セルラーネットワーク接続の70%が2020年まで3G以下の速度で発生するため、テストには3Gネットワ​​ークが使用されます。)

結果の中央のセクションは、500万を超えるWebページに関するGoogleの内部調査から計算された業界比較です。

ページスピードツール業界比較

最後に、[個人用サイトのテスト]ツールは、ページにいくつかの修正を加えることでどれだけの時間を節約できるかを示し、PageSpeedInsightsが推奨する修正の詳細なレポートを提供します。

ページ速度ツールGoogleテストの推奨事項

5.Googleスピードスコアカード

ページ速度ツールGoogleスコアカード

スピードスコアカードのデータベースには、12か国の何千ものサイトが含まれており、最大10のドメインを比較して、モバイルサイトがどのように積み重なっているかを確認できます。 3G接続と4G接続の両方でページの読み込み速度を比較することもできます。

ページの読み込み速度が遅いとバウンス率とコンバージョン率にどのように影響するかについて説明したので、収益についてはどうでしょうか。 あなたにアイデアを与えるために、グーグルはまた、ページの読み込みが遅い場合にブランドが失う可能性のある潜在的な収益の金額を見積もるための影響計算機を含めました:

ページスピードツールの収益への影響

推定損失を確認するには、計算機のフィールド(ドメイン、現在の速度、平均月間訪問者、平均注文額、コンバージョン率)に入力します(これらの多くはGoogle Analyticsダッシュボードにあります)。

6. KeyCDN

ページ速度ツールKeyCDN

KeyCDNは、モバイルデバイスでうまく機能するもう1つのページ速度ツールです。 KeyCDNは、世界中から選択できる16のテスト場所を提供し、テスト結果を非公開にするか、他の人と公開するかを選択できます。

結果には、下部にWebサイトのプレビューがあるウォーターフォールの内訳が含まれます。 結果内で、行われたHTTPリクエストの数、リクエストされたページのフルサイズ、および読み込み時間を確認できます。

7.WebPagetest

ページ速度ツールWebpagetest

WebPagetestには、14のモバイルデバイスを含む25を超えるブラウザーから選択できる40を超える異なるテスト場所が含まれています。 最小システム要件を満たしている限り、誰でもWebPagetestのテスト場所をホストできるため、非常に多くのテスト場所を利用できます。

テストは、接続スロットリング機能を使用して実行し、サイト訪問者が使用する可能性のある潜在的なインターネット接続をシミュレートできます:ケーブル、DSL、3G低速、3G、3G高速、4G、LTE、モバイルエッジ、2G、56Kダイヤルアップ、FIOS、ネイティブ接続、およびカスタム速度。

「ファーストビュー」と「リピートビュー」を実行する独自のテストアプローチを提供します。 また、ビデオキャプチャ、マルチステップトランザクション、コンテンツブロッキング、JavaScriptの無効化、SSL証明書の無視、ユーザーエージェント文字列のなりすましなどのより高度な機能も提供します。

WebPagetestが結果を提供するとき、デフォルトで完全にロードされた時間に基づいて、サイトにAからFまでの文字グレードを割り当てます。オンロード時間はオプションです。 その他のスコアリングパラメータには、FTTB、圧縮、キャッシング、CDNの効果的な使用などがあります。 レポートは、要約、詳細、パフォーマンスレビュー、コンテンツの内訳、スクリーンショットの6つのセクションに分かれており、ウォーターフォールチャート、ページ速度の最適化チェック、および改善の提案を含む豊富な診断情報を提供します。

最後に、HTTP / 2はWebPagetestでサポートされていることに注意してください。

8.ドットコム-モニター

ページ速度ツールDotcomMonitor

Dotcom-Monitorは、世界中に20の異なるテスト場所と、モバイルおよびクラウドベースを含む7つのブラウザーを提供します。 このツールのユニークな点は、すべての地理的テストを同時に実行し、各レポートをクリックして詳細を確認できることです。

レポートは、要約、パフォーマンス、ウォーターフォールの内訳、ホスト、およびエラーの5つのセクションに分かれており、以下を見つけることができます。

  • 場所別の概要
  • すべてのページ要素のブラウザベースの読み込み時間テスト
  • 遅い/欠落している要素の検出
  • 最速の要素の10%
  • 最も遅い要素の10%
  • 包括的なウォーターフォールチャート
  • ホスト要素別の内訳(DNS、接続、SSL、要求、最初のパケット、ダウンロードを含む)
  • エラーチェックと診断

9.ページの場所

ページ速度ツールPagelocity

Pagelocityツールは、デスクトップデバイスとモバイルデバイスの両方で使用でき、応答性があります。 コンテンツのステータス、ページ構造、コーディングなどのコンポーネントに基づいて、ユーザーに100点満点の合計スコアを割り当てます。 レポートには次のものが含まれます。

  • コンテンツの概要:ページのテキストコンテンツ(キーワード、見出しリンク、画像の代替テキストなど)に関する貴重な洞察
  • リソースの内訳:ページ構造に関する情報—画像、スクリプト、またはスタイルファイルの数、レンダリングをブロックするコンテンツ、およびこれらの要因がページの読み込み時間にどのように影響するか
  • コードのヒントと洞察:マークアップに関する有用なデータ(クラス/ ID、タグ、Google PageSpeed、最初のバイトまでの時間など)を使用して、コードをより保守性と拡張性を高めるように更新する方法に関する提案

Pagelocityのユニークな機能は、競合他社に対するあなたの利点と、競合他社が持っていると思われる弱点を示す、それが提供する並列メトリックを使用した競合分析です。

10. YSlow

YSlowは、Yahoo!の高性能Webサイトに関する34のルールのうち23に基づいてWebページを分析するオープンソースプロジェクトです。 パフォーマンステストの結果を生成するには、次の3つの手順に従います。

  • DOMをクロールして、すべてのコンポーネント(画像、スクリプトなど)を検索します
  • 各コンポーネントのサイズ(gzip、期限切れヘッダーなど)に関する情報を取得します
  • データを使用して各ルールの評点を生成し、全体的な評点を取得します

YSlowは、統計、改善の提案、およびパフォーマンス分析用のツール(Smush.itおよびJSLintを含む)を含むページの要約も提供します。

YSlowページ速度ツールを実行するには、YSlowクローム拡張機能を使用するか、GTMetrixからYSlowの結果を取得します。

これらの各ツールが提供するスコア、洞察、フィードバックは推奨事項であり、満たす必要のある難しいルールや要件ではないことに注意することが重要です。 また、レポートが示唆することをすでに実行している可能性があり、ツールがそれをキャッチしなかった可能性があることを認識してください。

Webページの読み込みを高速化し、ユーザーエクスペリエンスを向上させるために変更を加える必要があると判断した場合は、いくつかの一般的な方法があります。

ブランドはどのようにしてWebページを高速化できますか?

上記のツールは、簡単に修正できる主要なページの問題を確認するのに非常に役立ちます。 それでは、ここでそれらの修正のいくつかに対処するために少し時間を取ってみましょう。

画像を最適化する

画像が必要以上に大きくないこと、正しいファイル形式であり、Web用に圧縮されていることを確認してください。 25%のページは画像とテキストを圧縮することで250KB以上を節約でき、10%は1MB以上を節約できます。 ビデオに関しては、それを除外するか、サーバーではなく別のプラットフォーム(YouTubeやVimeoなど)でファイルをホストします。

非同期でロード

非同期ロードを選択すると、要素を順次ではなく同時にロードして、ページのロード速度の遅延を防ぐことができます。

CSS、JavaScript、およびHTMLを縮小する

スペース、コンマ、その他の不要な文字を削除し、コードコメントを削除し、フォーマットを最小限に抑えることで、コードを最適化します。

リダイレクトを減らす

ページが別のページにリダイレクトされるたびに、訪問者はHTTP要求/応答サイクルが完了するまでさらに長く待たなければならないため、リダイレクトを減らすことは大きな違いになります。

ページをキャッシュする

ブラウザのキャッシュとは、誰かがサイトに再度アクセスしたときに、ブラウザがページ全体をリロードする必要がないことを意味します。 スタイルシート、画像、JavaScriptファイルなどの情報をキャッシュすることで、サーバーへのリクエスト数を減らし、ページの読み込み時間を大幅に短縮します。

サーバーの応答時間を改善する

サーバーの応答時間は、トラフィックの量、各ページが使用するリソース、サーバーが使用するソフトウェア、ホスティングソリューションなどのさまざまな要因の影響を受けます。 サーバーの応答時間を改善するには、データベースのクエリやルーティングが遅い、十分なメモリが不足しているなど、パフォーマンスのボトルネックを探します。

ニーズに合ったページスピードツールを選択してください

使用するツールの決定は、最終的には、サイトで追跡および測定するメトリックに依存します。 機能の違いにもかかわらず、それぞれがサイトの速度が遅い可能性のある領域を特定し、サイトを高速化するための洞察と推奨事項を提供する上で大きな価値を提供します。

高速読み込みのクリック後のランディングページを設計する場合、AMPに匹敵するものはありません。 独自のフレームワークと最小限のHTMLにより、AMPのクリック後のランディングページを即座に読み込むことができ、優れたユーザーエクスペリエンスを提供します。 Instapage AMPビルダーを使用すると、デジタルマーケターは、今日デモをリクエストすることで、高速読み込みをすばやく簡単に作成および公開できます。

AMPポストクリックランディングページのデモ