Core Web Vitals: A Simplified Approach to Improve 3 Scores
When Google releases an update to its search algorithm, there is some uncertainty among people who rely on Google’s search users for traffic. There can be a lot of angst about Google algorithm updates, but a lot of it is misplaced. SEOs, developers, and website owners alike spend the following weeks and months figuring out how to make sense of it and what needs to change.
Some of this analysis is right, some of it is wrong.
Our approach? Stick with the facts (the what behind the why), keep calm, and maintain focus on the user.
61% of website users will try a different site if they can’t find what they’re looking for quickly. (Source: Google)
Think…
- When you’re searching for something on your phone but can’t find it because the page is loading too slowly
- When you can’t tell where the shipping is on the sites shopping cart
- When using a website with a difficult website navigation
- When you look for something online and give up because it’s too hard to find
The majority of algorithm updates have one purpose: to help a person find exactly what they seek. Aside from a few more technical aspects about how everything is scored, The Google Core Web Vitals (CWV) updates are really no different. It makes total sense that Google would favor websites with great user experience (UX).
What are Google Core Web Vitals?
Just in case…a quick summary:
Google Core Web Vitals (CWV) are a set of performance, user-focused metrics designed to measure the severity of issues people encounter when using a website. These key metrics are helpful and provide web developers and online business owners a concrete way of measuring indicators of UX design and search engine optimization (SEO).
What are Web Vitals Key Metrics?
Web Vitals consist of three key metrics: LCP (Largest Contentful Paint), FID (First Input Delay), and CLS (Cumulative Layout Shift).
1. LCP, Largest Contentful Paint – The measurement of how long it takes for users to see the content above the fold. In other words, this is super important real estate for any website.
2. FID, First Input Display – This is more about what happens when someone first clicks, scrolls, types.
- Will they abandon ship?
- How long does it take for the site to respond?
3. CLS, Cumulative Layout Shift – This looks at how much things on the page move around, while the page is loading.
- Is there a pop-up in the way?
- Is there a slideshow above the fold that loads late?
How to approach?
If there’s anything that can incite unnecessary fear about your website, it’s algo updates. If we could ask you to jot down just one single note about this update, it’s DO NOT PANIC.
Yes, if your website takes 26 seconds to load, there’s definitely some work to do. However, with some good planning and a step-by-step approach, your website will be OK.
Intentional user experience can have as much as a 400% conversion rate. (Source: Forbes)
Keep in mind the good intention here: Provide positive website experiences for people. Take a look at this next example which outlines a simplified approach to identify, plan, and make the necessary website updates that help create those experiences.
Example Process to Improve Scores
You’ve identified a potential issue. You’re concerned that you’re getting a lot of web traffic, but not getting a lot of inquiries.
First, find the What to your Why.
Pull some analytics reports and gather the data you need to confirm your concerns.
- Download and install the Web Vitals Chrome extension (web.dev) to quickly view LCP, CLS, and FID scores. If one or more metrics are failing, the badge will display the values of these metrics.
- Run a PageSpeed Insights report for more detailed desktop and mobile scores.
- Also run analysis using GTmetrix for comparable metrics to the previous two.
Performance scores may be different from tool to tool.
Performance scores vary because different tools use different methodologies and configurations. Even though Lighthouse1 is the common component among the tools, there are considerable differences in how Lighthouse itself is implemented.
Read More About the Differences Here
Next, find the how – how your audience uses your website.
Know where your potential customers go, and what they do on your website.
- Use Google Analytics (at the very least), to keep a close eye on your most important and most visited pages, like your homepage.
- Ensure your website is successfully tracking the activity and engagement of those pages.
- Identify and confirm potential problem areas.
Just by looking at out-of-the-box analytics reports, we can find a lot of great information to fuel our next steps.
What analytics* reports can tell us:
- How they view the site: 41% of users view on a mobile device, using the Chrome browser (Audience > Mobile > Devices)
- How to find it:
- How they leave it: 39% of sessions exit from the homepage after 38 seconds (behavior > behavior flow, explore traffic)
- How to find it:
*The reports in the screenshots do not reflect the sample data above. G4 reports will also look different than the above example reports.
Identify why the issue you’re concerned about may be happening.
Now that you know how your potential customers are using the website, you’re able to know your site.
A lot of users view the homepage from Chrome on mobile, then exit after about 30 seconds. Why?
- Page load = ~2.17 seconds (behavior > site speed > page timings)
- A pop up appears on the page after 30 seconds (observable on the homepage)
- The call to action isn’t clear, might have too many (educated guess)
When you can identify areas of the website as slow or problem areas – you know where to start fixing things and where your priorities lie.
Finally, you’re able to know your goals and create an action plan.
Comparing the page load and the timing of the pop up both being around 30 seconds, we can conclude that the pop-up is most likely the biggest issue of them all – and likely one of the easiest to remedy.
Set S.M.A.R.T.2 goals and make a plan of attack. Remember, DO NOT PANIC and remain focused on the user.
Your action plan:
- Today: Remove the pop-up on the homepage.
- Week 1: Reduce the number of call-to-action buttons.
- Week 2: Add the main call to action in the header of the site, sticky, or visible at all times – even on mobile.
- Week 2: Ensure all images are optimized and modern file types.
- Week 3: Improve caching, and look into enabling image lazy loading.
- Week 4: Reduce the size of photos on the homepage by 15%.
- Week 5: Increase the number of form fills by 5%.
- Week 5: Reassess
At this point, you can reassess if the adjustments above have given you the boost you needed to improve one or more key metric scores.
This specific example looks at one potential issue. There could be more or less. Our suggestion here is to start with the worst issue and work your way through a little at a time. This way, you can gather the appropriate data that you need when looking at other areas that may need to be addressed.
How to check up on your adjustments:
- Use your Web Vitals Chrome extension to view the new LCP, CLS, and FID scores.
- Run a PageSpeed Insights report.
- Also, run analysis using GTmetrix
- Compare all of the above to your baseline to compare and observe the differences.
Did the scores improve? Did they remain the same? Did they get worse?
You’ll want to run these reports right after each set of adjustments – that way you have a clear understanding of how they affected your performance scores. There’s also a benefit to running these same reports on an ongoing basis, like once per month until you’ve got a good set of passing scores. Then, anticipate and innovate. Run the reports on a quarterly basis to stay ahead of potential issues and find new ways to provide even better experiences.
Consider hiring a pro:
If it sounds like a tedious process, it kind of is.
If you do find yourself in a pinch or have limited resources – it’s not unreasonable to block off a few hours on your calendar to set aside a little time and run some reports to get the process started.
But…this is where having an experienced and trustworthy developer at the helm to take the lead in making these improvements really comes in handy. You’ll be able to remain focused working ON your business instead of working IN your business with things like finding the time to sift through data, understanding what you’re seeing, or implementing the updates.
The proof is in the pudding data.
Overall, identifying potential issues that cause less than ideal Web Vitals scores will provide you with multiple opportunities to further improve your website’s performance, user experience, and ultimately, your business.
It’s pretty amazing what just a little data can tell you about your potential customers — but what really matters is what you do with it.
If you are looking for the real scoop on what’s going on behind the scenes of your website, drop us a note, we’re here to help.
- Lighthouse is an open-source, automated tool for improving the quality of web pages.
- S.M.A.R.T. is an acronym that stands for Specific, Measurable, Achievable, Realistic, and Timely. Therefore, a S.M.A.R.T. goal incorporates all of these criteria to help focus your efforts and increase the chances of achieving your goal.