Tips for UX designers and web developers Core Web Vitals for more user-friendliness
The time has come in June 2021: Google’s Core Web Vitals will be launched. First of all, the developers have to do additional work to check and optimize existing pages.
Companies on the topic
The Core Web Vitals already listed in the Google Search Console will become an integral part of the Google ranking factors in June.
Websites must load quickly and be technically correct-this principle has been in force for a long time. That’s why there are the TTFB (Time To First Byte) and other metrics for the page experience. But as web development becomes more complex, metrics need to be produced that better quantify the user experience when visiting a website.
Core Web Vitals: The basis for user-friendliness
Some examples of bad page experience: When the page is accessed, it takes a long time for larger photos to load. There are noticeable delays before something can be clicked. Suddenly, an ad appears in a blank line and moves all the content down.
Google is addressing these typical problems of modern websites with new metrics under the umbrella term “Core Web Vitals”. These are rankings compiled using the field data from the Chrome User Experience report.
There are three Core Web Vitals in total:
- Largest Contentful Paint( LCP): the time between the page call and the appearance of the largest element in the visible area. Good values are a maximum of 2.5 seconds, 4 seconds, the page is too slow.
- First Input Delay( FID): the time between the page call and the time at which interactions are possible for the first time, such as clicking or scrolling. 100 milliseconds or less is a good value, starting at 300 milliseconds, the page reacts too slowly.
- Cumulative Layout Shift (CLS): affects the stability of the page layout. It is unstable when reloaded objects, change the Layout later. These are, for example, ads or videos that push other content to the side or down after loading. Values up to 0.1 are good, from 0.25, the page will be devalued.
Optimizing websites for Core Web Vitals
Developers should consider the new Core Web Vitals, because a bad user experience leads to downgrading of a page. However, Google continues to primarily use the content for ranking. In addition, the values of Google are weighted differently: LCP and FID with 25 percent each, but CLS with only five percent.
However, particularly poor results in one of the three key figures easily lead to relegation compared to pages with similar content. So it makes sense to pay attention to good values in the vitals. Fortunately, all Google tools, such as the search console, now support the new metrics.
The Pagespeed Insights are particularly useful for developers: Here you can test your own pages, but also any other websites. The result gives initial indications for optimization. It makes sense for developers to intervene first on the worst value. For this purpose, Google has kindly compiled three long lists of optimization tips: for LCP, FID and CLS.
However, in practice, it turns out that the developers do not have some influencing factors under control. This mainly affects external ad servers, ironically also Google’s own AdSense. They have different loading times depending on the load. This will affect all three Core Web Vitals and may force the page into negative territory.
Consult other metrics for analysis
The new Core Web Vitals don’t mean the older metrics are meaningless. The TTFB (Time to First Byte) in particular continues to have great significance. It describes the latency of the connection between the website and the backend. High values indicate a problem that can be solved with a changed server configuration or by the backend developers.
Also FCP (First Contentful Paint)is still very useful for troubleshooting. For example, there might be a noticeable delay between the start of rendering (FCP) and the rendering of the largest object (LCP). It allows developers to analyze whether there are obstacles to loading content.
The two metrics TBT (Total Blocking Time) and TTI (Time to Interactive) differ from the Core Web Vitals, as they are pure laboratory data, but are good analytical aids for optimizing load times. The best way to tweak something here is to test the pages with Lighthouse, which can be achieved through the Chrome DevTools.
In addition to these metrics, Google evaluates several other signals for ranking. This includes, for example, optimization for mobile devices, the security status of the website, the use of HTTPS and the absence of annoying interstitials. Overall, the Core Web Vitals and the other signals form the new ranking factor Page Experience (user-friendliness). It will be gradually adopted into the Google Core from mid-June 2021.
User-friendliness and Observability
The Core Web Vitals will soon be of great importance to web developers. The measures on the content page have been taking the user into account for some time. Thus, read-friendly pages with their own table of contents and a clear structure are clearly preferred over pure text deserts.
The new key figures are now placing greater emphasis on user-friendliness on the technical side as well. For this, developers need to take into account the target audience of the site. It is conceivable that Core web vitals and design ideas collide in individual web projects. Especially Websites with a lot of JavaScript will get problems with the FID values.
Ultimately, it depends on the long-suffering of users. For example, if you open a web page to watch a video, you will be very dissatisfied with long delays until you click the start button, while delayed viewing of advertising will bother you less. For this situation, for example, the analysis of the distance between LCP and FID makes sense. The larger it is, the more likely the site is to strain the patience of visitors.
Such examples show that key figures such as the Core Web Vitals are well suited to operationalize user-friendliness and thus make it tangible. Google’s new KPIs and tools ultimately give developers incentives and opportunities to increase the usability of websites.
Klaus Kurz (Picture: New Relic)
As a result, developers and UX designers no longer rely on estimates to develop optimal websites. In addition, observability solutions such as the New Relic Browser Monitoring to monitor browser performance can provide you with relevant metrics for website monitoring in real time.
* Klaus Kurz has been Director, Solutions Consulting Central Europe at New Relic since autumn 2019. Here he leads a constantly growing team of solution engineers, solution consultants and solution architects, which supports customers in the implementation of their digitization plans. Previously, he worked at Adobe for 15 years, filling positions from Manager Business Development to Head of Solution Consulting for Central and Eastern Europe.
(ID:47429939)