ブロギングライフ

ブログサイト運営関連、AdSenseについての情報などを発信しています。

ページスピードとパフォーマンスを向上させる5つのステップ

ページスピードとパフォーマンスを向上させる5つのステップ

2017年2月6日、Inside AdSense (英語の公式ブログ)に5 steps to improve PageSpeed and boost page performance と言うタイトルの記事が投稿されました。本記事は前の週に投稿されたモバイルのページスピードが極めて重要であることについて書かれた記事に続いて、ページスピードと収益パフォーマンスを向上させるための手法を紹介したものです。本ブログでも先週、ページスピードの重要性の記事を紹介しています。

https://www.blogging-life.com/pagespeed-and-earning-potential/

記事の概要を訳し、コメントを加えて紹介します。

ステップ1: ページスピードが向上するとどの位収益が増えるかを知る

モバイルのスピードを向上させるために時間と労力を注ぐ前に、それがどれ位の価値があるのか知りたいと思います。この便利なツールは、高速のモバイルのエクスピリエンスが、どの位収益をもたらすのかの計算の手助けとなるものです。しかし、このツールはユーザーエクスペリエンスやユーザーロイヤリティは考慮されていません。

ツールはDoubleClickのものですが、単純なものです。投資効果は高いと言うことをシンプルに示す目的で作成されたものと思われます。アメリカ的なコンセプトだと思います。(あまり真面目に捉えるほどのものではないです。スタート前の軽いウォームアップ的な意味合いのものと思われます。)

ステップ2: サイトのスピードを計測する

ツールを使用してサイトの異なる観点での測定を行うことは、改善点・項目を抽出するのに役立ちます。お勧めのツールは以下の通りです。

  • PageSpeed Insights: サイトのパフォーマンスを測定し、スピードとユーザーエクスペリエンスを採点します。改善点も教えてくれます。85以上のスコアが最も望ましいです。
  • Webpagetest: 表示されるページの見える部分の平均速度をスピードインデックスとして表示します。スピードインデックス3000、ロードタイム3秒以内(1-2秒が望ましいです)を目指して下さい。
  • Chrome DevTools: サイトのパフォーマンスをブラウザでリアルタイムで多彩な評価を行うことの出来るツールです。ネットワーク, CPUスピードをシミュレートして、ネットワークのローディングの紹介を検証したり、サイトのコードがページにどの様な影響を与えているのか知ることができます。
  • Mobile-Friendly Test: モバイルのサイトに特化したモバイルフレンドリーの評価、さらにはスピードに関連する要素も詳しく検証します。

ステップ3: 整理整頓を行う – ページのサイズを減らす

以下の様な手段・手法で、ページのサイズを減らします。

  • ロードタイムを最適化するため、50以下のリクエストと1000バイトを目標とします。
  • 画像を効果的な圧縮を行い、ダウンロードされる表示コンテントの優先順位を決めます。

ページ内の広告やトラッカーについて評価・検討を行います。

  • ページ上のピクセルやその他の要素の帯域幅と遅延の影響をツールで測定します。(例:Chostery等)トラッカーが十分なメリットをもたらすかなど使用する必要性を評価します。
  • 広告パートナーの特にビデオ広告などについての(表示)遅延を評価し、収益パフォーマンスの低いパートナーは削除します。

ステップ4: ページのロード順を優先順位付けする

当たり前のことですが、最初に表示される画面にロードされる要素の優先順位付けを行うことは、ページ全体のロード時間が変わらなかったとしても、ユーザーエクスペリエンスの向上に繋がります。

  • 第一に最初に表示される画面にロードされる要素の優先順位付けを行う:最初に表示されるコンテントの要素を最小限に抑えます。スタイリング、Java スクリプトロジック、画像のロードは、ダイレクト・インターラクション(最初の表示後のユーザーの動作・関わり)後にアクセスさせるようにロードします。
  • HTTPSとHTTP/2を可動させる: HTTPSをサポートすることは、サイトの信頼性、安全性、本物であることを示し、より良いユーザーエクスペリエンスを提供します。トップ100の三分の一以上のサイトはHTTPSをサポートし、四分の一はHTTPSを標準(デフォルト)にしています。
  • サーバーリクエストを可能な限り制限する:各モバイルページは、平均で214のサーバーリクエストを行っています。それらのいくつかは同時に行われ、いくつかは一回発生した後のみ行われます。サイトのリクエストの一つ一つの提供する利点を理解して評価を行います。

ステップ5: 評価、テストを繰り返す

モバイルへのシフト(移行)は成長を続けています。ユーザーのウェッブ全体での瞬時に表示される(AMPページの)経験も増えています。このことは、モバイルスピードを向上させることは、一回限りの仕事ではなく、常に向上させ評価を行うプロセスが必要であることになります。上記のステップを定期的に行って、改善点の結果を記録し、将来の新しい最適化のテクニックを利用するかの判断を行う時にも利用します。

  • 広告関連のコールを常に継続して評価し、収益パフォーマンスの低いパートナーのものは削除します。
  • 遅延が少ないサードパーティー広告技術パートナーを選びます。
  • かさばるコンテントを削除したり、削減します。
  • データと解析タグをまとめます。
  • AMPやProgressive Web Apps (PWA)などのオープンソースツールの採用を検討します。

この記事で紹介した戦略を実行することは、あなたのビジネスに大きなポジティブインパクトを与える事が可能となります。

基本的な内容ですが、色々参考になるところがありました。実行できるところは、心がけて実行したり、実行可能な事柄について、検討してみようと思います。

本サイトで行ったページスピード向上の関連記事を以下に添付します。

https://www.blogging-life.com/site-speed-enhancement-performance-review/

https://www.blogging-life.com/amp-vs-std-page-speed-comparison/

コメントを残す(承認後表示されます)

*
*
* (will not be published.)

Return Top