Guide

The Core Web Vitals Field Guide

What you'll learn in this guide.

Most Core Web Vitals work fails the same way: somebody runs Lighthouse, optimises for the score, and the field data never moves. This guide separates the two kinds of data, breaks each metric into the parts that can actually be fixed, and gives the remedies in the order they usually pay. It includes the current pass rates across 11.1 million origins, the commercial case from the Deloitte study, platform-specific notes for WordPress, Shopify and React frameworks, and a 25-point field checklist.

  • What each metric measures, the exact thresholds, and why the 75th percentile changes what you optimise
  • Why lab and field data disagree, and which one to fix against
  • How to break LCP into its four parts so you fix the cause rather than the symptom
  • How to diagnose INP with attribution data, and the seven fixes ranked by what they return
  • The five causes of layout shift and the CSS that removes each one
  • What a 0.1 second improvement was worth across 30 million sessions in the Deloitte study
  • Platform-specific causes on WordPress, Shopify and React frameworks
  • How to set a performance budget that stops the problem returning

Inside the guide

  1. Before you start: the three metrics and where the numbers come from
  2. Largest Contentful Paint: four parts, seven fixes
  3. Interaction to Next Paint: three phases and how to find the cause
  4. Cumulative Layout Shift: five causes and their remedies
  5. The workflow: diagnose, fix, verify, budget
  6. What this work is worth, and four objections answered
  7. Platform notes: WordPress, Shopify, React frameworks
  8. Appendix — the 25-point field checklist

How to diagnose and fix LCP, INP and CLS on a real site — using the data Google actually scores you on.

We'll send it to your email.

Related post

You may also like these