Largest Contentful Paint

January 25th, 2021

What is Largest Contentful Paint?

Largest Contentful Paint (LCP) is a custom created metric by Google that is designed to observe a website visitor"s perception of the overall web page loading experience.

LCP marks the point in the web page load time-line when the main image, or text, content is loaded within the viewport (screen). Consequently, a fast LCP helps reassure the user that the page is useful.

Why does LCP Matter?

As first impressions matter, observing how fast the largest piece of content is visible provides invaluable insight. LCP has been designed to capture this observation; it can then be rated against best practice metrics enabling any improvement or degradation in loading experience to be assessed.

Google uses this metric to determine if a web page is loading quickly enough to provide a high quality user experience. Based on metrics collected over time, the web page experience is then used as a ranking signal which may influence page ranking and potential placement in search results.

What Marketing Metrics does LCP affect?

LCP is important to the user experience of a web page as it reassures the user a page is useful, therefore a slow LCP tends to have the greatest impact on:

  • Bounce Rate (amplified on mobile data connections)
  • Conversion rate
  • Customer Experience (faster LCP enable users to interact quicker)
  • Call to action success and adding items to purchase
  • Search Ranking

What elements can make up LCP?

Most visible elements of a web page can be considered as a candidate for the LCP, these include, Text, Images, Videos, Background Images.

LCP can vary from page to page across a website as many different factors can influence how fast the content is loaded. However, observing LCP on the key critical templates of a website can provide valuable insight into how LCP impacts on web performance. Therefore measuring the important templates of a website is vital for ensuring a consistent user experience across site.

What is a good LCP score?

To provide a good user experience, a web page should load the Largest Content of a web page within 2.5 seconds.

Google considers an LCP time of 4 seconds and above as slow and an indicator of poor user experience

Measurement of the metric is taken at the 75th percentile so that the poorest experiences are observed. Metrics are also considered across both mobile and desktop devices.

What causes Poor LCP?

There are many causes of poor LCP, where it measured to be greater than 4s, some of the common causes can be found from an issue in one of the following areas:

  • Slow server response times
  • Render Blocking JavaScript and CSS
  • Slow resource load times
  • Client-side rendering

How to Measure LCP

Google has provided many different ways to observe the LCP metric as follows:

  • Lighthouse
  • Google developer Tools
  • Page Speed Insights
  • Self instrumentation with a JavaScript SDK

A snapshot view can be a good reference check but to establish a true benchmark of its performance data needs to be collected over time. This aids in historical analysis and enables observation of changes in the environment and how they affect the LCP metric.

The Webspeed Index platform offers this facility and the ability to chart LCP performance over time. A further benefit of this approach is that ongoing improvements or regression can be observed.

As Google now use this metric to form part of their ranking algorithms understanding how you compare against business competitors is vital – Webspeed Index can rank sites based on their LCP performance to give you a real time view of your competitive landscape.

This article was written by the WebSpeed Index Team.

Speed Matters to your Customers

Learn more about how Webspeed Index insights can help accelerate your business