Six Ways to Improve Your Core Web Vitals Scores

Web vitals

Estimated reading time: 8 minutes

In April 2021, Google announced that the Page Experience Update will be gradually rolled out from the beginning to mid-June 2021. Features will be implemented slowly over time, which means the full impact of Page Experience is expected to take effect around late August 2021.

The great thing about this update is that you can quantify the user experience of your site and identify opportunities to improve, using Core Web Vitals scores. Having good Core Web Vitals scores is important, since page experience signals will be included in Google Search ranking going forward.

In fact, user experience has become such an important factor in Google’s Search ranking (and is expected to become increasingly important) that Search Engine Optimisation has evolved to Search Experience Optimisation (SXO).

If you want to optimise your site for Google’s big algorithm update, knowing how to improve your Core Web Vitals scores and page experience signals will form an important part of your SEO plan.

We’ve put together a list of six things you or your developer can do to improve your Core Web Vitals scores. But before you start, it’s good to know how well your site currently performs.

Start with a Website Performance Analysis

Before you start taking steps in improving your site’s user experience, you’ll first want to measure your website’s Core Web Vitals scores as it will give you a benchmark for improvements.

An SEO Site Audit is a great way of gaging how well your site is performing, as it will give you a broad overview of all the factors that may be negatively impacting your site from an SEO perspective.

However, if you want to start off by only looking at your website’s page experience signals, you can do a website performance analysis test using Google tools like Search Console and Page Speed Insights.

The Page Experience report in Google Search Console combines the existing Core Web Vitals report with other components of the page experience signals, such as HTTPS security, absence of intrusive interstitials and mobile friendliness. It offers valuable metrics like the percentage of URLs with good page experience over time.

Google’s Page Experience Update comes with a set of recommended speed goals. To pass this assessment, at least 75% of your page views should exceed the Good value.

Six Things You Can Do to Improve Your Core Web Vitals Scores

Here are the six things that you can do to improve your Google Core Web Vitals scores:

  1. Optimise images and videos
  2. Optimise CSS code
  3. Implement lazy loading
  4. Speed up your server
  5. Optimise JavaScript execution
  6. Provide dimensions for images and embeds

How to Improve your Core Web Vitals Scores

  1. Optimise Images and Videos

    Optimising images and videos on your site is probably one of the most important steps to take in improving your Core Web Vitals scores, as it has a great impact on loading performance and therefore, user experience.

    Loading performance is measured by the CWV metric called Largest Contentful Paint (LCP). This metric marks the point in the page load timeline when the page’s main (largest) content has finished loading.

    Google regards an LCP that occurs within 2.5 seconds of when the page first starts loading as a good user experience. Anything above 4 seconds is considered poor.

    There is much to be said about image SEO. But in short, images should be served in the size needed and compressed well. Image compressing tools, such as can help you do this.

    When it comes to video content, it’s good practise to use an image placeholder where the video would normally load. Videos should also be placed below the fold as placing them above the fold is guaranteed to delay your loading time.

    Image optimisation has many facets. If you need a team of SEO specialists to handle this for you, get in touch. Our team is always researching and learning to keep up with new industry tools and trends in order to produce the best results.

  2. Optimise CSS Code

    CSS dictates a large part of your website – from colours and text formatting to positioning. So optimising your CSS will help the page load quicker.

    CSS files can contain unnecessary characters such as spacing or indentation, without which it can still operate perfectly fine. Minifying your CSS code (removing unnecessary or redundant data) will ultimately reduce the time it takes to fully render the main content of the page (LCP). To minify code, you can run it through a tool such as

    Another way of optimising your code for faster loading times is by preloading your CSS – a somewhat more technical task. This will force the browser to load the CSS and have it ready when it’s needed. Preloading CSS is especially useful for websites with bigger style sheets and modern web applications.

    Here’s an example of a preload command:

    “href” points to the resource you want to download.
    “as” can be anything you can download in a browser, for example:
    – “style” for style sheets
    – “script” for scripts
    – “font” for fonts

  3. Implement Lazy Loading

    If you display images, animations or videos on your site, implementing lazy loading will make a significant difference to your site’s UX and Core Web Vitals scores. Lazy loading enables the loading of images and other heavy elements asynchronously that is, after the above-the-fold content is fully loaded, or conditionally, only when they appear in the browser’s viewport as they scroll down.

    Aside from improving page loading time, lazy loading also limits bandwidth usage. This is great for users accessing the web on mobile devices and with slow connections. Lazy loading can also help keep your visitors on the page and reduce the bounce rate.

    One of the easiest ways of implementing lazy loading of images is with native lazy loading, using the HTML markup below:

    <img src=”myimage.jpg” loading=”lazy” alt=”…” />

    Need a team of SEO experts to take care of this? Contact us today.

  4. Speed up Your Server

    There could be a myriad of causes for a poor Largest Contentful Paint (LCP) score, for example slow server response times. If you have a complex site, the server keeps busy with handling requests and serving files and scripts. It’s therefore best to optimise those processes. The faster your server responds to requests, the faster your pages will load, which improves a lot of site speed metrics.

    Ways to optimise your server:
    1. Upgrade your hosting plan – preferably one that offers good performance at a fair price.
    2. Use a recent version of PHP.
    3. Upgrade the hardware if you find that lacking.
    4. Research how your databases work and make improvements where necessary. You can use tools like the Query Monitor WordPress plugin to analyse queries on your site.
    5. A content delivery network (CDN) – a geographically distributed group of servers that work together to provide fast delivery of Internet content – can do wonders to improve your Core Web Vitals.

  5. Optimise JavaScript Execution

    The main cause of a poor First Input Delay (FID) score (over 300 milliseconds) is heavy JavaScript execution. Optimising how JavaScript parses, compiles and executes on your web pages will directly reduce FID.

    According to Google, one of the ways you can reduce the execution time is by reducing unused JavaScipt.

    How to see if your website has unused JavaScript:
    1. Go to your website, right-click and choose “Inspect”.
    2. Click on “Sources” and look for the three dots that open up “More Tools” on the bottom.
    3. Click on “Coverage” then press the reload function.
    4. When the load is complete, look at the bottom of the window where you will see how much JavaScript is not being used on your web page.

    Now that you know the amount of unused JavaScript, you can start to reduce it. One way of doing this is with code splitting, which essentially means to separate one JavaScript bundle into smaller pieces.

    If you lack the time or resources to handle all the technicalities involved with improving your Core Web Vitals scores, get in touch.

  6. Provide Dimensions for Images and Embeds

    A Cumulative Layout Shift (CLS) score that’s over 0.1 is indicated as poor. This is usually caused by images or embeds, like videos from YouTube, without dimensions in the CSS file.

    If you want to improve your CLS score, it’s import to set proper width and height dimensions. This helps the browser allocate the correct amount of space in the page while the element is loading, which will avoid layout shift if it’s loaded off-screen.

    How to resize YouTube videos you want to embed:
    1. Open the video on YouTube that you want to add to your site.
    2. Find the share button and choose the <> Embed option.
    3. Copy the code into your website’s back-end and change the dimensions to the proper width and height that fit your site.

    It’s important to keep in mind that there is not one factor that’s guaranteed to fix one specific issue. To optimise your site and improve your Core Web Vitals scores it’s best to take a broad view. A number of little fixes can have big results.

Optimising your website to improve your Core Web Vitals scores can be quite technical. If you need our SEO specialists to improve your Core Web Vitals scores, we invite you to get in touch.

Speak with an Expert

Speak with one of our SEO specialists to assist with running a SEO competitor analysis report.

A note to our visitors

This website has updated its privacy policy in compliance with changes to European Union data protection law, for all members globally. We’ve also updated our Privacy Policy to give you more information about your rights and responsibilities with respect to your privacy and personal information. Please read this to review the updates about which cookies we use and what information we collect on our site. By continuing to use this site, you are agreeing to our updated privacy policy.