Site owners need to keep up with important algorithm changes to ensure their website performs well for both users and the search engines. But, how do site owners do this?
Numerous measurement tools exist with the sole purpose of helping you understand, analyze, and know your website’s statistics to help you better understand how your website is performing.
Many of these tools are owned by Google to help site owners optimize their websites for users and search engines.
The latest digital marketing trend focuses on core web vitals which focus on three crucial aspects for users – Largest Contentful paint, First Input Delay, and Cumulative Layout Shift.
Before we dive into that, let’s talk about web vitals.
Web Vitals
Web Vitals is a Google initiative designed to give site owners guidance on how to give users the best experience possible.
Site owners can focus on tons of metrics when running a website. Unfortunately, it’s easy to invest too much time and energy on data points that you don’t understand, which doesn’t help you make necessary improvements.
Google has turned its attention to three web vitals known as the Core Web Vitals to simplify things. These core web vitals should be applied to every page of your website, and measuring core web vitals is easy with Google’s free tools, which we will discuss later.
The main Core Web Vitals revolve around three UX (user experience) criteria for each web page:
- Visual page stability
- Interactivity (page responsiveness)
- Loading times (website speed)
Non-core web vitals include your page’s ratings for safe browsing, mobile-friendly, HTTPS, and no intrusive interstitials.
Core web vitals represent everything your website should be doing to help encourage user interaction, satisfaction, and overall user experience.
Let’s dive in.
Core Web Vitals: What are They?
If you’re hearing about core web vitals for the first time, you’re not the only one. This topic came to the forefront of digital marketing in November of 2020. But Google didn’t add this core web vitals metric to its ranking algorithm until June 2021. But now, page experience is an official ranking factor for Google. There are around 200 total factors.
Each core web vital is a measurable metric based on a specific user experience and interaction area that comes from statistics from real-world users.
While web vitals, in general, cover many different statistics about your site metrics, focusing on the three core web vitals is crucial for understanding your customers’ experiences with your site.
Here are the three core web vitals in more detail.
- LCP – Largest Contentful Paint – refers to the performance of your website while loading. A good LCP value is 2.5 seconds from starting.
- FID – First Input Delay – is the metric for page interactions and should be lower than 100 milliseconds.
- CLS – Cumulative Layout Shift – defines your site’s visual stability and needs to fall below 0.1.
User Experience Fundamentals
If you want the best rankings for your site, you should focus on the three core web vitals and the other non-core factors. But first, you need to address general user fundamentals.
Google currently implements multiple UX metrics for ranking. Addressing these can affect how users interact with your website, which will ultimately help your page experience scores.
- Securing your server with HTTPS – Since 2014, Google has been using HTTPS as a ranking signal to rank sites higher that offer a secure and safe interaction. By converting to HTTPS (HyperText Transfer Protocol Secure), which provides encryption for data sent through a site, you’re giving your users a safer browsing experience and appeasing Google.
- Using mobile-friendly websites – Google’s algorithms focus on mobile-friendliness. AMP – accelerated mobile pages – was created to ensure users get the best experience with mobile devices since most organic search traffic comes from mobile devices (61% in 2020).
- Lack of poor quality or spam content – Google does its best to eliminate sites from its index with malware, spam comments, pop-ups, fake or unreliable information, or poor quality content.
Now, back to the core website vitals.
Largest Contentful Paint (LCP)
LCP – largest contentful paint – focuses on how long your page takes to load for a user and encompasses the time it takes between clicking on the link from the search results until most of the content appears on the screen.
But, it’s more than your page speed, which shows how fast the page loads but not the experience a user has while opening your webpage. LCP helps you to understand better how users interact with your site.
What does LCP measure?
Largest Contentful Paint is the time it takes for a webpage to display most content – defined as the content above the fold without scrolling – and a user’s interaction.
This metric applies to the load times of relevant content, including:
- Video thumbnails
- Images
- CSS background images
- Image tags
- Text elements – headings, lists, paragraphs
LCP is measurable with two methods.
First, the field method refers to measurements taken on the site or lab tools in which algorithms run performance simulations.
To perform an LCP measurement with the field method, you can use tools like Search Console – Core Web Vitals Report – Chrome User Experience Report, or PageSpeed Insights.
Using lab tools, you can measure your site’s LCP with tools like Lighthouse, Chrome DevTools, or WebPageTest.
Google sets specific performance standards for LCP ratings. For example, their algorithm lists three ratings for LCP speeds.
A website with speeds less than 2.5 seconds classifies as good. If your website speed is less than 4 seconds, your site needs improvement. If it takes longer than four seconds to load, you’re likely to start losing customers and therefore need to make significant changes to better optimize your website for users and Google.
How to Improve LCP on Your Site
The good news is that you can do things to improve your site’s LCP.
First, it’s crucial to regularly track your site’s performance, including daily or weekly analyses. Start by checking these principal components.
- Image size – the ideal size of your images will vary, depending on your web host’s dimensions and the version – mobile or desktop. The wrong size image can cause overloading, the leading cause of high LCP.
- Image CDN – you can speed up image load times using a CDN service (try ImageEngine). These tools use file size, device type, and user location to display an image correctly.
- Avoid JavaScript – LCPs can experience delays in loading speeds when your website runs JavaScript.
- Pick the right hosting service – your website page load times are largely dependent on the hosting service you choose, making it crucial to find a site with the proper infrastructure to accommodate your website’s volume and size.
First Input Delay (FID)
FID – First Input Delay – is the metric that measures how long it takes from the time a user visits your site until they interact with it.
There are different ways users can interact with your website including adding content to a form, clicking a link from the navigation menu, or using a mobile device to open an accordion text.
What does FID measure?
FID is an essential factor for Google rankings, as it displays statistics about how real users behave with your website. Specifically, it’s the measurement of how long a person is on your site before they do something on your page.
Websites that offer a lot of reading content but not anything that requires users to engage with the site may have low to no FID scores.
Google considers sites with an FID below 100 MS good, while those with more than 300 MS will need improvement. And if your website scores 500 MS or higher, you’ll get a poor rating.
How to Improve FID on Your Site
If your site doesn’t have an FID, there’s nothing to change. But if you have a website with a poor FID, try addressing these areas.
- Get rid of non-critical third-party scripts – third-party scripts can affect your site’s core web vitals, so eliminate any that aren’t crucial for your site’s performance (heatmaps, Google Analytics)
- Add a browser cache – browser caches allow content to load faster and enable the browser to speed up JavaScript loading tasks.
- Reduce or defer JavaScript – while JavaScript loads, it’s impossible for users to interact with your site, extending the amount of time it would take for users to get to business, causing a high FID
Cumulative Layout Shift (CLS)
CLS – cumulative layout shift – refers to a page’s stability as it loads – or visual stability. To make it easier to understand, if parts of your site move instead of staying in place while the page loads, your site will have a high CLS.
Having elements that move around can make your site more difficult to navigate for users. For example, your page might keep changing while it’s loading, or it could cause an accidental click on an improper link causing bad user interaction and user experience with your website.
What does CLS measure?
CLS is the sum of individual layout shift scores, accounting for any unexpected shifts in the site’s layout throughout the page’s lifespan.
Sites that don’t experience any shifting will have a score of zero.
Google ranks a CLS as good with a 0.1 score, needs improvement for a 0.2 score, or poor with a value of 0.3.
How to Improve CLS on Your Site
To improve your site’s cumulative layout shift, try these steps.
- Assign fixed size attribute dimensions for media – by telling the browser what size the media will be once the page is loaded.
- New UI elements should go below the fold – this placement will keep your content in its place rather than pushing it down and out of sight.
- Give ads elements an assigned space – not defining where ad elements should go can result in them going anywhere on the page at random, causing content to go down, up, to the side, or be covered.
Tools for Core Web Vitals Metrics
Google PageSpeed Insights is a great free analytical tool to help you get insight into your website’s performance. This data will also help identify issues like high values of LCP, FID, and CLS.
To check your site’s performance, go to the insights page and enter the URL of your webpage. Then click the analyze button. It only takes a few seconds before receiving a report with an overall performance score and a category breakdown.
The categories you’ll see statistics for include:
- Performance – Overall score
- Field Data – Real-world data from Google (when possible)
- Origin summary – Core Web Vitals
- Lab data – Lighthouse metrics
- Opportunities – How to make the page faster to load
- Diagnostics – Additional performance information
You can also get your FID, LCP, and CLS metrics from the Google Search Console. The Core Web Vitals report in Search Console will define your site’s performance, broken down by metric type, URL group, and status.
The overview page gives you a breakdown based on the desktop or mobile URL used and is grouped into three statuses (good URLs, URLs need improvement, or poor URLs).
The summary page gives you a position and issues for your URLs.
Other Important Website Health Metrics
How your web pages perform has a significant effect on your site’s metrics for multiple reasons. First, the longer a page takes to load, the more at risk your site will be for bounce rates.
When page load time increases from a single second to three seconds, the bounce rate has a 32% increase. And if load time goes from one second to six, the bounce rate increases by 106%.
First Contentful Paint
FCP is the amount of time it takes a browser to produce DOM elements (SVGs, non-white elements, images) and identify resources for render-blocking.
First Contentful Paint (FCP) falls into a range of scores, labeled by color to identify speed in seconds. Green – fast – is 0 to 2 seconds. Orange – moderate – is 2 to 4 seconds. For more than four seconds – slow – the color will be red.
Speed Index
Speed index (SI) gives you the average time it takes the FCP content on your site to display. You can use this metric to spot heavy use of JavaScript, measured in milliseconds.
These metrics are also color-coded, green – fast – falling between 0 and 4.3 seconds, orange – moderate – 4.4 and 5.8 seconds, and anything slower than 5.8 seconds will be red and labeled slow.
Time to Interactive
Time to Interactive (TTI) is how long it takes your site’s content to become interactive and fully functional. This metric will also help identify uses of JavaScript that you can block, measured in seconds.
Green – fast – is the interaction between 0 and 3.8 seconds. If it’s orange – moderate – the metric will fall between 3.9 and 7.3 seconds, and anything slower than 7.3 seconds will be red and poor.
Total Blocking Time
TBT (total blocking time) is how long web pages respond to a specific input, measured by MS (milliseconds).
If it’s green, the score will fall between 0 and 300 ms, 300 and 600 ms is orange, and red is 600 and over.
Page Performance Scores
The page performance score is an individual metric encompassing all the Core Web Vitals metrics and scored on an aggregate scoring system for desktop and mobile visits.
Reference scores for each category can fall into good (90), needs improvement (50 to 90), or poor (below 50).
Web Vitals: It’s Your Turn!
Google is constantly changing the way they rank websites in their search engine. Therefore, keeping track of your website’s performance is integral to your business.
If tackling your web vitals sounds intimidating, Trusted Search Marketing offers multiple SEO services to assist.
Let’s chat to find out how we can help you today.
