Google’s New Core Web Vitals Metric: How To Improve Interaction To Next Paint

Google’s New Core Web Vitals Metric: How To Improve Interaction To Next Paint

Google’s New Core Web Vitals Metric: How To Improve Interaction To Next Paint?

Learn how Core Web Vitals are changing and what you can do to score well on Interaction to Next Paint, Google’s new page experience metric.

In This Guide

1.What Are Core Web Vitals & What’s Changing?

2.What Is Interaction To Next Paint?

3.What Should My Interaction To Next Paint Be?

4.What Causes Slow Interaction To Next Paint (INP) Scores?

5.How To Optimize Interaction To Next Paint

6.The Easy Way: Real User Monitoring (RUM)

7.Easily & Consistently Monitor Interaction To Next Paint

What Are Core Web Vitals & What’s Changing?

Core Web Vitals (CWV) are a set of three user experience metrics that?became a ranking signal in June 2021.

The three CWV metrics are:

  • Largest Contentful Paint: How quickly does the main page content show up?
  • Cumulative Layout Shift: Is the page layout stable after loading?
  • First Input Delay: How quickly does the page respond to user input?

However, in?March 2024,?Interaction to Next Paint (INP)?will replace First Input Delay.

What Is Interaction To Next Paint?

The?Interaction to Next Paint (INP) metric?tells you what interaction delays visitors’ experience when using your website.

INP measures how much time elapses between a user interaction (like a click or touch input) and the “next paint” that visually updates the website.

For example, if a user clicks a button and then the page hangs for half a second before updating, the INP value will be 500 milliseconds.

The browser spends that time running website code and rendering the updated page.

Why Did Google Change First Input Delay To Interaction To Next Paint?

The old First Input Delay metric often failed to identify poor user experiences when they happened.

Interaction to Next Paint (INP) improves on First Input Delay in two ways:

  • INP considers the whole time between the user interaction and the next visual update on the page. First Input Delay only considers a fraction of the overall delay.
  • INP considers all page interactions and usually reports the one with the largest delay. First Input Delay only looks at the first interaction.

What Should My Interaction To Next Paint Be?

To provide a good experience and meet Google’s Core Web Vitals criteria your INP needs to be?below 200 milliseconds.

Most sites found meeting the First Input Delay threshold fairly easy, with?93% of mobile sites?providing a good experience.

In contrast,?only 64% of sites are currently doing well on the Interaction to Next Paint metric.

You can use a free tool like?PageSpeed Insights?or?DebugBear?to see how well your site does. The DebugBear “Web Vitals” tab also shows you a history of how your INP score has changed over time.

What Causes Slow Interaction To Next Paint (INP) Scores?

Ongoing CPU processing on the page that prevents the browser from showing updated page content is what causes slow INP scores.

So, let’s break down where you should look for potential INP issues.

The overall INP value is made up of three different components that add up to the overall score:

  • Input Delay.
  • Processing Time.
  • Presentation Delay.

How To Optimize Interaction To Next Paint

If you’re not sure what pages on your website need to be optimized, a good place to start is the?Core Web Vitals report in Google Search Console. Here you can see specific URLs that are slow.

Once you know what pages to optimize there are a few approaches to identifying slow interactions on your website:

  • Using the INP Debugger
  • Testing manually in Chrome DevTools
  • Creating user flows in Lighthouse
  • Using real user monitoring (RUM)

Consistent Monitoring:

  • Monitor optimizations with RUM to promptly see impacts.
  • Track performance across your website and identify high-traffic, problematic pages.

#CoreWebVitals #UserExperience #PageSpeed #GoogleRanking #WebPerformance #INPMetric #PageExperience #OptimizeWebsite #WebDevelopment #GoogleSEO #UXMetrics #RUM #WebsiteOptimization #GoogleSearchConsole #LargestContentfulPaint #CumulativeLayoutShift #FirstInputDelay #WebVitalsUpdate #GoogleMetrics






要查看或添加评论,请登录

社区洞察

其他会员也浏览了