Experts Need expert help? Don’t hesitate to talk.
Do you worry about whether and how your site shows up when buyers search? Google’s new website metrics for May 2021’s Google page experience update call core web vitals are something you should look out for. In addition to its existing algorithm, Google is changing its evaluation of sites to consider three additional factors: loading time, interactivity, and visual stability.
In the wake of a new update, you must optimize your Magento 2 store for core web vitals. By focusing on these metrics, you can set yourself apart from competitors, keep your Google ranking intact, and increase conversions.
The tricks that we provide you with, based on the knowledge that we have gained during optimizing Magento stores, go well beyond the official Google guidelines. Now let’s find out what core web vitals are and why you should think about them before we get into tweaks.
What are Core Web Vitals?
We have always been concerned about the interaction of users with our web pages and website. No wonder Google has already been using page experience signals like mobile-friendliness, HTTPS, no malware on web pages, and others.
However, these signals are not capable of assessing the user experience and the performance of your website. As a result of the new feature rollout, three new metrics referred to as core web vitals will easily provide you with a clearer picture of existing UX signals.
By adding user-centric factors to the mix, you will be able to measure the user experience on the web and make sure the web is performing well. Generally, they are composed of three performance metrics:
1. Largest content paint (LCP)
LCP refers to the time that it takes a page to fully load. No longer true, largest content means those pieces of content that take the longest to load, which could be a page that has a logo, header, title, image, and text. An often slow loading page can be frustrating for web visitors. With LCP, you can reduce that time by loading the page fully at a time.
For example, if you enter a store and click on it, a page will appear with a header, logo, and text. You might have to wait a bit for the entire page to load. There is time when LCP comes into play, it would be the time it takes for the image to fully load.
You may be wondering how you can measure the LCP of your store’s website, so Google has already provided us with some tools. Using a tool like PageSpeed, you can easily measure the largest content paint on your site and see if it’s good according to Google. Generally, the ideal speed should be under 2.5 seconds.
You now understand what LCP metrics are and why you should care about them. But how do you optimize it? That’s the question that remains unanswered. Here is when you will need to enlist the assistance of professionals. We at M-connect Media have created a list of Magento optimization techniques. Let’s get started!
- Enhance the images
- Server optimization
- JavaScript and CSS should be optimized
Fortunately, there are many ways you can get your core web vitals score higher if you need to fix your LCP score.
The first thing you should watch for is server response. If it’s out of the ordinary, then you should use a content delivery network as well as revise your hosting service and back-end code.
You can also optimize the images. If you have larger image files on your site, don’t forget to compress them and make sure they will not take too much time to load and your users will have a seamless experience.
2. First input delay (FID)
This is the second most important aspect of core web vitals. The first input delay is known as the measure of responsiveness. As an example, if a user enters a store and presses something, but nothing happens. This is an annoyance that makes your users click away, as it causes them to get irritated.
You must interact with your user even if your site is doing something else or performing other tasks. Doing something else means creating Java script, large JS bundles, or rendering assets that block the browser.
The super FID is a crucial feature for any eCommerce store or shop since it implies multiple interactions with a website on the way from the home page to the checkout. If your store takes too much time to complete checkout after a buyer taps or makes a purchase, the buyer is likely to feel annoyed.
If your FID is greater than 100 milliseconds, you should decrease it. You may have to improve if it takes between 100-300 milliseconds. If it is more than 300 milliseconds, your FID score will be poor or very low.
When it comes to Magento stores, FID is one of the most important factors that affect search rankings. Even Google wants your site to load fast so it can place you among top search results. By having good FID, you will be providing world-class experiences to customers, and that is how you can reduce bounce rates and retain customers.
As we mentioned earlier, browsers have been doing something else which means that they cannot respond to user interaction, which results in busyness. There are many things that cause your site to be so busy. It may be due to heavy JS files, long JS bundles, and long tasks that require the browser to pause.
The same question arises in FID as well. What can you do to optimize it? Alternatively, you can use Google’s search console report or Chrome’s UX report to accomplish this. Those reports will give you all the information you need about the details of your web vitals based on data collected on the ground.
3. Cumulative layout shift (CLS)
User experience is at the heart of CLS. You can sometimes see a sudden shift in content, changes in the catalog, or other changes. Let’s say you landed on an apparel store looking for t-shirts or joggers, then explored the whole page and picked a combo of t-shirt and joggers. However, when everything suddenly changes, what do you find? Unbeknownst to you, a page has been changed from the layout to the combo you selected.
When you realize you are no longer able to buy a product you have chosen, you will be frustrated and leave the site to go to another site where you can buy the same products. You could lose revenue and damage customer trust if your CLS is poor. Furthermore, you lose a customer who could be a repeat customer.
As Google itself claims, it is good if CLS is less than 0.1. Use Chrome Devtools, WebPage Test and Lighthouse to optimize your store for CLS.
You need to debug and focus on making a score of zero or not more than 0.1 your ideal Google Score, if you ever received a low CLS score.
Taking it all in
As a result, your store must be optimized for key web functions (rollout) to protect your search engine rankings. Before mid-June 2021, we have listed three core web vitals you must keep in mind or else your brand image and SEO ranking will suffer.
Do you want to optimize your Magento store? M-connect Media can assist you. With certified Magento developers, we can help you protect your SEO and win new customers. We have a Magento support team that will assist you with optimizing your store to comply with core web standards. Get in touch with us today!
