Prioritising user experience will make customers want to spend longer on your site and buy more. With the introduction of Web Vitals, it’ll also directly improve your search engine rankings.
Web Vitals are the latest tool that Google have released that aim at capturing user experience in a measurement. They were first announced by Google back in April 2020 but have only started to be implemented this year. In May 2021 they were incorporated into Google’s ranking algorithms, and from June they have started to be rolled out to the public. Previously, Google gauged user experience by looking at whether a site was mobile-friendly, offered HTTPS, and was free of intrusive interstitials. The Web Vitals now form a fourth factor for grading page experience.
Google’s Web Vitals are split into two categories - Core Web vitals and non-core Web Vitals. Core Web Vitals apply to all pages, and are a confirmed ranking factor in search engine results. While Google have said that the specific metrics are likely to change, the current Core Web Vitals focus on loading, interactivity, and visual stability as the three core aspects of user experience. The non-core Web Vitals serve to supplement the Core Web Vitals and can help when dealing with specific issues, but the primary focus of Google is on the core set.
Why are Core Web Vitals important?
It’s easy to get overwhelmed by the number of metrics and ranking signals that modern search engines use. From bounce rate to referring domains, it would be understandable to see Web Vitals as yet another metric and let it fall by the wayside in your digital marketing strategy. However, Core Web Vitals are worth caring about because user experience is increasingly important to both visitors and search engines.
Compared to the previous metrics for gauging user experience, the new Core Web Vitals are user-centric. They attempt to capture a more accurate picture of what real visitors to your website will encounter. Improving them is therefore likely to make a big difference to how visitors experience your site. This is important: faster, smoother pages attract more people and retain them for longer than pages which are hard to use. When page loading times increase from one second to five, the chances of a visitor bouncing increase by 90%. The probability of conversion drops by as much as 95%. Put simply, better user experience leads to happier visitors who are more likely to buy a product.
Human visitors aren’t the only ones who like fast loading pages. As mentioned earlier, Core Web Vitals have been incorporated into Google’s ranking algorithm. Improving your Core Web Vitals isn’t just giving a better experience to customers, therefore - it’s also directly helping your site rise up the search engine rankings. Having a better user experience is also likely to impact other factors that search engines use to rank pages, like bounce rate and dwell time, by retaining visitors for longer. There’s some indication that Google are preparing to make user experience an even more important factor in search engine rankings, so focusing on Core Web Vitals is likely to pay dividends.
The Core Web Vitals in Detail
There are currently three metrics that make up the Core Web Vitals. Each metric focuses on a different aspect of the three fundamental areas of user experience: loading, interactivity, and visual stability.
Largest Contentful Paint
Largest Contentful Paint (LCP) measures how long the site takes to load, from the point of view of the visitor. It measures the time for the largest element to load on the screen. If your site is predominantly text and images, the largest element will typically be the largest image on the site.
LCP improves on previous metrics for measuring loading performance by capturing the point at which the site is ‘loaded’ from the point of view of the user. Previous metrics, like First Contentful Paint (FCP) only measured the time for the first piece of content to load. At this point, however, the site may still be virtually a blank screen for the user. LCP captures what a human visitor will see. It doesn’t require the page to be completely loaded, but the majority of the content will be there.
Google’s guidelines suggest that an LCP of under 2.5 seconds is good. Anything over 4 seconds is a poor result that is probably having a negative effect on user experience for your site.
To improve your site’s LCP, there are a few things you can try. The most obvious is to remove or optimise large page elements: compressing an image can make it load dramatically faster, often with little noticeable difference in quality. Another easy fix is to upgrade or optimise your web host, if possible, which will give you better load times overall. In addition, consider caching some assets if the page does not need to change on every request.
First Input Delay
First Input Delay (FID) focuses on the interactivity of the site. It measures the time it takes for the page to process a user’s input, whether that be clicking a menu option or inputting a password. FID captures the input delay between the user’s input and the start of the event processing, not the time the site spends processing the request.
FID only captures the delay from the first input. It also only counts discrete actions like clicks or key presses, not scrolling or zooming. This means that FID will be more important to some sites than others. Login pages and navigation pages are two examples of pages where FID will be impactful on user experience. On the other hand, it will probably be less important for static blogs. However, FID will matter to all pages to some degree if they have a navigation bar with links to other parts of the site.
Google’s recommendations are that sites should have a FID of 100 milliseconds or less. Over 300 milliseconds indicates your site is taking an abnormally long time to process requests.
The main cause of a high FID is normally heavy JavaScript execution. If the site is busy executing JavaScript, it can’t respond to user interaction. Optimising this will reduce the FID score.
Cumulative Layout Shift
Cumulative Layout Shift (CLS) focuses on the last of the three aspects of user experience - visual stability. It measures the degree to which page elements move about as the page loads, or users interact with it. This can be a significant source of frustration. If a large piece of content loads last and pushes the rest of the site down, it can cause users to click something they didn’t intend to.
Unexpected movement like this often happens when resources are loaded asynchronously. If a piece of content loads in with unspecified dimensions, it can cause the rest of the page to shift to adapt to it. A common culprit for this is third-party ads. Another reason may be if new content is dynamically added into the site.
CLS is measured using layout shift scores, which are calculated for each element using the size and distance that it shifted. CLS used to be measured as the sum total of all the individual layout shift scores, but this was decided to be unfair to sites which were open longer. Now, the layout shifts are grouped into bursts, where one or more shifts occurs with less that one second between them. The CLS scores the total layout shift score of the largest burst.
A CLS of under 0.1 is considered a good score for a site. Over 0.25 is poor. The easiest way to improve the CLS score is to always make sure that image and video elements have size attributes or space is reserved for them. This allows the browser to allocate the correct amount of space while the image is loading, preventing other elements from having to shift later.
The Future
Core Web Vitals are still in their infancy, and Google has signalled that they’re likely to change. We’ve already seen this once, with the tweaking of CLS. It’s likely that the other Core Web Vitals will also see some small changes. In addition, it’s probable that the set of Core Web Vitals is likely to grow. The three inaugural metrics represent just the beginning, so more are likely to be added with time.
The importance of user experience to SEO is only going to grow as Google and other search engines get better at quantifying what makes a good experience, so using the Core Web Vitals and prioritising user experience will become an important part of digital marketing. If you want help with this for your site, get in touch with us.