At present, Core Web Vitals has become a trending topic in the SEO community. Improving the core web vitals lead to a better user experience and also it has now become the major ranking factor for Google Search. The rollout started in the mid of June 2021 and was into effect by September 2021.
Before moving to the topic let’s see a brief introduction about core web vitals!!
What are Core Web Vitals?
Core Web Vitals are said to be a set of metrics related to speed, performance, responsiveness, and other factors which improve the user experience.
The Web Vitals are divided into two namely Core Web Vitals and Non-Core Web Vitals.
Core Web Vitals are
- Largest Contentful Paint (LCP),
- First Input Delay (FID) and
- Cumulative Layout Shift (CLS)
Non-Core Web Vitals are
- Total Blocking Time (TBT)
- Speed Index (SI)
- Time to Interactive (TTI)
- First Contentful Paint (FCP)
The below picture shows the loading of a page and the role of different metrics :
Before moving to the explanation of the core web vitals, their importance should be explained. The website visitors do not have patience and are looking for a site that provides the content very fast. So it is very important to increase the speed and performance for a better user experience.
Let’s now move on to each core web vitals in detail.
Largest Contentful Paint (LCP)
Largest Contentful Paint (LCP) is one of the Core Web Vital that time measured in seconds from when a webpage starts loading to when the biggest text paragraph or image is displayed on the screen.
The main objective of LCP is to measure when the loading of the main content on the page is finished. The lesser the LCP, the better will be the user experience. A fast LCP ensures the users the particular page is useful.
While loading a page, the biggest block may change and the recent candidate is chosen in the case of measuring LCP.
For instance, consider when at the beginning an H2 heading is the biggest text block, but later on, when a large size image is loaded, the image is then considered the leading candidate in measuring the LCP.
How to assess your LCP score
- Good: <= 2.5s (2.5 seconds or less)
- Need to improve: > 2.5s <= 4s (between 2.5 and 4 seconds)
- Poor: > 4s (more than 4 seconds)
Reason for Poor LCP Score
Slow response time of the Server, render-blocking JavaScript, and CSS, and having your largest content resources are very heavy and require a long time to load are the reasons for poor LCP score. Optimizing the above-mentioned factors can help you to improve your LCP score.
First Input Delay (FID)
First Input Delay (FID) is a Core Web Vital that is measured in milliseconds when the user interacts with the web page for the first time. It can be clicking a link or submitting a button.
The FID does not consider the time taken by the browser to process the event nor the time taken to modify the user interface.
Scrolling or zooming is not considered or counted as actions because they are frequently used processes and have different performance constraints as the scrolling is undertaken by GPU instead of CPU.
How to assess your FID score
- Good: <= 100ms
- Needs improvement: > 100ms and <= 300ms
- Poor: > 300ms
Reason for poor FID
The main reason for having poor FID is that the main thread of the browser may be busy with parsing and running the Javascript code. It can’t respond to a user’s interaction when the main thread of the browser is busy with other tasks.
Cumulative Layout Shift (CLS)
CLS (Cumulative Layout Shift) is an effective indicator of a website’s stability by tracking the user’s visual experience on a page. It quantifies changes in a layout that can happen as a user navigates a website. Improving user experience and usability means lowering this score.
How to assess your CLS score
- Good: <= 0.1
- Needs improvement: > 0.1 <= 0.25
- Poor: > 0.25
Reason for poor CLS Score
Unexpected shifts occur when image elements with undefined dimensions are loaded asynchronously and when the DOM elements are added dynamically to the web page, the above content that is existing are already been loaded. This led to the already loaded content getting pushed away.
Including size attributes for your images and videos can prevent these unexpected layout shifts. Do not add content above the content that has been already loaded.
How to assess your Core Web Vitals Score?
Core web vitals can be measured by running the PageSpeed Insights test on the page. Your page must pass all the above Core Web Vitals to pass the Core Web Vitals assessment. PageSpeed Insights is a valuable tool to measure the speed of the web page. If the speed is low, optimize your website to reach a score above 85.
How can you find your Core Web Vitals Score?
- Page Speed Insight:
To improve your Google results, you must optimize the page speed of your web page. Pagespeed Insights is a valuable tool that allows you to assess the user-end performance of your website by examining its speed. The score ranges from 0 to 100. Above 85 is considered to be the good score
Google Page Speed Insight focuses on various factors to determine the speed of your web page. Some of these elements are:
- Loading time for content above the fold:
- Time to load the whole page
- Lighthouse:
According to the Lighthouse scoring documentation, the Pagespeed score is calculated by measuring the following parameters:
- FCP (First Contentful Paint): In this step, the image or text appears or paint for the first time.
- First Meaningful Paint (FMP): This is where the page’s primary content appears.
- Speed Index (SI): The page load time measures how quickly the contents of a web page appear.
- FCI (First CPU Idle): When the main thread is idle enough to accept input.
- Time to Interactive (TTI): It occurs when the principal network and thread have been silent for at least 5 seconds.
So check whether the following metrics scores are high. According to Google, the user experience is the main factor in determining website rankings in the future. As more improvements are done on the web page, factors like core web vitals will become more relevant.
The website designing experts can help you optimize your website according to the core web vitals score. Reach out to the best web designing agency to start your optimization process for the Google Page Speed Experience.
