Core Web Vitals are a set of specific factors that Google considers important for user experience. Since 2021, they are official ranking factors.
The Three Core Web Vitals
LCP – Largest Contentful Paint
LCP measures loading performance. It marks the point when the page’s main content has likely loaded.
What triggers LCP:
- Large images above the fold
- Video poster images
- Background images loaded via CSS
- Block-level text elements
Target: LCP should occur within 2.5 seconds of when the page first starts loading.
How to improve LCP:
- Optimize and compress images
- Preload critical resources
- Use a CDN
- Upgrade your hosting
- Remove render-blocking JavaScript
INP – Interaction to Next Paint
INP measures interactivity. It replaced FID (First Input Delay) in March 2024 as a Core Web Vital.
INP observes the latency of all click, tap, and keyboard interactions throughout the entire page lifecycle, and reports the worst interaction (ignoring outliers).
Target: INP should be 200 milliseconds or less.
How to improve INP:
- Break up long JavaScript tasks
- Reduce JavaScript execution time
- Minimize main thread work
- Keep DOM size small
- Use web workers for heavy processing
CLS – Cumulative Layout Shift
CLS measures visual stability. It quantifies how much the page layout unexpectedly shifts during loading.
Common causes of layout shifts:
- Images without dimensions
- Ads, embeds, and iframes without dimensions
- Dynamically injected content
- Web fonts causing FOIT/FOUT
Target: CLS should be 0.1 or less.
How to improve CLS:
- Always include width and height on images
- Reserve space for ads and embeds
- Preload fonts and use font-display: swap
- Avoid inserting content above existing content
How Google Uses Core Web Vitals
Core Web Vitals are part of Google’s “Page Experience” ranking signals. While content quality remains the most important factor, good Core Web Vitals can give you an edge over competitors with similar content quality.
Testing in TamRank
TamRank tests all Core Web Vitals using the same PageSpeed Insights API that Google uses. This ensures your scores align with what Google sees when evaluating your site.
Each metric shows:
- The actual measured value
- A score from 0-100
- Color-coded status based on Google’s thresholds
