Updated Core Web Vitals and guidelines for improving site pages to comply with it

Since its founding in 1998, Google has given increasing importance to the user experience, which prompted it to constantly update its algorithms. It recently officially announced the inclusion of what it called Core Web Vitals (basic web performance indicators) in the ranking of search results, within the framework of the “Page Experience Update” initiative, which includes other ranking factors, such as compatibility with smart devices and SSL certificates. Explanation of the Core Web Vitals update and instructions for improving site pages to comply with it. Core Web Vitals standards provide an opportunity to improve your site's ranking, but only if you understand them correctly, and know what you must do to make your site compatible with them. That is why we provide you here with a detailed explanation of this update, and we introduce you to the most important tools that enable you to evaluate the extent of your site’s compatibility with it, and we provide you with the most important instructions that must be followed to improve the site’s compatibility with its three factors.

What is the Core Web Vitals update? Core Web Vitals are 3 important specific factors that measure the speed of a web page and its interaction with the user, that is, the performance of the page according to Real World Usage Data, and are part of the criteria for the “Page Experience” score. The Core Web Vitals factors include three factors: Speed ​​of displaying the largest piece of content on the page (LCP) First Input Response Time (FID) Cumulative Design Variables (CLS) An image showing the correlation of the Core Web Vitals with the page experience Core Web Vitals refresh factors Each of the previous three factors - which represent the Core Web Vitals - measures something specific related to the user experience, and they are page-specific factors, that is, each page of your site has independent values ​​from the other.

Here we explain what each of these factors measures, and in the next paragraph we explain how to determine the measurement value of the page for each factor. The speed factor for displaying the largest piece of content (LCP). LCP measures the speed of loading the page, but it differs from other metrics that measure speed, such as TTFB and FCP, which measure the response speed of the web server, and the time required to display the first element of content, respectively, as this factor depends on the time required to display the largest visible element of the page content that is supposed to be located within the display area. Depending on the number that the page's largest content display speed factor shows, the state of a page is defined as either “good,” “needs improvement,” or “slow,” and the following image shows the boundaries between these states: LCP state limits First Input Response Timeout (FID) The FID measures the level of page interactivity, and represents the time required for the browser to respond to any interaction that the user makes with the page for the first time, whether this interaction is clicking on a button or A link, or entering an email into a field, etc. This metric is important on pages where the user needs to perform an action, such as login or registration pages on the site.

Depending on the value of the First Input Delay (FID), a page can be rated as Good, Needs Improvement, or Bad. The following image shows the values that make a page belong to each state: First Input Delay Limits Cumulative Design Variables (CLS) The CLS (the third Core Web Vitals indicator) measures the page's visual stability, that is, the amount of unexpected change in the page's design. The more elements on the page move, the higher its CLS, and the worse this is. This factor takes zero or any positive number, where zero indicates that the positions of page elements do not change unexpectedly (without user interaction). Google considers page visual stability important, as it says that difficulty for the user to interact with page elements due to their changing locations is one of the characteristics of a poor user experience. Also, if the positions of visible page elements are stable while loading, users will not have to re-search for the links, images, and fields they saw while loading the page after the browser has finished loading.

Optical stabilization will also prevent the user from clicking on elements by mistake. It should be noted here that the belief that the Cumulative Design Variables (CLS) factor only measures the visual stability of the page while it is loading is a misconception, as this factor measures the stability of the page throughout the entire life of the page. Like LCP and FID, the CLS factor is either good, in need of improvement, or bad, and the boundaries that separate these states are shown in the following image: Boundaries of the CLS factor states The following table summarizes the concepts of the three Core Web Vitals factors, and explains the values they can take, and when the values are considered good, bad, or in need of improvement: Table summarizing the concepts of the Core Web Vitals factors and the boundaries of their respective states Measuring core web performance indicators (Core Web Vitals) Currently, there are many methods and tools. Measures Core Web Vitals factors of web pages, including: Google Search Console.

PageSpeed ​​Insights Toolkit. Google Lighthouse tool. Chrome DevTools.

Web Vitals add-on for Google Chrome. We will not explain here all of the Core Web Vitals measurement tools mentioned above, but we will explain the first and second tools, as well as the Google Chrome plugin (Web Vitals) that you can install on your browser from here. 1- Google Search Console Tools Google Search Console tools provide you with a lot of data about your websites, and a Core Web Performance Indicators report has been added to it, which provides you with the ability to view the current and past status of your site addresses, on mobile phones and computers, each one separately. When you open the Core Web Vitals report page for your site, you will find two cards, the first showing the site’s performance on mobile phones, while the second shows its performance on computers, and you will be able to open the Core Web Vitals report on either of them by clicking on the “Open Report” button located at the top. The card.

Core Web Vitals report for a site in Google Search Console. If you click on the “Open Report” button located in the two cards, the tool will show you more detailed data about the good, bad, and need-to-improve pages on your site, taking into account the three Core Web Vitals factors, and you will be able to export the report in the form of a Google spreadsheet, Excel file, or CSV file by clicking on the “Export” button. Google Search Console Mobile Core Web Vitals Report We'd like to point out that the Google Search Console Core Web Vitals report may not include all the web pages on your site. It only shows URLs that have been indexed, and which have a minimum amount of data to calculate at least one of the three factors. 2- PageSpeed ​​Insights Toolkit PageSpeed ​​Insights provides you with a lot of data about any web page you have a link to, as - unlike Google Search Console - you do not need the web page to be part of a site you own to know the status of its Core Web Vitals factors, but it is only enough for you to enter the page link, then click the “Analyze” button.

Core Web Vitals values ​​for a web page from PageSpeed ​​Insights It is worth noting that you can get the Core Web Vitals values ​​for the page on a mobile phone and on a computer, by switching between two tabs by clicking on the two icons located at the top right in the previous image (mobile - desktop). A3- The Web Vitals add-on for Google Chrome is the ideal solution for knowing the values ​​of the Core Web Vitals factors for a page you are browsing, as after installing it, it measures the LCP, FID, and CLS of all pages you visit if they are activated. Notice in the following image, the plugin calculates the LCP and CLS factors for the search results page on Google by simply searching for the phrase “WordPress in Arabic,” and it waits for interaction with one of the page elements to occur in order to calculate the FID factor.

Values ​​of basic web performance indicators for the search results page for WordPress in Arabic from the Web Vitals add-on. It must be noted that in order for this add-on to calculate the factors correctly, the tab must be open from the time the page begins to load until it is fully loaded, otherwise the add-on will show unreal numbers. Also, the values ​​of some factors are affected by the speed of your Internet connection, and perhaps the specifications of the computer you are using, so we do not advise you to use this method to measure indicators.

Does it improve page compatibility with Core Web Vitals

What is its place in search results? Google developed the Core Web Vitals factors primarily to help content publishers improve the user experience, but these factors have recently become secondary factors in ranking search results, meaning that pages that match the core web performance indicators will have priority in rankings if other ranking factors are equal. However, the Core Web Vitals factors have not become a decisive factor in the rankings, as some articles have exaggerated their importance.

Dr. John Mueller from Google confirms that relevance to the topic being searched, and which the user wants to reach, is still the most powerful factor in ranking. But this does not mean that you should ignore these factors. Although they may not have a significant impact on the rankings (because they are a secondary ranking factor), if your site is not compatible with them, it will have many negatives that have a strong impact, such as lower profits and lack of popularity, which in turn leads to a lower ranking as well. Therefore, your site’s compatibility with basic web performance indicators positively affects the ranking of its pages in two ways, one directly resulting from the search engine’s preference for pages that match these indicators, and the other indirectly provided by the popularity of your site in multiple ways, such as increasing the number of links that lead to the site’s pages (Backlinks).

Compatibility with Core Web Vitals Although making your site pages compatible with basic web performance indicators will not move them from the tenth page to the first page of search results, as we explained in the previous paragraph, these factors still have an impact on rankings, so we will highlight here the most important practices and methods that are useful in making your site pages compatible with them. Practices to improve LCP If your LCP is low, doing the following will help increase it: Remove unnecessary third-party scripts. A study found that each of these scripts slows down the page by 34 milliseconds. Improve the server response time if it is high. The slower the server response, the longer it takes to display any element on the page, and the higher the LCP.

Minimize CSS files, postpone the browser reading unnecessary files, and try to place the necessary CSS codes inline. Optimize and compress images, use modern formats such as JPEG 2000, JPEG XR, or WebP, and do not use images that are not related to the topic. Fetch important items and have the browser load them before others.

Use Lazy Loading, which loads content on demand. For example, if you use lazy loading, web page images will load when they become part of the browser's display. For more tips that enable you to increase the loading speed of your WordPress site pages, and reduce the time that visitors must wait until they get what they want, see the comprehensive guide to increasing the speed of your WordPress site.

Practices that help improve FID Executing heavy JavaScript (JS) codes is usually the main reason for the long response time to the first input (FID), as it is almost impossible for the user to interact with the page while the browser is loading JS, so improving the way JavaScript is analyzed and executed, postponing its execution, and minimizing it will have a positive and direct impact on the FID. Other practices that can improve response time to first input include: Removing unnecessary third-party scripts. Use the browser's cache, as this helps the browser load JS faster.

Useful CLS Optimization Practices Cumulative design variables optimization practices are primarily based on making elements not move unexpectedly (that is, without the user interacting with the page in a way that causes the elements to move), because this factor measures how much the page layout changes between two displayed frames. The main things you can do to reduce the value of CLS include: Use the width and height properties of media, whether it is images, videos, or graphics. Reserve enough space for inclusions and ads so that their sudden appearance does not push other elements to the bottom, top, or side.

Do not insert new content on top of existing content, unless it is in response to user interaction with a page element. To this point, we have finished explaining the Core Web Vitals update (basic web performance indicators), introduced you to the most important tools that enable you to measure its factors, pointed out its role in ranking the site’s pages, and highlighted the most important procedures and practices that will help improve the values ​​of the factors of this update. In the end, we note that these factors were originally developed to help you improve the user experience. Even if their impact is not decisive in the ranking of search results, you must still improve their values ​​in order to provide an optimal experience for your website visitors.