Earlier this year, Google made an update to their algorithm that introduced a new ranking factor based on page experience. This update was put into effect to reward fast-loading pages.
In order for a website to gain this reward, it would have to pass three metrics, collectively called Core Web Vitals. Here’s a full breakdown of what exactly these metrics are, why they’re important for successful online business and how to pass them.
What are core web Vitals?
Google has been pushing for website owners to improve their overall User Experience (UX) by rewarding them with higher search rankings.
With the algorithm update introducing page experience, the focus is on the user’s experience while loading a webpage.
Some factors that determine page experience include:
- Loading performance – How quickly does the page’s content load?
- Responsiveness – How quickly can the page respond to a user’s input?
- Stability – Does the content move around while loading a page?
Core Web Vitals are the metrics that score a website based on the above factors. There are 3 of these metrics and
they contribute towards ensuring a good page experience.
The 3 Core Web Vitals are:
-
Largest Contentful Paint (LCP)
This is the amount of time that it takes for the largest element of content on the page to load. These can be images, videos or even written content.
For example, if the page is made up of written content and a large image, the LCP would measure how long it takes for the image to load. The faster the image loads, the better the page experience will be for the user because the site will appear as fast.
But, the LCP will shift to the next piece of large content once the first one has loaded. So, once the large image loads, the second biggest element becomes the LCP and so forth.
Google advises that the LCP should load within 2.5 seconds. If it’s between that and 4 seconds it’s in need of improvement. Anything more than 4 seconds is considered poor performance.
-
First Input Delay (FID)
This is time taken by the browser to react to a user’s input, for example, a tap, click or key press. The quicker the browser responds, the better the page responsiveness will be. Sometimes eve a slight delay, in even a small action such as clicking on a button, can make your entire site seem unresponsive or slow to the user.
In order for your site to pass the FID metric as responsive, it has to have an FID of no more than 100 milliseconds. Anything between that and 300 milliseconds and the responsiveness will need improvement. Above that, the site is considered as performing poorly.
-
Cumulative Layout Shift (CLS)
The third metric measures how stable the page contents load i.e. do they move around the page and how much while loading?
Imagine this scenario:
A user is on a website and they think the page has loaded. They tap or click on a button or link, but there’s still something else loading in the background. As they assume that they’re clicking on the button or link, it moves to a different spot on the page. The user ends up clicking on another element.
How frustrated is the user going to be? Probably very. Even worse if they end up clicking on an ad.
This metric measures any shift in a page’s layout and how severe those movements are. It does this by comparing the frames of each shift. If the shift is below 0.1, it’s considered to be of a good standard. Anything between that and 0.25 could do with some improvement, and above that is of a poor standard.
How can I measure Core Web Vitals?
There are a few ways to monitor and keep track of your Core Web Vitals. Using these tools can help you improve the performance of your site and better its page experience. This can also help your website’s Search Engine Optimisation (SEO) and rankings.
The following tools can be used for measuring Core Web Vitals:
This is a tool that reports on the performance of a website based on both real-user experience and simulated data.
PSI also provides suggestions for improving website performance and can estimate how much faster a page will load if those improvements are made.
This tool provides information that will help optimise a website’s speed by telling you which pages have good or poor performance and which need improvement. One of the ways it does this is by monitoring your site’s server errors and loading issues so users know why they may be loading slower.
This is a tool built by Google. It performs five website audits on:
- accessibility
- performance
- SEO
- Progressive Web Apps
- best practices
It simulates a user accessing your site and then gives you a score for each of the above. It also lets you know your Core Web Vitals’ metrics and possible solutions to improve them.
How can I improve my Core Web Vitals?
Once you’ve run tests to see how well your website is performing, there are a few things you can implement to improve your page experience.
- Reduce JavaScript (JS) execution
If your website has a poor FID score, optimising the JS execution will reduce the page’s loading time. It also helps the browser use up less memory by stopping an JS that might slow down the page.
One way to optimise JS execution is to defer unused JS. You can do this with code splitting which is to separate one JS bundle into smaller pieces.
- Optimise images and embeds
Large images are usually the LCP. Ensuring that the correct size is specified in the CSS and that they’re compressed well will help speed up their load time.
The browser will reserve that space for the image while loading the page. This can stabilise the images and improve your CLS score.
- Improve server response time
Helping the server handle requests and serve files better will make your site faster. You can do this by upgrading your hosting plan, using a recent version of PHP and upgrading your databases to make sure they’re running smoothly.
Final thoughts
Google is trying to prioritize the overall UX by encouraging web admins to think about page experience. Fixing site speed issues is one of the ways you can improve page experience and that’s why Core Web Vitals are so important to monitor. It may be a bit overwhelming, but that’s why we’re here to help. We can help keep track of your website’s performance and SEO rankings, just get in touch.
