1. Importance of Users Centered Design
User-Centered Design (UCD) is a developer process in designing a digital product that is convenient for users to use. The design is adapted from user behavior in using a product to make it easier for users. We may have heard how important user-centricity is, where the convenience of the user experience while visiting a site is one of the main factors in the design process. Based on XD Ideas (experience design ideas), UCD also has an emotional impact on users in determining whether the experience is valuable to a user or not (Adobe XD Ideas, 2019).
An effective way to determine the effectiveness of a digital site/product can be identified by analyzing pain points (some of the causes of the problem) from the user. For example, a site might be fast for one user, but maybe slow for another. On the other hand, two sites may load at the same time, but one other site may load in a relatively slower time depending on user interaction. So, when we talk about UCD for the user, we are also talking about creating a website that is fast, convenient, and useful for the user. To refer to more accurate performance, site developers can refer to objective criteria that can be measured based on several matrices in Core Web Vitals
2. What is Core Web Vitals (CWV)?
CWV is a measure of various factors on how users know the experience of interacting from a web page. Optimizing these factors makes the web more attractive to users on a variety of browsers and web interfaces, and helps the site develop according to user expectations. This will contribute to the success of a website whether users want to interact more or choose to leave the site. Based on an article published by Google News Central, Google announced that the page experience will be a determinant in Google Search Ranking from May 2021. This is a benchmark of how users have a pleasant experience when interacting on web pages and contribute to the current page.
This is also supported by Google’s own analysis noting an average 70% increase in user engagement which can be seen through lighthouse and page speed insights reports, and many site owners using reports from the web console to identify opportunities to increase user engagement numbers. The page experience combines Core Web Vitals with Google Search which includes mobile friendliness, safe-browsing, HTTPS-security, and intrusive interstitial guidelines. If we take a broad overview, the page experience can be illustrated in the diagram below where Core Web Vitals is a very important component of the assessment. If we map these components, it can be divided into several matrices.
3. Matrices on Vitals Web Core
3.1. Largest Contentful Pain (LCP)
Users will feel frustrated when they come across a slow web page and they need to wait for all the elements on the page to move. Largest Contentful Pain (LCP) is a matrix that is responsible for page loading speed. Before understanding the LCP in more detail, we can get to know the First Contentful Pain (FCP) matrix first. FCP can be measured from the time the page starts loading until the content in the page is rendered on the screen. So, FCP is only measured when the web page loads but the content is not loaded entirely. Therefore, Google indicates that there is a new, more relevant and complex matrix, called LCP.
LCP is measured when the page starts loading until the largest element (text, image or video) is displayed on the screen. Because screen elements change during download, Google will move on to the next largest element until the page is fully loaded or when the user starts interacting on the page. LCP is an easy to understand matrix because web owners can identify the largest elements and optimize them by making them smaller.
In order to provide the best user experience, the website should try to get an LCP value no longer than 2.5 seconds when the page is first loaded. To ensure web owners can reach these targets, at least 75% of the pages are loaded and segmented on mobile and desktop.
3.2. First Input Delay (FID)
First Input Delay (FID) measures the lag time when the user first starts interacting with the page until the browser responds. For example, when a user performs some interaction on the web such as clicking on a link, pressing a button or opening a text, the FID acts to measure how long the interaction takes until the browser can start the process as feedback or response to the interaction that the user made.
Long First Input Delay usually appears between the First Contentful Paint (FCP) and Time to Interactive (TTI) processes when the user tries to interact on the current page where a delay occurs when a click is received and the main thread can respond. To provide the best user experience, the FID value must be less than 100 ms.
3.3. Cumulative Layout Shift (CLS)
The Cumulative Layout Shift (CLS) measures the total sum of all layout element shift scores for each shift that occurs on the page. A good CLS can be demonstrated by a fairly stable page element (Visual Stability). That way, users do not have to recall the location of links, images, and columns when the page loads completely or accidentally clicks on something. Some coincidences often occur due to the lack of awareness of web owners about the importance of this matrix.
For example, when a user wants to cancel their order confirmation while shopping at an e-commerce website, suddenly a banner to promote the download of the application appears and shifts other elements downwards, causing the user to accidentally click the message button. Hence, the user needs to contact the web owner about the accident that has occurred.
To provide the best user experience, a site should have a CLS score of less than 0.1 second. To ensure web owners can reach these targets, at least 75% of the pages are loaded and segmented on mobile and desktop.
4. Methods to Measure Matrix CWV
There are two methods to measure the CWV matrices, which are called In The Lab and In The Field. Both of these methods require analytic tools as their support and it is important to do both.
4.1. In The Lab
In the lab is the use of tools to simulate page loading in a controlled and consistent environment. Until a new feature is released in production, it is impossible to measure performance characteristics in real users, so testing in the lab before a new feature release is the best way to prevent performance regressions.
4.2. In The Field
On the other hand, while lab testing is a reasonable proxy for performance, it does not necessarily reflect how all users experience the outside experience. In the field is understanding with the help of field data to find out the user experience on site. Site performance can vary widely based on the capabilities of the user’s device and the conditions of their network as well as the way users interact with the page.
5. Analytic Tools CWV
Some of the tools that can be used to measure Core Web Vitals include:
5.1. Google Search Console
Google Search Console can help in identifying a group of pages on a website that are needed to determine the performance of Core Web Vital (CWV) based on field data. URL performance can be grouped by status, type of matrix, and URL group (web page groups).
5.2 Lighthouse
Lighthouse is an automated website auditing tool that helps developers to diagnose problems and identify ways to improve the user experience on the site. Lighthouse measures several dimensions of the quality of the user experience in a lab environment, including performance and accessibility. Based on the lighthouse report data, we can see the distribution of the matrix in the data as follows:
These weights can be revised again in the future but it seems that the CLS is indeed a less prioritized matrix compared to other matrices. Google says that it will use page experience signals as a determining factor in Core Web Vital. Therefore, before becoming the main category, site owners also suggested allocating priority to the previous main factors such as content quality, SEO and page authority.
6. Top Stories on Search Engine Results SERP
CRWV will replace AMP to become the new standard in entering the “Top Stories” area. In the past, Google has been criticized for not extending the benefits of AMP such as pre-rendering or appearing in “Top Stories” to non-AMP pages at the same speed. At the time, Google had replied that there was no right way to do it because at that time there was no reliable way to measure speed on non-amp pages. Therefore, Core Web Vital will close this gap for optimization on non-amp pages.
In the future, the core matrix of Core Web Vitals may be further expanded. Some of the current potential candidates include:
1. Input Delay for all interactions (not just initial interactions), Smoothness of movement
2. Smoothness of movement
3. Matrices that allow tools to pre-render a page (such as AMP) on the SERP.
