SEO Dashboard update : Core Web Vitals

This week, we launched a new page on our SEO dashboard to help you track your Web Core Vitals. But why did we choose to add this page, and how did we make it ?

Web Core Vitals are a group of web performance standardised metrics defined by Google to have an impact on the search result page ranking.

The only way to analyse these metrics for now is by using extension tools like “LightHouse” or “Pagespeed”. Google did make a dashboard few years ago to keep an eye on all this metrics but it’s not updated and will only work if you’re among the most visited websites in the world.

This dashboard will work for every website with Google analytics tracking and Core Web vitals tracking in Google Tag Manager, more on that at the end of this article.

How does it look ?

The 6 main KPIs have been directly defined in the dashboard with the good performance categorisation for each one of them.

More on the KPIs:

LCP - Largest Contentful Paint

It measures the time it takes for the largest visible image or text block in the viewport to render, starting from when the user first navigates to the page. A good LCP score is crucial for user experience, with the goal being 2.5 seconds or less. To achieve this for the majority of users, it's recommended to aim for the 75th percentile of page loads, considering both mobile and desktop devices.

what are good lcp values

INP - Interaction to Next Paint

INP is a metric that evaluates a page's overall responsiveness to user interactions by tracking the latency of all clicks, taps, and keyboard actions during a user's visit. The final INP value is determined by the longest interaction observed, excluding outliers. The latency of an interaction is defined by the duration of the longest event handler group, measured from the start of the user interaction to the moment the browser renders the next frame.

What constitutes a good INP score? While it's challenging to label responsiveness metrics as simply "good" or "poor," it's important to promote practices that enhance responsiveness while acknowledging the variability in device capabilities.

To ensure a responsive user experience, aim for the 75th percentile of page loads in real-world conditions, considering both mobile and desktop devices:

  • An INP of 200 milliseconds or less indicates good responsiveness.

  • An INP between 200 and 500 milliseconds suggests that responsiveness needs improvement.

  • An INP above 500 milliseconds indicates poor responsiveness

what are good cls values

CLS - Cumulative Layout ​Shift

CLS measures the largest burst of layout shift scores caused by unexpected layout changes throughout the entire lifecycle of a page.

A layout shift occurs whenever a visible element moves from one position to another between rendered frames. (This guide will explain how individual layout shift scores are calculated.)

A burst of layout shifts, referred to as a session window, happens when multiple layout shifts occur in quick succession, with less than 1 second between each shift and a maximum duration of 5 seconds for the entire window.

The largest burst is the session window with the highest cumulative score of all the layout shifts within that period.

What is a good CLS score? To deliver a good user experience, aim for a CLS score of 0.1 or less. To achieve this target for most users, it's recommended to measure the 75th percentile of page loads, considering both mobile and desktop devices.

FCP - First Contentful Paint

First Contentful Paint (FCP) measures the time from when a user first navigates to a page until any part of the page's content is displayed on the screen. This content can include text, images (including background images), <svg> elements, or non-white <canvas> elements.

Key Point: FCP also accounts for any unload time from the previous page, connection setup time, redirect time, and Time To First Byte (TTFB). These factors can significantly affect FCP when measured in the field, leading to differences between field and lab measurements.

In a loading timeline, FCP occurs when the first text or image elements are rendered to the screen, even if not all content has loaded. It's important to distinguish FCP from Largest Contentful Paint (LCP), which measures when the main content of the page has fully loaded.

What is a good FCP score? To ensure a good user experience, aim for a First Contentful Paint of 1.8 seconds or less. To meet this target for most users, it's recommended to measure the 75th percentile of page loads, considering both mobile and desktop devices.

what are good fcp values

FID - First Input Delay

First Input Delay (FID) measures the time from when a user first interacts with a page—such as clicking a link, tapping a button, or using a custom JavaScript control—until the browser begins processing the event handlers in response to that interaction.

What is a good FID score? To deliver a good user experience, aim for a First Input Delay of 100 milliseconds or less. To ensure you're meeting this target for most users, it's recommended to measure the 75th percentile of page loads, considering both mobile and desktop devices.

TTFB - Time To First Byte

Time to First Byte (TTFB) measures the time between a resource request and the arrival of the first byte of the response. TTFB includes the following phases:

  • Redirect time

  • Service worker startup time (if applicable)

  • DNS lookup

  • Connection and TLS negotiation

  • The time from the request until the first byte of the response is received

Reducing latency in connection setup and backend processing can help lower TTFB. Since TTFB occurs before user-centric metrics like First Contentful Paint (FCP) and Largest Contentful Paint (LCP), it's important that your server responds quickly to navigation requests. Ideally, the 75th percentile of users should experience an FCP within the "good" threshold. As a general guideline, aim for a TTFB of 0.8 seconds or less.

what are good ttfb values

What’s needed ?

All you need to connect this dashboard is a Google analytics tracking. The Core Web Vitals are not natively tracked so you’ll have to make a quick GTM configuration but no worries, it’s a 10 min tutorial and it’s available here :

https://www.queriestation.com/blog/seo-how-to-track-your-core-web-vitals-gtm-ga4

If you have any question regarding the tracking or data in general, join our community on Discord !

Previous
Previous

Showcase : New theme for the SEO Dashboard

Next
Next

The SQL Starter Pack: (+Cheatsheet)