Google recently launched their newest SERP ranking measurement called “Core Web Vitals”. These new ranking metrics are part of the larger overall “page experience” rankings that Google already uses. In case you’re wondering, the other page experience factors are: mobile-friendliness, secure browsing, HTTPS, and following the Intrusive Interstitial guidelines. If you have any questions on those, Google Search Console (GSC) has reporting functionality on how you’re doing with the current page experience factors, so we recommend starting there.
Now, back to Core Web Vitals. Before you panic, wondering what these mean for your site, you should know that your site may already be ranking highly and you may not have to do much in wake of the update. Essentially, Core Web Vitals can be broken down into three parts: Loading, Interactivity, and Visual Stability. Let’s look at each in detail.
Loading
This is the Largest Contentful Paint for your website. Essentially, it’s a measure of how long it takes the main content on the site to load. This is more of a “real world” view of how a user would see your website load.
You should already be trying to get your page to load as quickly as possible, so this shouldn’t be anything new, but for the new Core Web Vitals ranking, you want to shoot for anything under 2.5 seconds. You can test your page using the PageSpeed Insights tool developed by Google to figure out where you stand. Another great place to check out your site’s LCP metrics is in Google Search Console. In GSC you can see the scores for every page on your site and quickly identify which individual pages need the most work.
If your page needs some help to get under 2.5 seconds, you can try removing any unnecessary third-party scripts, changing your web host, setting up lazy loading, and removing the worst speed offenders—like large images.
A quick note about image sizes in regards to LCP – Google looks at two different values for images when calculating LCP, the intrinsic and the visible size. The intrinsic size is the actual size of the image file when it is uploaded to your server, generally a larger image size that is then scaled down with CSS or HTML on-page to a smaller, more manageable size, the visible value. Google uses the smaller value when calculating the LCP of a page, but best practice is to upload the image at the visible size it will be used at on-page. So instead of having a large image scaled down on-page, upload the image at its used size to help boost your site’s LCP.
While it’s not always feasible to make all of these changes, the PageSpeed Insights tool will provide some guidance on where you can improve.
Source: Web.dev
Interactivity
Similar to the Loading metric, this measures First Input Delay, or how long it takes the browser to respond to input from the user. Basically, if someone clicks a link or presses a button on the page, FID measures how long it takes the site to respond to that action. Again, the Google PageSpeed Insights tool can help you out, but ideally, you want to be interactive in under 100ms.
This differs from LCP because it takes into account how real users interact with your site. Nothing is more frustrating than trying to put your email into a field or filling out a form and the site is lagging behind what you’re doing. If your website is mostly text and images, this may not be something to worry about. Without a form to submit, or a login page, or a signup page where users need to input data, your page should score well on FID without any necessary changes. Again, looking in Google Search Console will give you a page-by-page breakdown of the worst FID offenders and how to improve. Some things you can do to help decrease FID are: minimizing Java Script, removing unnecessary third-party scripts, and using a browser cache.
One method that you can use to speed up your site’s LCP is to run any necessary JavaScript (JS) asynchronously to allow the rest of the page to load without being blocked by a larger JS file taking up the browser’s ability to load the page. This is especially useful for third-party JS files, like advertising and social codes, that don’t matter when in the page order they’re loaded. Again, a combination of PageSpeed Insights and Search Console will tell you where to get started.
Source: Web.dev
Visual Stability
Have you ever loaded a webpage and went to click on a link only to have something else load on the page (pushing all of the content down) and making you click on something other than what you wanted? That is Cumulative Shift Layout, the last metric considered by Core Web Vitals. In short, this is the measure of how much content shifts on the page, like images, videos, forms, and buttons. You want a CLS of less than 0.1 and Web.dev has a great article that gets into the specifics of Cumulative Shift Layout and how it’s calculated.
To help minimize CLS, set attribute sizes to your images or other media on-page to constrain those elements to one spot. If you have ads on your site, give those a set spot on the page, and if you’re going to be adding any new UI elements to the page, try to do so below the fold.
Source: Web.dev
Similar to the current existing page experience factors, Google Search Console now has a section to see how your site stacks up to these new metrics. Using a combination of Search Console, Web.dev, and Page Speed Insights, you’ll be well on your way to ranking well on the new Core Web Vitals metrics. You can learn some other helpful SEO tips to improve your organic rankings by checking out our article, 13 Best SEO Tips for 2021. There you can get ideas on how to increase your organic rankings in 2021 and into 2022.
If you have any questions on the new Core Web Vitals metrics and how they affect your website’s performance, reach out to our marketing team at [email protected].