Core Web Vitals Audit: What’s Included and How to Improve | Linkflow
arrow-back Back to main blog

Core Web Vitals Audit: What’s Included and How to Improve

December 15, 2023

Seriously looking at SEO for the first time is kind of like making a New Year’s Resolution to start hitting the gym.

You get everything set up. You walk into the main area. And, immediately, you feel like a lost puppy.

Everyone’s in shape. And you don’t even know how the equipment works.

SEO has a ton of moving parts (I could write a whole book about it). But, like going to the gym, the most important thing is to get started.

A Core Web Vitals report will tell you everything you can do to get your SEO journey off the ground.

What are the Core Web Vitals?

Google’s Core Web Vitals are a set of specific website performance metrics that focus on your site’s user experience. They measure how fast a page loads, how stable it is while loading, and how easy it is to interact with the page.

These metrics are critical to your SEO performance because:

  • Back in May 2021, Google officially announced Core Web Vitals will become ranking factors.
  • They’re simple indicators of user experience on desktop and mobile (which accounts for more than half of all web traffic).
  • Improving Core Web Vitals metrics leads to better conversion rates, lower bounce rates, and overall happier users — all of which inadvertently improve your search engine rankings.

You can measure Core Web Vitals for free using Google’s PageSpeed Insights tool or your Google Search Console account. When it returns a report, it’ll give you a list of specific issues you have to address. This makes it easier to prioritize certain technical improvements over others.

Three core metrics make up Google’s Core Web Vitals:

Largest Contentful Paint (LCP)

Largest Contentful Paint (LCP) represents the loading time for the largest image or text block on your page. This is important because it’s the first thing users see when they navigate to your site, and it can impact how quickly they can start interacting with your content.

Google recommends aiming for an LCP of 2.5 seconds or faster to provide a good user experience. If your LCP is longer than 4 seconds, it’s considered poor and needs improvement.

How to improve LCP:

Reducing the time it takes for your largest content to load comes down to reducing server response time and eliminating render-blocking issues.

  • Implement caching
  • Use a content delivery network (CDN)
  • Minify JavaScript and CSS files
  • Remove render-blocking CSS and JavaScript
  • Optimize images by compressing and reducing their size.

Cumulative Layout Shift (CLS)

Cumulative Layout Shift (CLS) tells you when elements on your page move around as it’s loading. You have to pay close attention to visual stability because it can cause a poor user experience when users are trying to click on buttons or links but end up clicking something else due to layout shifts.

For example, someone trying to book a demo, sign up for your newsletter, or make a purchase might accidentally click on the wrong button. They may very well leave your site without completing that action.

Google says you should aim for a CLS score of less than 0.1 to provide a good user experience. Scores above 0.25 require your attention.

How to improve CLS:

You can improve your CLS by ensuring that all elements on your page have explicit size dimensions, avoiding ads or pop-ups with unknown sizes, and using animations sparingly.

  • Use CSS grids or Flexbox for layout
  • Set size attributes for images and videos
  • Preload fonts and ensure they have accurate size declarations
  • Reserve adequate space for dynamic content like ads, embeds, and iframe with CSS padding and margins.

First Input Delay (FID)

First Input Delay (FID) measures the time it takes for a user to interact with your page — for example, clicking a button or filling out a form. It directly impacts how users perceive your site’s responsiveness and can lead to frustration if there’s a significant delay.

Google considers an FID of less than 100 milliseconds “good.” Anything above 300 milliseconds needs a closer look right away, and anything between 100 and 300 raises a flag.

Within the Core Web Vitals audit process, you might use a different metric — Total Blocking Time (TBT).

FID requires field data, which Google complies from real users. If that isn’t available for the website you’re auditing, you’ll need to use lab data (data collected from a controlled or simulated environment) instead.

How to improve FID:

To improve FID, you need to identify and eliminate long tasks that block the main thread from responding quickly.

  • Minimize JavaScript execution time by splitting long tasks into smaller ones
  • Optimize (and limit the use of) third-party code and scripts
  • Minimize the impact of DOM manipulation on page load.
  • Break up long tasks by chunking large blocks of code or using web workers

These are the “opportunities” under the “TBT” column in your Core Web Vitals report, and they require the most technical know-how of any Core Web Vitals improvements.

Interaction to Next Paint (INP)

Interaction to Next Paint (INP) replaces First Input Delivery (FID) in March 2024. It’s like FID, but it measures the response time for an average of all interactions on your page, not just the first one.

This means you’ll need to make sure all of your interactions are as smooth and responsive as possible to meet this new Core Web Vitals metric.

According to Google, you should shoot for an INP of less than 200 milliseconds. Otherwise, your page isn’t responsive enough to provide a good UX

How to improve INP:

To improve INP, follow the same best practices for improving FID, but apply them to all user actions across a full section. Think about anything that could delay a user’s ability to interact with your page — for instance, scrolling, clicking on buttons, and typing in forms.

  • Avoid excessive DOM manipulation and long tasks
  • Minimize the impact of third-party code
  • Implement lazy loading for images, videos, and iframes (though this was much more effective for FID)
  • Use code splitting to avoid large amounts of JavaScript on initial page load
  • Optimize event callbacks
  • Use requestIdleCallback() to schedule non-essential actions

How to conduct your own Core Web Vitals audit

If you’re highly technical, you can figure this out yourself. If not, you can at least run the report (like above) on Google’s PageSpeed Insights or in your Google Search Console account.

This gives you limited data, though.

Instead, use Screaming Frog SEO Spider and the PageSpeed Insights API. That way, you can gather Core Web Vitals data, Chrome User Experience (CrUX) data, and lab data.

1. Connect the PageSpeeds Insights API to your Screaming Frog account.

When you do this, Screaming Frog automatically pulls in the lab data from PageSpeed Insights.

Enter PageSpeed Insights API Key
  • Go to Configuration > API Access > PageSpeed Insights
  • Click on “Add”
  • Enter your API key
  • Save your changes

2. Choose your Core Web Vitals metrics.

You can do this by clicking on the “Metrics” tab in your Screaming Frog report.

Select:

  • Core Web Vitals assessment
  • CrUX First Contentful Paint Time (seconds)
  • CrUX First Input Delay Time (milliseconds)
  • CrUX Largest Contentful Paint Time (milliseconds)

3. Run a website crawl.

To run a crawl in Screaming Frog, all you need to do is enter your site’s URL and click on ‘Start.’

Screaming Frog will auto-configure the crawl to incorporate Core Web Vitals issues and report data via the API.

4. Head to the ‘PageSpeed’ tab.

From the Reports dropdown menu, click PageSpeed. Then, choose PageSpeed Opportunities Summary.

This summary includes details about the Core Web Vitals opportunities along with a breakdown of each page’s performance.

5. Analyze your results.

Your Core Web Vitals report should provide you with a list of all your crawled pages and a Pass/Fail grade for the assessment.

For LCP, CLS, and FID, it’ll also show the time (in milliseconds) and whether that’s “Good,” “Needs Improvement,” or “Poor.”

What to expect from a Core Web Vitals audit:

Assuming you aren’t a complete tech guru who knows the ins and outs of web development, you’re almost definitely working with an SEO consultant or agency.

Here’s a look at what to expect when you audit Core Web Vitals:

Report

When you run the audit, it’ll present your Core Web Vitals data in a report that looks like this:

Below the scroll, you’ll see a diagnosis and images of the page.

The report tells you what Core Web Vitals are failing and links to additional resources like Google’s web.dev articles, which teach you how to improve your scores in-depth.

Below, you’ll see Opportunities and Diagnostics.

These are suggestions that can help you improve your Core Web Vitals scores.

Your agency or consultant should explain to you in layman’s terms what these suggestions mean and how they plan to implement them.

Instructions

Next, they should add context to all the technical jargon in the report.

  • Which Core Web Vital does this issue correspond to?
  • How do you go about fixing it?
  • What impact will it have on your website’s performance once you’ve made updates?

For example, they should tell you if you have to:

  • Minify code
  • Eliminate render-blocking resources
  • Compress images
  • Lazy load above-the-fold (ATF) content.
  • Update images to WebP or WebM formats
  • Fix server-side issues

They should prioritize all their instructions based on what’s the easiest vs. hardest to implement and which changes will have the highest impact on your customized SEO strategy.

TL;DR: Just hire someone. It’s a lot easier that way. Trust me.

Brittney Fred, SEO Analyst
Brittney has been working in SEO and digital marketing for ten years and specializes in content strategy for the B2B SaaS industry. She is based in Denver, CO and absolutely fits the Denverite stereotype. You’re just as likely to find her hiking, snowboarding, or doing yoga as reading sci-fi or playing video games.