This is a guest article by Itamar Gero, founder and CEO of SEOReseller.com, a white label referencing and provider of digital marketing solutions.
Google has released a new set of metrics called Core Web Vitals to help improve user experience. The main update for June 2021 – as google named it – was released last month, with an update expected to follow in July.
The basic update of Web Vitals aims to provide researchers with the best information and the best possible user experience.
In this deployment, Google highlights the inclusion of Pages experience as a main ranking signal. This means that in addition to quality and beautiful content website creation, websites also need to ensure that they provide the best user experience. Design and content should work together to make browsing more enjoyable for users on all web browsers.
As with past updates from Google, a given website’s ranking can go down, up, or stay the same.
Google provided information on its main updates here. However, we will provide you with a checklist that you can use to optimize the three main metrics in this update.
Largest Content Painting (LCP)
The LCP metric relates to the speed at which a page on your website loads. This includes the rendering time for items, such as an image, file, or block of text on the page. Google will measure it against when it first starts loading.
If you have things on your site that are taking a long time to load, optimize, update, or delete it.
Large files usually cause the website to load slowly, so it is best to get rid of them from your site.
In addition to affecting the user experience, LCP will also have an impact on how Google crawls your site. Slow loading elements limit the pages that Google bots can crawl and index. Fewer indexed pages can mean lost opportunities to rank high in search results.
A good LCP score is less than 2.5 seconds.
The elements largely influenced by the LCP are:
- Image elements
- Elements with a background image loaded via the url () function (instead of a CSS gradient)
- Blocks (elements with text nodes)
To check your LCP score, you can use GTmetrix, a tool created by Google where you can run your website and analyze its loading speed.
Largest Content Optimization Checklist (LCP)
- Remove large page elements. Check each page and see if there are any items that take longer to load. You can also run your page through Preview page speed to see suggestions that can make these pages faster.
- Make all your images responsive. Check that any images, videos, or block items display perfectly on all devices and browser sizes.
- Lazy loading pages. This method allows images to load when a user scrolls to that area of the page. This properly allocates bandwidth and is very useful for websites that have huge image sizes. One way to lazy load an image is through HTML.
- Remove any unnecessary third-party scripts. Third-party scripts and plugins slow down a page. So check everything you don’t need and remove or replace it.
- Simplify your CSS by eliminating unnecessary code. Remove all unnecessary parts from your codes. This will reduce the file size and speed up rendering time.
First Entry Delay (FID)
The first entry delay is a metric that measures the interactivity of your website. Interactivity refers to the moment a visitor first interacts with a page (this is any movement or action that a user performs on your page) until the moment the browser begins to process the interaction and to answer them.
Google considers your FID score to be the relevance of your website. If your website provides value to users. One way to do this is to measure the time a user spends interacting with them.
Websites should aim for an FID of less than 100 milliseconds to be considered highly engaging.
Note that delays in first user input are caused by browsers taking time or busy downloading scan scripts, assets, or performing other operations. The page will initially appear unresponsive when the user tries to interact with it. The FID measures this lack of response.
First Entry Delay Optimization Checklist (FID)
Cumulative Layout Offset (CLS)
Cumulative layout offset measures visual stability. Visual stability is affected by anything on your website that causes elements on your pages to move, move, or become unstable. A layout change occurs whenever the position of an element changes on the page
You can use Search Console to check your CLS score. A score
Aim for a score of 0.1 or less for a better page experience.
Cumulative Layout Shift (CLS) Optimization Checklist
- Include size attributes on images and video clips. This will ensure that any browser the visitor uses can allocate the correct amount of space that the item will occupy on the page. You can also reserve the appropriate space with the CSS aspect ratio boxes.
- Make sure that no content is inserted over existing content. Provide adequate space in the window to prevent items from overlapping or shifting. There are exceptions, such as when the user expects an item to move, or has performed an action that requires an item to move.
- Reserve static space for items (like images, videos, ads, etc.). Make sure you are reserving the right amount of space for the ads and make sure the ads will fill that space. Otherwise, you will have a blank area on your website.
- Provide additional space for integrations with placeholder. The integration of YouTube videos and social media posts will take up space; provide them with enough space so that the layout of the web design does not change.
Major web statistics updates highlight how much Google values user experience and speed. So, by performing well for each metric, you are not only meeting search engine expectations, but you are serving users – your consumers – better than ever before.
Here’s a recap of the checklist:
- Remove large page elements
- Make all your images responsive
- Lazy loading pages
- Remove all unnecessary third-party scripts
- Simplify your CSS by eliminating unnecessary code
- Reduce the impact of third-party code
- Include size attributes on images and video clips
- Make sure that no content is inserted over existing content
- Reserve static space for items
- Provide additional space for integrations with placeholder
There are several other ways you can improve your Core Web Vital scores. But the above checklist should help your website stay relevant to today’s discerning consumers.
Itamar Gero is the founder and CEO of SEOReseller.com, a world white label referencing and digital marketing solutions provider that empowers agencies and their local clients around the world. When not working, he travels the world, meditates or dreams (in code).