Logo
CLOSEMENU

All You Need to Know About Core Web Vitals in 2023

Dan Walton

core web vitals

There is no universal, one-size-fits-all approach to getting your website ranking on Google. Investing in SEO is going to be a different journey for every business – some will fare better than others, and it’s likely that what Google considers ‘best practices’ will change down the line.

However, if Artemis Marketing were to give one snippet of advice on improving your rankings, it would be to look at your site’s content, ability to generate links and the subject of this guide – Core Web Vitals.

What are Core Web Vitals?

Core Web Vitals (CWV for short) are speed metrics that Google uses to measure the user experience of your site.

CWV is made up of three specific factors that Google uses to measure your website’s user experience, which the search engine will provide to you as a ‘page experience’ score.

In simple terms, it’s Google’s way of pointing out how user-friendly your website is. Developers can use CWV to understand how users experience a website.

Components of Core Web Vitals

Each of the metrics within CWV provides specific criteria for different user experience elements within a website. It’s easy to paint a user experience with a broad brush, but the three specific metrics help developers assess different variables into specific pieces, making it easier to identify and fix technical issues.

Largest Contentful Paint (LCP)

In simple terms, LCP assesses page loading performance. Developers can use LCP to determine whether users can find a page useful based on the rendering time of the largest or most significant ‘blocks’.

Page load speed is vital for creating a positive user experience, as well as engagement and conversion rates. Google itself said that fast-loading pages are more likely to rank higher in SERPs. Therefore, if your site is falling behind in its LCP Core Web Vitals score, you need to get your developer on the case.

LCP measures the time it takes for specific content blocks to load on a user’s screen. Nothing below the visible screen fold is considered, so you’re only looking at how quickly content sections render. These include:

  • Images (including featured and background images)
  • Video imagery
  • Text blocks
  • Titles (<h1> tags)

It’s recommended that every page on your site hits LCP within 2.5 seconds, which makes it difficult for large pages, or ones with lots of elements, features or functionality.

First Input Delay (FID)

FID is all about ease of interactivity or responsiveness. FID within Core Web Vitals measures the time it takes for users to interact with your page, which could include clicking a link in the site’s navigation, entering data, or choosing a menu option, among others. This is what’s otherwise known as input latency. Contrary to popular belief, FID does not count scrolling or zooming as an ‘interaction’ within a site.

People love pages that are easy to engage with and don’t require lots of hoops to jump through. Yet many modern websites use dynamic content and technology to serve content to users. So while dynamic content can, on the one hand, improve user experience, it can also cause delay times that require longer browser response times.

FID is considered vital because Google is constantly assessing how real-life users interact with sites. Developers want to reduce this response time to improve usability and engagement.

FID is difficult to measure – some pages (such as news articles or blog posts) may not have an FID value because not all users will interact with pages. However, on login or signup pages, or pages where users are required to act, FID is vital. Google suggests that developers aim for an FID score of no more than 100 milliseconds.

Cumulative Layout Shift (CLS)

CLS allows developers to assess the visual stability of pages. In other words, CLS measures how elements move around and how stable the page layout is.

The premise of CLS was simple: it is frustrating for users to try and click something on a page that unexpectedly shifts, meaning they click on something they didn’t intend to, such as a display ad, link or image. Changing elements affect user experience, so it’s crucial to ensure all content stays in place once the page loads.

CLS will take ‌content size into account, along with how far it moves. CLS measures whether elements in a visible view shift from their starting position, between two rendered frames. CLS measures the largest burst of layout shift (also known as a session window) scores for every unexpected one that occurs throughout the page’s life cycle.

CLS is often caused by:

  • Late-loading fonts or CSS
  • Images, iframes, embeds or ads without defined dimensions
  • JavaScript

In simple terms, if elements on your pages move as the page loads, your CLS will be higher. Google recommends that developers maintain a CLS of 0.1 or below. A good threshold to measure is the 75th percentile of page loads across desktop and mobile devices.

Why are Core Web Vitals Important for SEO?

Google has hundreds of ranking factors, all of which are weighted differently. Many of these ranking factors, specifically the ones around speed and UX, have been in place for some time.

Many don’t see CWV as a huge deal because of how the page experience update came at the same time as the June 2021 Google core algorithm update.

However, Core Web Vitals is a ranking factor, which means that if you can optimise your page user experience, then you probably should.

However, should you expect a plethora of traffic and position 1 ranking by improving your CWV scores overnight? Probably not. However, it’s important not to look at CWV as ‘one-and-done’, because it’s one of many factors that Google considers important for user experience, such as:

  • Valid SSL certificates
  • Mobile-friendliness
  • ‘Safe browsing’ capabilities
  • HTTPS

Put it this way – Google clearly believes that CWV is a big deal because it gives site owners and developers plenty of free resources to measure it. Speaking of which…

How to Measure Core Web Vitals

The three main methods of measuring CWV are as follows:

  1. The Chrome User Experience Report
  2. PageSpeed Insights
  3. Google Search Console’s Core Web Vitals report

Method 1 (the CUER) collects real-user, anonymous measurement data, enabling site owners to quickly assess performance without manually implementing analytics on their pages. The CUER also fuels Methods 2 and 3, which, incidentally, are free to use. Methods 2 and 3 are inherently more detailed and immersive, delivering more specific pageview metrics that developers need to diagnose user experience issues.

There are other ways site owners and developers can measure CWV, such as:

  • Chrome DevTools
  • Lighthouse
  • The Web Vitals Chrome extension
  • Web-vitals JavaScript Library
  • web.dev

However, it’s important to note that the above will only provide field data, which is what sites are measured on and thus is handy for developers.

However, if trying to find broad lab data for testing purposes, you can still use these tools, but you will not have access to FID metrics because that relies on user interaction. To find FID in lab data, you will need to consider viewing an alternative metric such as Total Blocking Time (explained below).

Recommendations for Improving Your Web Vitals Scores

Site performance is never one and the same. Each user will experience a site differently based on their network speed and reliability, device, and how they interact with the page. Therefore, setting out guidelines for improving scores ‘across the board’ is nigh-on impossible. However, the below suggestions should give you ample food for thought.

How to Optimise Your Site’s LCP

  • Reduce file sizes if possible, or remove them entirely.
  • Host your resources on the same server if possible.
  • Consider enterprise-grade caching to reduce page load times and first-page view resource downloads.
  • Compress HTML, JavaScript and CSS files.
  • Adjust which resources are downloaded and processed first during rendering.
  • Consider investing in a CDN (Content Delivery Network) to speed up processing.

How to Optimise Your Site’s FID

  • Reduce the amount of JavaScript running or consolidate the code.
  • Break up the JavaScript tasks that would, collectively, delay responses.

How to Optimise Your Site’s CLS

  • Set image dimensions within <img> tags to prevent shifts.
  • Use “srcset” for responsive images.
  • Consider preloads and font-display: optional commands for custom fonts.
  • Reserve space for injected content to load without shifting.

Other Performance Metrics to Consider

It’s clear to see that CWV offers a plethora of useful data and metrics that developers can use to improve site user experience.

That said, while not considered part of the three ‘core’ metrics, there are other metrics which can offer insight into other technical factors that affect user engagement. Some of the other metrics developers can look at include:

  • Speed Index (SI) – This shows the average time it takes for your site content to display to users.

Google recommendation: 0-4.3 seconds.

  • Total Blocking Time (TBT) – This helps developers understand how long pages respond to specific inputs.
    Google recommendation: 0-300 milliseconds.
  • First Contentful Paint (FCP) – This measures how long a user’s browser takes to render DOM elements, while also identifying render-blocking resources.
    Google recommendation: 0-2 seconds.
  • Time to Interactive (TTI) – This measures the amount of time it takes for interactive content to become ‘usable’.
    Google recommendation: 0-3.8 seconds.
  • Page Performance Scores – A single metric that consolidates all the critical user experience metrics in CWV, averaged into single scores across mobile and desktop visits.
    Google recommendation: 90 out of 100 for both desktop and mobile.

In summary, it’s evident that page speed and user experience need to both be in the green. In order to achieve that for your site, you may need a wide range of resources or services, depending on how your site has been built and what has been done thus far to optimise it.

The best thing you can hope to do is work closely with your in-house or outsourced web developers, who will likely have a deeper understanding of how technical issues can be fixed or tweaked to improve your overall site user experience.

While suddenly getting in the green for all your CWV scores might not magically make rankings appear out of thin air, the fact remains that this ranking factor is here to stay, and isn’t going anywhere anytime soon.

At Artemis Marketing, we help our clients improve their rankings on Google and other search engines through a hybrid of technical website optimisation, content writing, link building and other proven, trusted white hat SEO methods. Why not read about what our clients have said or, if you’re interested in discussing how we can help the technical markup of your site, get in touch with us directly?