Largest Contentful Paint

According to Google, the Largest Contentful Paint or LCP is the user-centric metric for measuring perceived load speed because it marks the point in the page load timeline when the page content has likely loaded. 

The LCP metric identifies the largest content element visible within the viewport and anything that lies beyond the screen does not count. The largest content element can vary from site to site and can be anything from images, video poster images, background images, or block-level text elements like paragraph tags. 

Why is LCP Measured?

LCP is a key metric of the Core Web Vitals report of Google, others being FID (first input delay), and CLS (Cumulative Layout Shift). LCP was chosen as a key metric as it correctly measures how fast a web page can be considered useful. Also, it is easy to figure out the LCP and to optimize for it. Another major development regarding LCP is that it is set to become a ranking factor in 2021 which makes it even more critical.

As per Google’s insights the elements currently used to measure LCP are 

  • img elements
  • image elements inside an svg element
  • video elements (the poster image is used)
  • An element with a background image loaded via the URL () function (as opposed to a CSS gradient)
  • Block-level elements containing text nodes or other inline-level text elements children

As of now, the SVG and VIDEO elements are not used for calculating the Largest Contentful Paint.

How to Figure Out Your LCP?

LCP can be measured using in the field tools like Chrome User Experience Report, PageSpeed Insights, Search Console (Core Web Vitals report), or in the lab tools like Chrome DevTools, Lighthouse, WebPageTest.

A good LCP score should be around the first 2.5 sec of the page starting to load. LCP scores for both mobile and desktop are different. Because Google is leaning towards mobile-first indexing, it would be ideal to optimize for mobile-first and then desktop. 

Poor LCP is caused by various factors like Slow server response times, Render-blocking JavaScript and CSS, Slow resource load times, and Client-side rendering. Hence these are the very areas that should be focused on to gain a high LCP score.

A slow server can be a concern with DDOS levels of hacking and scraper traffic on a shared or VPS host. You may find a way out of this by installing a WordPress plugin like WordFence to check out if you are under any major security breach and then block it.

Other concerns include the misconfiguration of a dedicated server or VPS or outdated software like an old PHP version or CMS software. The worst case would be a shared server with multiple users that are slowing you down. If that is the issue moving to a good host would be ideal.  Usually, adding caching optimizing images, fixing render-blocking CSS, and JavaScript and pre-loading certain assets can be of help to a certain extent. Google has a cool suggestion to deal with CSS such as to remove all unused CSS entirely or move it to another stylesheet if it is used on a different page of your site.

it companies in dubai |SEO Companies in Dubai Web Hosting Dubai