Sales Layer Blog

Guide to Largest Contentful Paint and How to Optimize it | Sales Layer

Written by Madalena Castro | Apr 12, 2022 6:18:00 AM

What is the Largest Contentful Paint?

Largest Contentful Paint is a term used by Google to measure the time it takes for a website to load all of its visible content on the screen, without scrolling.

For example, if a user goes to an online store’s website, the Largest Contentful Paint would be the time it takes for all the elements necessary for browsing to appear. Among these elements, Google considers:

  • Images
  • Backgrounds
  • Videos
  • Texts (including headings)

Therefore, Largest Contentful Paint is a metric that any business should take into account when maintaining their e-commerce website. Because this term was coined by Google, it means that it will greatly influence your positioning and ranking in search results.

 

 

How to analyze the status of Largest Contentful Paint on your website

The Largest Contentful Paint is closely linked to the loading speed of a website, which is a critical aspect for Google when evaluating and ranking websites. It is also key to the user experience, as a fast and optimized loading time means that the shopper can start viewing a page quickly and without missing any elements.

Now, how do you know if the Largest Contentful Paint status of your website is correct?

The ideal maximum loading time for any page is 2.5 seconds. If it is less than that, you will be in safe territory. If you have over 4 seconds of loading time, it’s time to apply emergency solutions.

To measure the status of your website's Largest Contentful Paint, it is best to use tools that analyze the performance of any page, from Google's Search Console or official Chrome plugins such as DevTools to other software that perform tests and produce reports like Lighthouse.

 

 

Practices to optimize Largest Contentful Paint on your website

Reduce image size

A website’s images are usually the main problem when it comes to loading speed, especially in e-commerce sites, where catalog photos are key both in advertising banners and product pages.

Optimizing these files involves compressing the images as much as possible, always using the most recommended formats, like JPEG, PNG, or WebP. We also recommend not linking these elements to JavaScript or CSS, as they tend to block and slow down web elements.

Use a Content Delivery Network (CDN)

As an alternative to hosting and compressing hundreds of images, a solution that speeds up the website and therefore the Largest Contentful Paint is to store your website’s largest files on an external server or Content Delivery Network (CDN). This way, you can connect it directly to your website without having to overload the hosting service you use for it. And this leads to the third optimization point.

Hire a powerful hosting service 

The most important thing to ensure any website operates smoothly is server responses that are as fast as possible. When using low-capacity or shared hosting, your website’s activity can be affected and suffer periods of slow loading, especially if you suddenly receive more traffic than usual or a change in web design needs to show more elements.

These three best practices for optimizing your Largest Contentful Paint are not isolated: you should implement them as part of your routine and monitor your website’s loading speed constantly. The Largest Contentful Paint may vary at any time, and even more so with the usual changes that occur on e-commerce websites, with new banners and product photos being updated frequently.