Core Web Vitals: user experience as a Google ranking factor
While a website’s content and reputation have historically been the predominant criteria for ranking sites on the SERP (Search Engine Results Page), around May 2020 Google introduced a measure of your site’s user experience.
In short, their aim is to ensure that your site loads quickly, is easy to use and is stable. To achieve this, they mainly use 3 metrics:
- Largest Contentful Paint (LCP): the time it takes for the largest element on the page (an image or text, for example) to be displayed by the browser;
- First Input Delay (FID): the delay between the moment a user interacts with a page and the moment the page reacts to this interaction;
- Cumulative Layout Shift (CLS), which evaluates the visual stability of the page by assessing whether unexpected gaps are created during loading (with ads or images, for example).
Google uses these different metrics as the most important ranking factors in search results. So it’s vital to take them into account: every site owner now needs to think about its ergonomics.
3 of the most common SEO mistakes for the user experience of a site
Saying that a site must meet these criteria is one thing, but knowing what they really mean is quite another. During our technical audits, we notice that several technical errors affecting Core Web Vitals are frequently recurring.
1) Avoid heavy images slowing down page loading
The main error when analysing websites is the weight of images, which has a serious impact on loading speeds. Take the Le Soir newspaper site, for example.
Analysis of the main page reveals several problems:
- Off-screen images are not deferred: by using attributes such as lazy-load, we can ensure that images that are further down the page and therefore not directly displayed don’t load right away. This improves LCP: the browser can use more resources to display the main content of a page.
- Images are not in a new-generation format: .WebP’s images are much lighter than .JPEG or .PNG images, for example. Converting images with a tool like CloudConvert is therefore more than beneficial for improving page loading.
- Images are incorrectly sized: there’s no point in putting an image in a high resolution if its maximum resolution isn’t displayed. Be sure to resize your images to avoid lengthening page loading times.
2) Provide spaces in the website code for large elements
Often, in the HTML code of a site, space for large elements such as images or advertising banners is not provided. This causes layout mismatches and has an impact on CLS.
To sum up, rather than simply placing the image without much thought, you need to anticipate where the element is going to fit and give it an explicit width and height.
For example, this HTML image has no explicit width and height:
<img src=”exemple.jpg” alt=”Exemple d’image sans width ni height explicites”>
Whereas this one does:
<img src=”exemple.jpg” alt=”Exemple d’image avec des dimensions explicites” width=”500″ height=”300″>
3) Don’t neglect website’s mobile version
While the criteria are identical on smartphones and PCs, Google tends to be much stricter on Core Web Vitals for the former.
The reason for this is that Google takes into account that connection speeds and the fact that there’s less space on mobiles make navigation potentially more complicated. So you need to pay particular attention to the mobile version of your site.
In the past, Google used an API to define whether a site loaded correctly on mobile or not. However, this API tended to give incorrect information and disappeared from Search Console in December 2023.
For a site to be optimized for smartphones in Google’s eyes, you therefore need to follow the same recommendations available in their documentation, but also pay attention to a few details such as :
- text size,
- the distance between links,
- whether buttons or links are large enough to be clickable.
How can I check that my site complies with Core Web Vitals?
The best way to find out whether your site complies with the Core Web Vitals is to use PageSpeed Insights. This free tool developed by Google can scan a URL and give you an outline of the elements that pose problems for the ergonomics and loading speed of a page.
However, don’t forget that this list is not exhaustive, and that Google’s algorithm changes regularly. For example, by March 2024, FID will be replaced by INP.
What is INP (Interaction to Next Paint), Google’s future metric for 2024?
INP: or Interaction to Next Paint: works in more or less the same way as FID (First Input Delay), except that it measures all interactions throughout a page’s lifetime.
The difference between now and 2024 is that your page’s performance will have to remain stable throughout its lifetime.
Ask our agency for a SEO audit
To ensure that a site complies with Google’s prerogatives, there are many elements to take into account, and Core Web Vitals is just one of them.
PAF! handles projects in a wide variety of fields and can help you with all aspects of SEO, from technical optimization to the creation of quality content.