インタラクティブになるまでの時間（TTI）とは？PageSpeed Insightsでの改善方法
Googleが提供する無料のWebページ診断ツール「PageSpeed Insights」。URLを入力するだけでページの読み込み速度を数値で確認でき、改善ポイントも教えてくれます。
診断結果に表示される項目のひとつ「インタラクティブになるまでの時間（TTI）」について、意味と具体的な改善方法をまとめました。
「インタラクティブになるまでの時間」とは？
「インタラクティブになるまでの時間（TTI：Time to Interactive）」とは、ページが読み込まれてからユーザーが実際に操作できるようになるまでの時間のことです。
たとえばページが画面に表示されていても、ボタンをクリックしても反応しない・スクロールがもたつくといった状態はTTIが高い（＝操作できるまでに時間がかかっている）状態です。ページの見た目が出ていても「使える状態」になるまでには差があることを意識しておきましょう。
PageSpeed InsightsではTTIが長いほど「改善が必要」と判定されます。特にスマートフォンでの閲覧時に影響が出やすく、離脱率の上昇にもつながります。
「インタラクティブになるまでの時間」の改善方法
TTIを短縮するための主な対策を紹介します。まずはPageSpeed InsightsでURLを診断し、指摘された項目から優先的に対応するのがおすすめです。
まずは速度をチェック
PageSpeed Insightsに診断したいページのURLを入力します。結果画面には「パフォーマンス」スコアと改善提案がリスト表示されるので、スコアと各項目を確認しましょう。
スコアの目安は以下のとおりです。
| スコア | 評価 |
|---|---|
| 90以上 | 良好（緑） |
| 50〜89 | 改善が必要（オレンジ） |
| 49以下 | 低速（赤） |
画像を最適化する
画像ファイルのサイズが大きいと、それだけでTTIが悪化します。対策は主に2つです。
- WebP形式に変換する（JPEGより約30%軽量）
- TinyPNGなどのツールで圧縮してからアップロードする
WordPressを使っている場合は「EWWW Image Optimizer」などのプラグインで既存画像をまとめて変換できます。
不要なJavaScriptを削減する
TTIに最も大きく影響するのがJavaScriptの読み込みです。使っていないプラグインや外部スクリプトが多いほど、ページが「操作できる状態」になるまでの時間が延びます。
- 使用していないプラグインを無効化・削除する
- JSファイルを遅延読み込み（defer・async属性）に変更する
- 「Asset CleanUp」などのプラグインで不要なスクリプトを除外する
サーバーの応答速度を改善する
サーバーの応答時間（TTFB：Time To First Byte）が遅いと、ブラウザがデータを受け取り始めるまでに時間がかかります。PageSpeed Insightsで「サーバーの応答時間を短縮してください」と表示された場合は、サーバー自体の見直しが必要です。
共有レンタルサーバーを使っている場合、上位プランへの変更や高速なサーバーへの乗り換えが有効です。とくにエックスサーバーは国内シェアが高く、表示速度の改善実績も多く報告されています。
ブラウザキャッシュを活用する
一度アクセスしたユーザーの端末に画像やCSS・JSファイルを保存しておく仕組みが「ブラウザキャッシュ」です。2回目以降のアクセスで同じデータを再取得せずに済むため、TTIが大幅に改善されます。
WordPressでは「W3 Total Cache」「WP Super Cache」などのキャッシュプラグインを使うと設定が簡単です。
CSSとJSの読み込みを最適化する
レンダリングをブロックするCSS・JSファイルがあると、ページの表示が止まったような状態になります。
- CSSは<head>内に、JSは</body>直前に配置するのが基本
- 外部フォント（Google Fontsなど）は必要なウェイトだけ読み込む
- 「Autoptimize」プラグインでCSS・JSをまとめて最小化できる
まとめ
「インタラクティブになるまでの時間（TTI）」はページが実際に操作できる状態になるまでの時間を指します。スコアを改善することでユーザー体験が向上し、直帰率の低下やSEOへの好影響も期待できます。
まずはPageSpeed Insightsで現状のスコアを確認し、指摘された項目から順番に対応していきましょう。一度に全部やろうとせず、影響の大きい項目（画像・JS・サーバー）から手をつけるのが効率的です。
