Core Web Vitals : how to analyze the performance of your website?
08 February, 2022
The statement of your Conversion Rate Optimization and your data expertise teams is without appeal: when users visit your website,...
Stay tuned thanks to our Newsletter
“You should go spear-finding with data. You should not be throwing a net out into the ocean, pulling everything in and hoping your answer is in the net” once said Andréa Mallard, CMO of Pinterest, during the MRS conference in 2019.
If your data lakehouse looks more like junk than a Russian dolls collection, you may need to take a closer look at Core Web Vitals. If you need to learn from the data collected to better understand the UX of your website, you don’t need to collect every kind of data. That would be too messy and time-consuming.
You’d rather take a look at our list of KPIs that allows you to monitor your website Core Web Vitals to stay on course. Want to know which tools can help you do so? How to monitor your Core Web Vitals?
Before getting to the heart of the matter, it’s important to recall the metrics that you should monitor. Basic KPIs are fine but these metrics will help you better understand your website performance and improve its UX. Google chose to emphasize 3 metrics. Let’s analyze them one by one:
Loading time is directly related to Largest Contentful Paint. As Google pointed out in 2018, if your page load time goes from:
LCP is nothing you should take lightly. Largest Contentful Paint (LCP) measures page loading time. In concrete terms, LCP estimates the time it takes for the main content of your page to be displayed on the users’ device.
You always need to keep an eye on your Largest Contentful Paint since loading time is a primary ranking factor (SemRush) and source of user’s satisfaction.
Why do customers hate waiting? Because the customer is the king. Interactivity is also linked to delay. Measured by First Input Delay, interactivity or responsiveness is essential as it makes your page more engaging.
Many websites, such as Starbucks and its “coffee at home” page (it helps you pick your perfect coffee after answering 4 questions), designed pages to make you feel special, and it works!
Well, First Input Delay (FID) analyzes the interactivity, also known as responsiveness, to user input. Put another way; it measures the delay between the page interaction of the user (click on a link, button…) and the answer of the browser.
The longer it is, the more frustrated the users.Do not neglect the time it takes for the browser to display the webpage answer. A good FID should be100 milliseconds or less.
Cumulative Layout Shift helps you measure the visual page stability of your page. A CLS score of less than 0,1 seconds is considered good.
Cumulative Layout Shift (CLS) is responsible for page stability. It analyzes the unexpected shifts of pages when pages are loading. Page instability can also bring about as much frustration as a delay. If you want to learn more about those metrics, read Google’s full report on Core Web Vitals.
Now that you know which Core Web Vitals are better being tracked, you may want to know how to track them. There are so many tools you should try to monitor your Core Web Vitals, but to stay focused on the essential, we build a shortlist of 3 effective tools that you should adopt.
Lighthouse is a free Google extension that allows you to monitor your Core Web Vitals (on the left screen)… but not only! It also gives you precise enhancements (on the right screen) that you can implement to improve your UX.
This tool gives you a free detailed report on your web pages, with a list of improvements in a very synthetic way. You don’t have to bother thinking about how to better your performance score, all you need to do is act as Lighthouse suggests
it doesn’t take the purpose of your page into consideration. Let’s say that Lighthouse is a good start but for deeper understanding, you’d better try another tool.
PageSpeed Insights (PSI) is a Google-free app that monitors your website performance, providing lab and field data about your pages.
This tool ranks your 3 Core Web Vitals by colors. Green is for good performance, orange for improvement required and red for poor performance. Here is an example of what your PageSpeed Insights report could look like:
The report provided by this tool is complete and very deep in understanding. In addition to your page global performance score, PageSpeed Insights gives you a detailed analysis of your 3 Core Web Vitals performance. Start now by downloading the extension!
This tool is less easy to handle than Lighthouse for instance. It’s made for people who are skilled in coding. If you want to read more about PageSpeed Insights implementation, read the Google tutorial page.
This tool is slightly different from the others. It is a worldwide database that reviews users’ web browsing experiences. If it does not help you monitor your own website’s performance, why do you need it?
Below you can see how the Google Chrome UX Report looks like for a specific metric which is FCP:
This tool “contributes to the final user experience” as Google said while they first introduced this report at the 2017 Chrome Web Summit Conference. It helps you compare the UX of your pages to the UX of other websites so that you can rank your performance on a local scale.
What metrics does it track? It does not only track the 3 Core Web Vitals. It also includes details about websites’ First Contentful Paint, Onload, Time to First Byte...
It helps you compare your performance to other websites. You can also get some local user experience data to better the customization of your UX on a global scale.
To have access to Chrome UX Report, a BigQuery account is required, which means that if you’re not familiar with this platform, it might be uncomfortable for you to read through. Get started with the Chrome UX Report anytime! You can join the report and download your performance report.
There are so many Google tools that you might get lost. Start with Lighthouse if you want to get a first global look at your website performance. To deepen your Core Web Vitals analytics, go for PageSpeed Insights and the Google Chrome UX Report, once you master the basics.
You can cross your tool analysis for a better understanding of your Core Web Vitals. Still wondering if those tools can better your metrics monitoring? Let’s have a talk!
By Emma Jeanpierre
26 Jan, 2022