Core Web Vitals: The Most Important Facts for Better Google Rankings
We explain to you what the Core Web Vitals are all about, how to check your website and optimize your scores.
- What are Core Web Vitals?
- Mobile vs. Desktop - What counts?
- Core Web Vitals and their significance as a Google ranking factor
- Consequences of the Core Web Vitals for SEO practice
- What are optimal values in the Core Web Vitals?
- How are Core Web Vitals measured?
- Beginners and professionals: Which tool would you like?
- How can you optimize the Core Web Vitals?
- Core Web Vitals: routine check-ups to avoid expensive damage
Core Web Vitals are the weak points of millions of websites. We jump back to January 2022: SEO powerhouse Ahrefs studies 5.2 million websites. The result: Only 33% of them achieve satisfactory Core Web Vitals. It's high time for marketing and SEO teams to wake up. Why and how, you can read here.
What are Core Web Vitals?
Behind the keyword Core Web Vitals are three ranking factors in total:
- Load time - Largest Contentful Paint (LCP):This metric describes the time span from the call of a website to the moment when the main content in the visible area (above the fold) is loaded.
- Interactivity - First Input Delay (FID):The metric indicates how long it takes from the first interaction of users with a page - for example, a click on a button - to the website's response.
- Visual Stability - Cumulative Layout Shift (CLS):The metric measures how stable the website layout is and quantifies whether and to what extent design elements shift during use.
Google only introduced the ranking factors at the end of August 2021. Since then, they have been used to evaluate a website's user experience. In other words, the factors reflect how well a website is received by users.
Mobile vs. Desktop - What counts?
For a long time, Google has been pursuing a mobile-first approach, i.e. it takes into account the performance of mobile websites as a ranking factor. Therefore, also with the Core Web Vitals: The optimization of mobile presentation has priority. Still, the desktop version of the website should not be completely neglected.
If resources are limited, taking a look at the buyer personas and conversion paths will help: Which end devices is a large proportion of customers using to access the website? In the end, the goal is to provide a real users with an optimal experience. How to create, for example Buyer Personas for your international marketing campaign you can find out in the Contenthub from OMR Reviews.
Core Web Vitals and their significance as a Google ranking factor
Whoever achieves top values in the Core Web Vitals shows Google that his websites are user-friendly. But the three factors only make up part of the user experience. They are included in the comprehensible ranking factor Page Experience (user friendliness).
In addition, the factors that have been used for a longer time continue to count:
- Mobile friendliness
- Secure website code (Safe Browsing)
- HTTPS encryption
- Renunciation of interstitials (interrupting advertising)
Core Web Vitals as a factor for the Page Experience Source: Blog from Google Search Central
In the coming years, more factors are supposed to be added to cover user expectations even more comprehensively. Since 2022, for example, Google has been experimenting with the factor "Interaction to Next Paint (INP)", which is supposed to depict the speed of a website's response throughout the entire visit of users. Also being discussed as another factor is "Smoothness". This metric is supposed to make it measurable how smoothly animations are displayed and how smoothly users can scroll on a page.
It is not predictable how the current set of metrics for measuring the user experience will develop. However, it can be assumed that Google will continuously further develop both the factors themselves and their reference sizes. Load times that were considered excellent ten years ago are at best standards today - and what excites today may need improvement in a few years.
Consequences of the Core Web Vitals for SEO practice
Core Web Vitals are important in order not to sabotage your own SEO ambitions. Like the page experience as a whole, the values refer exclusively to the technical aspects of a website. This means for marketing and SEO teams: It's of little use if all pages shine with perfect Core Web Vitals, but the content does not meet user interests and the texts ignore SEO best practices.
If three quarters of the articles consist of poorly adapted content from competitors, authors stuffing keywords into every second sentence, and external and internal linking leave a lot to be desired, these websites will not rank well despite the best Core Web Vitals.
On the other hand, it also applies:Defects in the Core Web Vitals are not a knockout criterion for good organic Google rankings. High content relevance and strategic content preparation will usually compensate for technical weaknesses.
However, this is not a reason to neglect the Core Web Vitals. Good Google rankings are only the first step. They do increase website traffic, but have hardly any business value if visitors quickly leave the website due to poor user experience. Optimal Core Web Vitals are therefore not a favor to Google, but in the self-interest of website operators who want to win leads and customers.
What are optimal values in the Core Web Vitals?
Google often remains silent about the exact relevance of ranking factors, but at least in the case of the evaluation criteria of the Core Web Vitals, the developers are transparent:
The three important values of the Core Web Vitals and their optimal values (Source: SEO Southwest)
How are Core Web Vitals measured?
Google provides various tools to check the Core Web Vitals. Depending on which tool you choose, lab or field data will be used to calculate your scores.
- Lab data (Lab Data): Measurements are performed with hypothetical user data in a technically controlled environment, usually in Google Lighthouse
- . Field data (Field Data): Actual, anonymized user data is evaluated to calculate the score. Google collects this data via the Chrome browser, but also provides JavaScript integrations for more accurate results.
Tools that are based on lab data are easy to use, and as a user you have the advantage that you can quickly and easily get a first estimate of your Core Web Vitals. However, field data is more accurate. Those who want to evaluate it, however, must bring a bit more technical expertise.
Google's rating is based on field data, according to the company.
Beginners and professionals: Which tool would you like?
Both non-developers from marketing teams and experienced developers will find the right tool for their tasks in the range of tools available.
Tool | Non-Developer | Developer |
UX-Report | X | |
PageSpeed Insights | X | |
Serach Console | X | X |
Lighthouse | X | |
Chrome Dev Tools | X | |
Web Vitals Extension | X |
UX Report
Google's UX Report, short CruX, analyzes a share of real, anonymized Chrome user data that is stored for millions of websites in the cloud. Developers can retrieve the data via the CrUX API. However, results are only available if the website traffic reaches a certain threshold. Websites with few visits are not included in the database.
Step-by-step instructions: How to create a CrUX report
PageSpeed Insights
The online tool is ideal for non-developers. You just enter the URL and can see your results directly. An end signal evaluation is combined with a detailed report PageSpeed Insights uses field data from the CrUX database. For new or little-visited websites, therefore, the tool does not work.
Search Console
The focus of Google Search Consoleis actually search engine performance, but a Core Web Vitals report is integrated. The data comes from the CrUX database like PageSpeed Insights. The tool is suitable for more comprehensive analyses, but its usability is manageable for both developers and non-developers.
Lighthouse
The tool is aimed at developers and shows them possibilities for performance optimization already during the development phase. Since Lighthouse works exclusively with laboratory data, it should not be your only basis for evaluating the Core Web Vitals, but should be supplemented later with field data analyzes.
Chrome Dev Tools
For a first overview, call up the developer tools in the Chrome browser via the shortcut Ctrl+Shift+I. In the Performance tab of the tools, in addition to information about CPU and network activity, you can also find the Core Web Vitals of a website. A disadvantage of this solution: The Developer Tools work exclusively with lab data.
Web Vitals Extension
The Chrome extension measures changes in the Core Web Vitals in real time. The tool is helpful for a quick check. If you want to find out what specifically triggers the changes, you should use more comprehensive tools such as Lighthouse as a supplement.
For those who prefer it even more convenient: Good SEO Tools always offer a performance measurement for websites as well. A look at the heavyweights of the SEO world:
- In Sistrixusers can have their website checked in the Optimizer. The analysis here is based on lab data from Google Lighthouse.
- Semrush also uses Google Lighthouse: Simply enter the desired URL in the Site Audit section and the platform generates a detailed, visually prepared report.
- Ahrefs takes the Core Web Vitals into account optionally. Users must activate an integration via the Google PageSpeed Insights API in the settings for site audit.
How can you optimize the Core Web Vitals?
Straight away: There is no simple and no universal way to optimize a website's Core Web Vitals. Technically, the optimization is one of the more challenging disciplines of technical search engine optimization. What actions you take depends on the system you use and the individual possibilities.
Here are a few starting points for optimizing the three factors:
Largest Contentful Paint (LCP)
- Server response times:The slower the server sends information to the browser, the longer it takes for the LCP. To reduce server response time, using frameworks to render website content directly in the browser helps. Content Delivery Networks can also be an option. They respond to requests from a server close to the user's location.
- Avoid Rendering Blocking:JavaScript and CSS resources need a lot of computing power and delay the loading of the LCP. Check what elements you can do without to improve the user experience. Compress necessary CSS and JavaScript, use asynchronous loading, and inline critical CSS.
- Reduce load times of large content elements:Images, videos, and large chunks of text can delay load times. What helps: Use suitable file sizes directly, preferably pre-load elements, and use new data formats with high compression. You can also specify that videos are displayed instead of images if the data transfer rate falls below a certain threshold.
First Input Delay (FID)
- Speed up JavaScript execution:If the runtimes of JavaScript tasks are over 50 milliseconds, it's time to optimize. If JavaScript is dispensable, it should be removed.
- Reduce third-party code:If you use third-party code for widgets, animations, or other elements, this must be fully executed before your own website code is loaded. This slows down the time until the FID. So the rule here too is: less is more. On-demand loading of third-party code or prioritized loading can also be options to improve the FID score.
- Relieve the browser's main thread:The more complex the design and the more special effects, the greater the computational load in the main thread and the slower the website loads. Conversely, reduced layouts reduce the number of requests to be executed and speed up the display.
Cumulative Layout Shift (CLS)
- Provide images and videos with size attributes:Elements without size specifications can mess up the layout when loading. Instead of fixed sizes, you can also define page ratios dynamically via CSS.
- Leave sufficient distance around visual elements:Most website themes already place elements with sufficient distance so that there are no layout shifts with different display sizes. However, anyone who makes changes to the design should make sure that the elements have enough space to breathe.
- Placeholder for dynamic content:When elements are loaded after a user action, this can lead to unsightly layout shifts. If you can't or don't want to do without pop-ups or banners, for example, because a DSGVO notice needs to be placed, work with a placeholder in the viewport.
Some optimizations can be carried out by marketing teams themselves - for example, choosing the right image sizes and formats, avoiding elaborate videos in the upper area of the page. Others need more programming knowledge. As so often in search engine optimization, teamwork is needed here as well.
Core Web Vitals: routine check-ups to avoid expensive damage
Invest the time to get your Core Web Vitals to a good level. Not to land on page one in the SERPs on Google. They may be the tipping point in close races with other websites. But optimization should be a must, because otherwise users will have no joy when visiting your website. And that has direct economic consequences.
So that long loading times and faulty designs do not cost your company potential leads and sales, take care of the basic work. Regularly check the "vital values" of your pages. Like taking a blood pressure measurement, routine checks help to detect undesirable changes early, take countermeasures, and keep damage within limits. Optimizing Core Web Vitals might not be the most exciting task in search engine optimization, but it should be on every technical SEO's radar.