It doesn’t come as a surprise when we say that it is key to track and analyze Core Web Vitals, as they affect rankings and can impact a site’s revenue.
Let’s analyze some key metrics a publisher should want to pay attention to:
- LCP (Largest Contentful Paint)
- INP (Interaction to Next Paint)
- CLS (Content Layout Shift)
Watch your LCP
LCP, or Largest Contentful Paint, tracks the time it takes for the webpage’s largest image, video, or text block to render within the user’s viewport (the visible area). These elements can include:
- Image elements
- Video elements
- Text blocks rendered within an inline element
Interaction to Next Paint
INP has replaced FID on March 12, 2024. INP measures users interface responsiveness.
Having a low Interaction to Next Paint means that the site is able to respond quickly to most of the users’ interactions. The page responding quickly to interactions, through a visual feedback to tell the user something is happening, is a positive sign.
Take care of your CLS
CLS can be explained as: the content of the website moving after the website has already loaded.
CLS stands for Cumulative Layout Shift and measures unexpected shifts in the webpage layout (excluding shifts triggered by direct user interaction like clicks). You know the feeling when you try to tap a button, the website’s layout moves and you end up somewhere else than intended. Frustrating! Typically it happens because uploaded images are without dimensions and the browser doesn’t ‘reserve’ space, so the layout shifts when an image finally loads and reveals its size.
One of the major causes of CLS is ads, as they usually get loaded after the actual content of the website is loaded. The ideal solution would be to make sure the appropriate space for the ad slots has been previously reserved by the website, so ad units get inserted into that space without the need to push content up or down.
Why are Core Web Vitals so Important?
Key reasons why you want to take care and track your Core Web Vitals are:
- First Impressions Matter: they determine users’ initial perception of your site’s responsiveness, determining whether they engage with your content and your ads! or move on.
- User Frustration: A substantial delay or content shifts make users feel like interactions are lagging and the page is slow, which leads to bouncing.
- Search Engine Optimization (SEO): they impact your website’s ranking in search engines. Google rewards sites with quick response and low CLS scores for better user experiences.
Consistent work on website loading speed and user experience creates a winning environment for attracting organic traffic and maximizing engagement, which eventually may lead to growing ad impressions, and optimize ad revenue.
How to measure and improve LCP, INP and CLS
To properly track Core Web Vitals we should combine data from Google Analytics, Google Search Console, and Page Speed Insights.
Google Lighthouse yields a complete and actionable report that will not only score your website performance but also provide a step-by-step guide on how to improve it.
There are plenty of tools to measure your core web vitals. The easiest way is to use Google’s Page Speed Insights. This tool will offer a comprehensive overview and offer potential solutions.
Here are some techniques you can use to optimize Core Web Vitals and create a more engaging user experience:
- Optimize JavaScript: Minimize and defer the loading of non-critical JavaScript to avoid blocking the main thread. Consider code-splitting techniques or breaking scripts into smaller parts.
- Reduce Third-Party Script Impact: Audit third-party scripts (analytics, marketing tags) and optimize their loading for reduced interference.
- Fasten Server Response: Enhance backend speed so the content your user wants appears in less time after the initial request.
- Utilize a CDN: Distribute your web resources via a Content Delivery Network (CDN) for faster load times based on users’ geographic locations.
- Compress and Optimize Images: Use modern image formats, resize elements and implement responsive web design for fast loading.
- Leverage Lazy Loading: Delay the loading of off-screen images to prioritize the initially visible content.
- Specify size dimensions for images and videos: Using width and height attributes on tags prevents reflows as their slots will be held open during loading.
- Font Optimization: Implement font-display values, preload web fonts, or use font sizes that match system fallbacks to reduce text rendering changes.
Choose a Monetization Partner with the right technology to support your Core Web Vitals
It is key to partner with the right ad tech company. Specially when it comes to taking care of your Core Web Vitals.
It’s important to keep in mind that the monetization technology on it’s own is not going to solve this issue. There needs to be a straight collaboration between the publisher and the ad tech company, making sure ad space is previously reserved.
Some other factors, that impact Web Core Vitals, are performing DNS changes or implementing additional CDNs. Our Single Tag Solution helps Publishers avoid these practices. The Single Tag solution does all the heavy lifting with little to no impact to the user experience. Want to learn how? Get in touch!
