Core Web Vitals – Powering Google’s New Ranking Factor in 2021
Within the SEO and digital marketing community, it is a well-established fact that Google makes numerous changes to its search algorithms all the time. While some they introduce without making any hubbub, major changes that can massively impact organic website rankings are usually announced.
In May 2020, they announced this change in how Google Search rankings will be evaluated.
There was a new sheriff in town. Name? Page Experience.
This meant that signals measuring user experience while interacting with web pages were an important factor for Google Search ranking. Google’s mission with this announcement, as it is with most algorithm updates, was to encourage webmasters and SEO experts to reevaluate page speed and user experience.
As a result, Google observed a median increase in the use of Lighthouse and PageSpeed Insights. In addition, other tools such as Pingdom and GTmetrixs were used to improve page experience signals.
While the scores these tools provide were somewhat effective, they were more generic. Instead of focusing on individual user page experience metrics, they focus on overall page speed.
In November 2020, Google announced that the new page experience signals will be fully active in May 2021. In addition to the metrics and signals already present in Google’s Page Experience suite, this update will be powered by Core Web Vitals.
These signals will allow webmasters to generate more granular insights into user experience and incorporate changes that not only improve rankings but also how users perceive their website.
What are Core Web Vitals
Core Web Vitals are specific factors that Google Search will use to determine the user experience (UX) of your web pages. In other words, these are real-world experience signals that gauge a webpage’s:
- Load speed
- Interactivity or responsiveness
- Visual Stability, etc.
To enhance your understanding of your overall user experience, Google plans on adding Core Web Vitals data to Google Search Console. These interaction and page speed measurements include three metrics, namely the largest contentful paint (LCP), first input delay (FID), and cumulative layout shift (CLS). You will be able to see info related to Core Web Vitals on GSC.
These metrics correspond to the three aspects of web page user experience mentioned above. How?
- Largest Contentful Paint (LCP) measures the time it takes for the largest content piece, which could be text or an image, to load on the webpage.
- First Input Delay (FID) measures the time it takes for your webpage to become responsive and ready to react to user activity. This could include clicks on a button or scrolling.
- Cumulative Layout Shift (CLS) measures visual stability or unexpected layout shift on the web page as it loads. For example, a pop-up suddenly appearing on-screen as users try to click on a button.
These Core Web Vitals are not standalone. These will be joining other Page Experience signals including the following:
- HTTP Security
- Safe browsing i.e. the lack of malware
- Lack of intrusive interstitial pop-ups
Where It Will Make an Impact
Collectively, these metrics will define how well your webpage provides a user-friendly experience. Since the user’s experience includes page loading speed and similar page factors, speed will have an outsized effect on the overall user experience.
Google’s research published on their Chromium Blog suggests that webmasters that manage to meet the thresholds for Core Web Vitals can lower site abandonment. In fact, users will be 24% less likely to abandon the website. Google’s research further inspected the impact on news and shopping websites and observed similar results.
Note that while these are important to improve, especially if your website performs poorly on any of them, they’re not the end-all of page experience.
In their announcement post, Google notes that Core Web Vitals are one of 200 other ranking factors. A good grade on Page Experience doesn’t lower the importance of creating relevant content that adds value to the overall user experience. On the other hand, Google also notes that Page Experience metrics increase in importance for a website’s search ranking if there are multiple pages with similar content.
Core Web Vitals will impact Google SERPs generated on both mobile and desktop devices. In addition, Google announced that these metrics will determine whether a website appears in Google Top Stories or not, which appear above all other search results.
AMP, an open-source HTML framework used to create a webpage prioritizing speedy loading, used to be the leading requirement for topping Top Stories. Core Web Vitals will eventually replace AMP as a requirement for appearing in Top Stories.
Breaking Down the Core Web Vitals
As mentioned before, the Core Web Vitals don’t work in isolation. Other metrics also hold importance in improving a website’s overall page experience. However, the three signals Google introduced are critical in establishing an understanding of what is being measured and how it can be utilized to improve ranking.
Here is a brief explanation of the three Core Web Vitals along with tips for improving them:
What is Largest Contentful Paint (LCP)?
In simple words, LCP measures the time it takes for a user to see the largest piece of content on their screen after clicking the link. It is a form of page speed measurement and determines how fast a page loads.
Unlike other forms of page speed measurements such as Time to First Byte and First Contextual Paint, LCP represents speed metrics from the end user’s perspective.
Webmasters can check LCP scores through Google’s PageSpeed Insights. GSC provides real-world performance insights as it collects data from Chrome User Experience reports. This source is relatively more effective at determining performance as it analyzes web pages collectively. The results are a list of URLs with their relative LCP scores.
LCP Measurement Guidelines
LCP scores are broken down into three distinct categories based on load times.
- Good – load times of 2.5 seconds or less
- Needs Improvement – load times of 3 seconds or more
- Poor – load times of 6 seconds or more
Google suggests that in order to provide a good user experience, websites should aim to maintain an LCP score of 2.5 seconds or less. This means that it takes 2.5 seconds for a webpage to load the largest piece of content.
Maintaining a low LCP score for large web pages with many features can be a herculean task. Website owners might have to give up on some of those images, gifs, and videos. But something has to give for the user experience to improve.
Improving LCP Scores
Here are some things you can change to lower load times and improve LCP scores for your web pages:
- Getting rid of third-party scripts as they slow page load times
- Upgrading web hosts
- Integrate lazy loading, which loads content only when the user scrolls down the webpage
- Remove large elements, which can be checked using Google PageSpeed Insights
- Improve heavy CSS
What is First Input Delay (FID)?
FID is the second Core Web Vital that measures the time it takes for a website to become responsive. In other words, how quickly the browser is able to process and produce a result when the user interacts with a website element.
Some examples of user interactions include button clicks, link clicks, keyboard input for fields requiring user information, operating the menu, scrolling, zooming in or out on mobile devices, etc. In short, it takes into account how real-life users interact with web pages.
Websites risk abandonment if it takes too long for the user to take an action. This is why FID is imperative for web pages that have clickable elements, sign-up, and/or login buttons. A low LCP wouldn’t be effective if the user can’t really do anything on the website even after it loads within 2 seconds.
Website owners can check these FID scores on the Search Console through PageSpeed Insights. One important thing to note here is that FID will not show up for all web pages. If there is no user interaction on a certain web page, Google can’t predict FID for it.
FID Measurement Guidelines
Like LCP, Google has certain guidelines it uses to determine whether a website’s FID is good or not. The general guidelines are as follows:
- Good – load times of 100 milliseconds or less
- Needs Improvement – load times of 300 milliseconds or more
- Poor – load times of 500milliseconds or more
As suggested, in the guidelines, the FID to aim for is 100 milliseconds or less.
Improving FID Scores
- Removing non-critical third-party scripts can slow down websites, which may include heatmaps and Google Analytics
What is Cumulative Layout Shifts (CLS)?
With this metric, Google is essentially asking how fast a web page stabilizes. It can be quite frustrating when a user goes to click on a button but instead hits something else due to a sudden layout shift. This often happens when the web page is able to load a button while still loading content in the background. As soon as the content finishes loads completely, the button moves.
The other culprit affecting CLS scores is multimedia, specifically images. Often developers leave image dimensions out of the code, prompting the browser to fill that gap. This results in the website loading the text first. This invites the user to read while it loads the images in the background. When the deed is done, the images appear suddenly and mess with the text placement. The user has to then scroll up and down to figure out where they left off. All in all, this looks pretty bad where user experience is considered.
CLS Measurement Guidelines
Google has the following CLS measurement guidelines in place to determine the score. Unlike FID and LCP, CLS scores are not measured in terms of time. CLS compares frames and measures at what points shifts occur. It then reports the severity, or the Cumulative Layout Shift, of the movements.
- Good – Scores lower than 0.1
- Needs Improvement – Scores between 0.1 and 0.25
- Poor – Scores over 0.25 or more
Improving CLS Scores
With CLS, the goal is to ensure that the website stabilizes as soon as it finishes loading completely. Here are some tips that can help in this endeavor:
- Specify the dimensions of CSS images, videos, infographics, and other multimedia, which allows the browser to learn how much space is attributed to multimedia
- Similarly, intrusive interstitial pop-ups and ads should have reserved spaces
- Improving User Interface or UI design by adding them below the fold
Tools for Measuring Core Web Vitals
We’ve mentioned previously to use Google’s PageSpeed Insights to measure the scores of Web Vitals. This handy tool is full-service as it holds and compares both lab and field data (obtained from Chrome users).
In addition, there are other tools available that webmasters can use as well. Some of these include:
- Google Lighthouse is a tool that was initially meant to audit Progressive Web Applications. It is now used to track and monitor performance, offering audits and SEO checks that PageSpeed Insight might not provide.
- Core Web Vitals report (Chrome User Experience Report) offered for Chrome 88 has developer tools.
- Website owners can also get insights from Google Search Console through Core Web Vitals.
When does Core Web Vitals become a ranking factor?
The addition of Core Web Vitals and Page Experience as a tanking metric was announced in 2020. But then came along COVID-19 and the pandemic led to Google pushing back the release within the algorithm. But in its usual fashion, Google gives webmasters some leeway to prepare for the update to roll in. As of the time of this publication, the update is set to launch in June 2021.
This gives SEO experts a little time to reevaluate websites and make the changes mentioned above to improve their page experience and have a chance at maintaining or improving their ranking.
Core Web Vital FAQs
How do I find the largest Contentful paint?
You can find these in Chrome Dev Tools. In the Performance tab, click Record and then look in the timings section. Here you should see the LCP marker. Click on this and it will highlight the object on the page.
What affects the largest Contentful paint?
Normally, this is the largest image or text block that is visible above the fold. This could be a hero image, navigation, or any other element in the users’ viewport.
What is a good first contentful paint?
What is a good FCP? The First Contentful Paint should be less than 1.8 seconds.
What is the difference between LCP and FCP?
The First Contentful Paint (FCP) is determined by the time it takes for the first text or image to appear in the users browser. Largest Contentful Paint (LCP) is the time it takes for the largest of those elements to appear.
With a lot to consider in terms of Page Experience and Google SERPs, the introduction of Core Web Vitals might seem like an overwhelming undertaking. It’s important to note that the changes made to secure a good, if not perfect, score have multi-fold benefits.
It’s not only a considerate change for the users, making the website easier to navigate. In turn, it improves conversions, and ultimately, the bottom line.
So from here on out, the goal is to make improvements that ensure a 2.5-second load time, 100 milliseconds long First Input Delay, and 0.1 CLS score. These lay the groundwork for prioritizing user experience and improving the performance, responsiveness, and visual stability of most mobile and desktop websites.
With that, website owners, SEO experts, and webmasters have tools to pave their way to an awesome website. Good luck!