COLUMN

  1. ホーム
  2. 販促支援コラム
  3. Core Web Vitals(コア ウェブ バイタル)の新しい指標INP(Interaction to Next Paint)とは?

2024.04.10Web

Core Web Vitals(コア ウェブ バイタル)の新しい指標INP(Interaction to Next Paint)とは?

Webコミュニケーション事業部の安田です。
 
2024年3月からGoogleのページを評価する指標であるコアウェブバイタルのFID(First Input Delay)がINP(Interaction to Next Paint)に変わりました。INPとはどのような指標でどのような対策が必要なのかをお話したいと思います。

INP(Interaction to Next Paint)とは?

INPとは、ページ内で操作した際の応答の良さを評価します。
操作とは、タップ、クリック、キーボードからの入力のことです。
応答の良さとは、操作の結果が表示されるまでのことをいいます。
例えば、ECサイトの商品ページで「カートに入れる」ボタンをクリックして、「カートに追加しました」のポップアップが表示されるまでの時間が短ければ応答が良く、長ければ応答が悪いとなります。

INPの確認方法

WEBサイトにINPの問題があるかを確認するにはいくつか方法があります。
「Google Search Console」「PagaSpeed Insights」「Chrome拡張機能(Web Vitalsなど)」です。
まずはSerch Consoleで問題を確認し、ページごとに確認したいならPagaSpeed Insightsを利用するのが良いと思います。
※Chromeの拡張機能をいれている場合はそれでも問題ありません。

INPの改善方法

サイトやページごとに原因が異なるため対応方法も異なりますが一例を紹介したいと思います。
まず、対象となるページをSerch Console「ウェブに関する主な指標」で確認します。

対象ページで原因を特定する必要があります。
理想はweb-vitals JavaScriptで計測が良いと思いますが準備の難易度が高いです。
簡易的にはGoogle Chromeで検証「Lighthouse」を利用するのが良いと思います。
対象ページで右クリックし「検証」を選択、「Lighthouse」でモード「測定期間」、デバイスは検証したいデバイスを選択して「測定期間を開始」をクリックします。

「測定期間を開始し、ページを監査しています」が表示されたら対象ページを操作して、「想定期間を終了」をクリックします。
操作はJavaScriptを利用していてタップ・クリックで表示が変わるものを対象とするのがいいでしょう。例えばスマホページのメニューです。
分析結果が表示されたら少し下に移動して「次に関連する監査を表示」で「INP」を選択して診断結果を絞り込みます。

残った結果がINPに関係していますので対応を検討してください。

最後に

INPで求められているのは技術的なことが多いので専門家に調査や対応を依頼するのがいいと思います。
相談などございましたらお気軽にご連絡ください。

投稿者

安田

WEBコミュニケーション事業部

安田

東具のWEBとIT全般を担当しています。犬と猫が好きです。

まずはお気軽にご相談ください

06-6965-3331

平日 9:00~17:00まで受け付けております。

お問い合わせ

まずはお気軽にご相談ください

最新のセールスプロモーションカタログをお届けします。

資料請求

POPツールカタログはこちら