We’ve all had the experience of being frustrated by a website: typing in the URL, clicking through on our browsers, hitting a link and then…nothing. Spinning wheels, loading bars, images not found, clunky or broken functionality.
As users we know a poorly performing website when we experience it, but until Google rolled out its Core Web Vitals earlier this year, their algorithm took into account just two metrics to encompass all the different aspects of a slow-moving page: the page loading time and mobile friendliness. Page loading speed measured the speed with which a website’s server could connect the web page to your browser. With the rise of frameworks like React and Angular, that doesn’t necessarily mean as much anymore. While these frameworks’ initial load speed is faster, they still require time to connect the data to the page. In the face of these advances, Google sought out ways to better reflect the user experience and keep website creators accountable to great experiences (via search algorithm updates and keyword rankings). And the Core Web Vitals were born.
What Do Core Web Vitals Measure?
So, how do these Core Web Vitals quantify good user experience? Three ways:
- Largest Contentful Paint (LCP): the metric for loading
- First Input Delay (FID): the metric for interactivity
- Cumulative Layout Shift (CLP): the metric for visual stability
Largest Contentful Paint is most similar to the original page loading score. Before, the rule of thumb was that your web page should load in less than 3 seconds. With the LCP in Google Core Web Vitals, between 2.5 and 4 seconds is categorized as “needs improvement,” and loading faster than 2.5 seconds is good.
First Input Delay goes deeper into the makeup of a good user experience. The website can load up quickly, but if you can’t interact with it, that doesn’t mean much. This measures that experience of being able to quickly click on the buttons, enter in information, etc. The goal here is to be able to interact with the website in less than 100 milliseconds. Between 100 and 300 is the “needs improvement” range.
Finally, there’s Cumulative Layout Shift, the measure of visual stability. Do things move after the page loads? Do you get those flashes of unstyled content? When a page loads, the website must retrieve images, fonts, and other content, and in the meantime it will show you other options, like the broken image icon. Websites that have a hard time loading fonts might default to Times New Roman before you see them shift into their desired font—and as any designer can tell you, fonts have a big impact on layout and design. You’ll see the text shift a lot in that transition. All this shifting around makes a website challenging to use if it doesn’t happen quickly enough.
What Does It Mean For Your Website?
If you’re interested in how your website scores on the new Google Core Web Vitals, you can test it on their developers insight page or through the new Chrome extension. Whether or not you test it yourself, Google will. And those with an overall score of 75 or below will get dinged by the algorithm. (In case you were wondering, Well Done Marketing’s in-house goal when we launch a new website is a minimum score between 80 and 85.)
Search engine optimization (SEO) has come a long way from the days of keyword stuffing and spammy backlinks, with Google continually prioritizing websites that offer valuable content and good user experiences. Core Web Vitals is just another piece of the algorithm puzzle—website and marketing managers still need to regularly produce high-quality content for audiences.
What Can You Do About It?
These new web vitals metrics give developers a more in-depth way to communicate the difference between a well-performing website with a good user experience and a poor one. So, now that you know better, you can do better.
Some best practices we follow include things like:
- Pre-connecting to fonts so they’re ready at the very first request
- Fading pages to combat flashes of unstyled content
- Sizing images and videos correctly
- Deferring larger content pieces down the page
Our developers have always taken the user experience into account in building websites for Well Done clients. We build from the ground up based on client needs—that means fully custom website experiences, not themes, which are often clunky from a coding POV—creating a well-prioritized list of content needing to load, and our digital strategists do their best to keep the number efficient. And, maybe most importantly, we conduct our own user experience testing to ensure that every website we build hits the mark beyond these Core Web Vital metrics.
If you want to know more about what can be done to improve your website’s functionality and user experience performance, or anything else pertaining to web development, get in touch.