Vital Info about Core Web Vitals

Last Updated on June 23, 2022

We all know what a good website feels like. A great website is quick-loading. Beautiful. Full of Content that grabs you. Helpful, valuable, effortless to use and navigate.

These types of websites are the ones we tend to frequent, over and over. As it turns out, there are substantive perks that go along with owning that type of go-to, easy-to-use website. Those websites get more traffic, for example – which can directly translate to more clicks, more clients, or more ad revenue.

Knowing how to build our websites to achieve that high-quality user experience can be confusing. There’s a lot to concentrate on, and the back-end stats of your website can be completely overwhelming. 

More to the point, your experience of your website doesn’t always reflect the real-time actual experience of the people you want to click over to your site. We need a way to assess how objectively good our websites are for the people we want to use our websites.

Enter: Core Web Vitals. 

Core Web Vitals 101

Over the past four years, Google has been working on a succinct, demonstrable way to assess the health of your website. As of June 2021, Core Web Vitals is rolling out, and we’re already seeing its impact with client search ratings. By August, Page Experience and Core Web Vitals will be fully implemented into Google search rankings. 

That means that now is the time to get started with Web Vitals. But first: What is it? Here’s a quick definition: 

Core Web Vitals is Google’s way of quantifying a good user experience on the web.

Think of it this way: When you’re at the doctor, the first thing your doctor does is take your vitals. This gives your doctor a quick, comprehensive, and relatively simple idea of how you’re doing. Based on that info, your doctor can identify any issues you may be having and put together a plan to get you back on track. 

Web Vitals is the analogous tool you can use for your site. 

Just like human health vitals can be broken down into specific categories – your resting heart rate, your blood sugar levels, your temperature – Web Vitals can be broken down into discrete categories, each pointing to a different way of seeing how your website is doing. 

The big focus in Web Vitals is on three different metrics: Largest Contentful Paint, First Input Delay, and Cumulative Layout Shift. These technical terms work to measure the specific ways that a visitor can have a good or bad experience on your site.

 

LCP, FID, CLS: What Does It All Mean?

Let’s talk metrics. What does each of these terms mean (and measure)? 

• Largest Contentful Paint, or LCP, measures perceived load speed. A fast LCP helps a user feel that a page is useful because they have access to its contents quickly. 
• First Input Delay, or FID, measures the time that it takes for a user to interact once the browser is ready to respond to interaction. To measure this, FID focuses on things like clicks, taps, and key presses from the user. 
• Cumulative Layout Shift, or CLS, measures the visual stability of a page. Typically, you’ll want to keep an eye on CLS when you have a web page that is associated with a lot of ads.

Taken together, a site’s LCP, FID, and CLS scores (or its overall Core Web Vitals) will give you a very good idea of how accessible and useful your site is to the average user. 

These stats can also help you figure out where you can improve your site – and where you’ll likely see the biggest return on investment. For example: 

• If you’re interested in optimizing your site’s loading performance, you might want to track your LCP score. 
• Ready to improve your site’s interactivity? Examine your FID. 
• Curious about how your site’s visual stability stacks up? Your CLS score will give you a pretty good idea. 

Based on Google’s knowledge of the experiences that real people have when they visit your site, Google will give your site ‘good’, ‘needs improvement’ and ‘poor’ assessments. Your goal? To improve those scores with strategic site optimization to hit a threshold of the 75th percentile of page loads across all devices (mobile and desktop). 

Good benchmarks to hit include: 

• Your LCP should occur within 2.5 seconds of when the page first starts loading.
• You should target an FID of 100 milliseconds or less.
• Your page should each maintain a CLS of 0.1 or less. 

Google will track how you’re doing with respect to these benchmarks and let you know which aspects of your site may need improvement. 

Why is this different from any other site metrics we’ve been using in the past? 

Web Vitals can show you real performance of your site for real site users under real conditions…allowing you to make changes that result in real, impactful change.

Unfortunately, it’s easy to mask issues with performance when looking at how your site’s doing from your point of view. With Web Vitals, you can add some of that crucial objectivity back in – allowing you to see and work towards needed improvements you might otherwise have missed. 

Want to see what we mean? Let’s look at how one team prioritized optimization of their web vitals and the concrete benefits they saw as a result….

Website Case Study 

Optimizing your Core Web Vitals will always be a project that is very specific to your site. To determine your best course of action, it matters how complex your site is, as well as where your current vitals stand. For some, it could be as easy as optimizing a few images. For others, it might require a lot of targeted, consistent development work. 

No matter what, it’s important that you see this as a long-term investment into your business. It’s always going to be a good decision to prioritize fast, seamless user experiences for your audience or customers – and your specific experience of your website may not match everyone else’s. 

One team found this out quickly when they started to work on improving their site and their Core Web Vitals. Despite the fact that their website seemed very fast and responsive, this team was surprised to find that their vitals scores were low. After digging through their site’s performance, they discovered why.

“Our fast computers and fiber internet masked the experience real people have on our site,” noted the team. They used some online tools to find technical issues with their site – for example, some programming that was slowing their site’s initial rendering time, as well as a cache misconfiguration they’d previously missed. These might not have constituted big problems for the team’s hyper-fast internet experience; but, for their average user, these might have caused a lot of frustration. After taking time to clear out a lot of the digital clutter their site had accumulated, the team saw their Core Web Vitals rise – which translated to a better experience for their audiences. 

Other companies have leveraged Core Web Vitals to see similar successes. For example: 

• One company was able to raise their LCP by 31% through image optimization, deferring resources, and managing their HTML and Javascript more strategically. As a result, they achieved 8% more sales. 
• Another team worked to improve their CLS by 15%. They did so by optimizing their ad script loading logic and allowing less variability in ad unit size. As a result, they achieved 10% more ad revenue.
• Another team was able to see a 2.6% reduction in their site’s bounce rate through improvement of their Core Web Vitals score. 
• Yet another was able to see a 6% revenue increase for their Black Friday sale after taking steps to improve all 3 Core Web Vitals metrics. 

Clearly, we’re onto something big, here. 

The question is: How are we going to leverage Core Web Vitals to get you the results that matter to your business?

What You Can Do to Optimize Your Web Vitals

Since the journey towards a great Core Web Vitals score is so unique to the features and specifications of your own website, it’s difficult to pinpoint a universal, guaranteed fix that will result in higher Core Web Vitals scores. As the SEO experts at Yoast put it, “You have to take a broader view of optimizing your site. A lot of little fixes make up big results.” 

Let’s talk about the elements on your site that have the most impact on each of your Web Vitals scores, and what you may be able to tweak in order to boost your user experience.

• If you’re hoping to boost your LCP score, you’ll want to take a look at your image elements, including both background images and video elements. 
• If you wish to raise your FID score, look at the large asset requests on your site, such as Javascript, CSS, and fonts. 
• If you’re ready to work on your CLS score, see whether you’re using non-composited animations, whether your site has obtrusive ads and pop-ups, or whether you’ve included image and video elements without explicit widths and heights. 

Google will consider all of this information and color-code URLs for you in your dashboard for Core Web Vitals, so you know precisely where to get started. 

While it’s impossible to say exactly what recommendations may work for everyone, there are some general guidelines for good places to start. For example, consider the following common problem areas if you’d like to invest in your site’s user experience: 

• Optimizing all of your images. Really big images tend to impact your site’s LCP, so ensuring they’re able to load quickly will go a long way towards a better experience for your audience. 
• Stabilizing site loading by providing details about site elements. You can prevent a slow load by, essentially, letting your browser know what to expect for each page. For example, including specific information about the width and height of your images can improve load times. 
• Speeding up your server. Your server directly influences your site’s speed metrics. There are several tacks you can take to optimize your server – for example, by upgrading your hosting plan. 
• Leveraging CSS to load your content quicker. Your developer can help you figure out how to enhance the loading of your site with critical CSS. 
• Improving the way that third-party scripts load. Maybe your site is fast – but the external ads are really slow. That’ll end up hurting you. If specific ads are slowing down your site, it might be time to look into different options.

 At the end of the day, remember that Core Web Vitals tend to reflect how well you’re doing with always-important site factors: Content, speed, web experience. Work with your dev team to optimize those factors, and you’ll see your Core Web Vitals (and the other metrics you care about) start to inch up over time.

Web Vitals are Here to Stay

There’s a lot to learn about Core Web Vitals. They’re complicated. They’re tricky. Understanding them involves a lot of information! However, as we’re seeing in published case studies and among our own clients, taking time to improve Core Web Vitals can result in a lot of benefits for your site users – which translates to benefits for you. It’s a win-win situation, as long as your team is ready to put in the work. 

That’s where we come in. At USDP, we’re excited to leverage this new way of assessing site health to help you meet your goals. Reach out today to speak with one of our experts about the ways you can improve your site’s Core Web Vitals. In the meantime, set up your Core Web Vitals dashboard today and start exploring. Remember, this performance journey should be a fun, constantly-improving growth opportunity to learn more about the best ways to provide a great experience for your clients. We can’t wait to hear about the benefits you see!