How to Fix LCP Issues: Longer Than 4s (Desktop) or (Mobile)
Let me explain more about How to fix LCP Issue Owning a webpage doesn’t simply mean creating content and posting it. In this day and age, when there are so many sites trying to offer the same things, it is important to rise above the rest.
Today, simply having well-written articles doesn’t do that. A page has to rank well on Google in order to be read by more people. If you think optimizing the SEO for your content is enough to do this, that’s where you’re wrong.
In actuality, page load speed also affects your page’s Google search ranking. Slower load speed doesn’t automatically mean that the user has slow Internet speed. It could also be that the elements on your page are heavy on data and take a while to download.
To rank better on the Google search results, you have to tweak a few things on Core Web Vitals, Google’s new avenue for tracking webpage metrics. Core Web Vitals introduces new measurements for webpage speed, such as the LCP, which you need to make sure loads no longer than 4 seconds.
What Is LCP?
Largest Contentful Paint (LCP) is Google’s user-centric metric for a webpage’s perceived load speed seen in the Core Web Vitals. Specifically, it shows how long it takes to load the largest text, image, or video above the fold… thus its name.
Elements that appear after clicking or scrolling on the page are excluded from the LCP. So, simply put, LCP measures how long it takes your audience to see the item you want them to see and remember first.
This metric was created by Google to inform webpage owners of problems in their website’s loading speed to assure a seamless user experience. Ideally, a webpage should fully load its LCP within 2.5 seconds. Any longer than that and you should be concerned about how your webpage is faring in terms of a great user experience.
What Are Core Web Vitals?
There are plenty of tools you could use to see how your webpage is doing on Google’s search rankings. However, if you want tips from the maker itself, it is best to use their recommended tool.
While Google doesn’t give away all of its secrets, it has shed some light on how it ranks search results. For 2021, as we mentioned earlier, Google introduces a new tool that measures a webpage’s overall user experience: Core Web Vitals.
In particular, Core Web Vitals considers three aspects for page speed and user interaction measurements. These are loading performance, responsiveness, and visual stability.
These are measured by the LCP, First Input Delay (FID), and Cumulative Layout Shift (CLS), respectively.
While the LCP assesses how quickly the largest element loads, the FID checks how fast the page reacts to the user’s first interaction, like a click, for instance. For a good user experience, the FID should be less than 100 milliseconds.
Meanwhile, the CLS checks if the elements on a webpage move around the screen when loading. For this, a CLS of less than 0.1 should be maintained for an ideal user experience.
These three are calculated to assure a great user experience, which helps webpages rank better on Google and, therefore, gain more audiences.
Why Is a Good LCP Score Important?
For some sites, the featured story is meant to catch the audience’s attention and get them to stay on the page. This failing to load quickly might get them a bad reputation.
For instant feedback, this might cause the audience to exit the site prematurely, thinking that it’s not working as it should.
Meanwhile, other sites rely on a catchy banner image for better visual memory retention. A lag in the LCP takes away the purpose of their text, image, or video as the audience is inclined to begin reading and scroll past it entirely.
Therefore, it is important to optimize the LCP as well as the other metrics included in the Core Web Vitals to maintain a satisfactory user experience. A good user experience equates to consistent readership. Starting 2021, it will also mean better Google search rankings.
What Determines Your Page’s LCP Score?
To know which element is affecting your LCP score, open a new tab on Chrome and type in the URL of the website you’d like to check. For instance, we’re going to check Fridge Repair Singapore’s site.
Right click on any free space on the landing page and click “Inspect” from the drop-down menu. Your screen should look like the image below once you’ve done this.
Then, go to “Performance”, which is on the upper right part of the screen. If you don’t see this immediately, click on the two arrows on the farther, upper right portion of your screen to reveal more options.
Click “Reload” on the right side of your screen and Chrome will take a few seconds to give you a report.
Once it’s done, you should see in the “Timings” section a small LCP icon. If you click it, it will highlight which part of your webpage is the largest element considered in scoring the LCP.
How to Fix LCP Issues
Okay, so let’s say you’ve noticed an LCP issue using the method above. Let’s go into the possible solutions for it!
Identifying Problematic URLs
To know for certain which parts of your website need improvement, you need to identify problematic URLs.
For this, you need to log into your website on Google Search Console. Once you’re in, go to the Enhancement tab and click on the link labeled “Core Web Vitals”. Then, click “Open Report”.
The report will show you the number of URLs in your site that have an LCP issue. After that, click on “LCP Issue: Longer Than 4s (Desktop) or (Mobile)”. This will show you an example of a specific page from your website that has an LCP issue.
How to Check Your LCP Score
After knowing which parts of your website have the LCP issue, you need to check their exact LCP score. For this, open Google PageSpeed Insights on Chrome. Type in your webpage URL on the search bar and click “Analyze”.
You can opt to do this for your landing page only. However, if you want to optimize user experience for each specific part of your page, you can also analyze them one by one. This can help you get each part a better ranking under Google search results.
The results should show you your page load speed metrics, including your LCP score. Red means the webpage has a poor score, orange means it needs improvement, while green means it’s doing good.
PageSpeed Insights will show you the mobile metric results by default, but there is also a desktop option on the upper left of the screen. However, addressing the issue just on the mobile tab can fix both at once.
How to Improve Your LCP Score
Here’s where Google gives its users tips for faster page load speed and therefore, potentially better Google search rankings.
Simply scroll a little below “Lab Data” on the same PageSpeed Insights page. You should see a portion labelled “Opportunities”. Here, you’ll find suggestions on how to improve your overall page speed.
As you can see in the photo above, one of the suggestions is to “Serve images in next-gen formats”. Doing this would improve the page speed by an estimated 4.95 seconds. Note, however, that this does not equate to a better PageSpeed Insights score.
Specifically, this instruction simply means to reupload the image in a format other than the usual .JPG or .PNG. Newer image formats such as WebP, JPEG 2000, and JPEG XR. These make for better compression, meaning faster downloads and less data consumption for your webpage users.
If you’re not exactly a pro on these terminologies, Google has made it quite user-friendly. To better understand how to fix the issue, you can click on the drop-down arrow (as shown in the image above) for more information.
It basically gives you further insight into what to do to improve your page load speeds. The suggestions tend to work well, by the way.
For instance, the webmasters at Ceiling Fan Repair Singapore followed some of PageSpeed Insights’ instructions for their site and found that even just a few of the instructions significantly improved their page speed.
Plugins available to specific blogging websites make big changes to your webpage easier. For instance, WordPress users can use the WebP Converter for Media plugin to convert PNG, .JPEG or photos of any other format into WebP.
To do this, WordPress users simply have to install this plugin. Once it’s installed, activate it by going to “Plugin” on your dashboard and selecting “Activate”. This will instantly convert all your WordPress images into WebP format.
Different plugins are also available to address the other concerns from PageSpeed Insights’ Opportunities section. However, make sure to save a backup of your site first before making any changes in case the plugins make drastic changes to your page’s layout.
After making your changes, go back to PageSpeed Insights and analyze the same URL. Check for changes in your page load speed metrics. Since the LCP score does not change instantly, you should continue adjusting your page accordingly.
Once you’ve passed the LCP score, you can go to your Google Search Console account and click on “Validate Fix”. This informs Google that you’ve applied changes to your website to increase page speed.
That pretty much describes how you can fix LCP issues on your site. However, we should leave you with one final note about this.
This is something that you can’t expect to rush or produce instant results. This entire process of tweaking your website up to Google’s validation itself takes some time, so don’t get disheartened if it seems like it’s taking forever.
However, keep in mind that most techniques for long-lasting optimization are the same. It pays off in the long run, so it’s definitely worth doing.
By taking the time and effort to fix your LCP issue, your website just might get the push it needs to hit the first page of the SERPs… or even get closer to the top position!