Introduction to Web Vitals

The metrics Google uses to score real-world experience — and why the 75th percentile is what counts.

“Is my site fast?” is useless until it's a number. In 2020 Google launched Web Vitals — a set of metrics that turn the fuzzy feeling of speed into scores you can measure, compare, and improve. Three of them, the Core Web Vitals, even feed your search ranking. This lesson is the map; the next three drill into each one.

Google groups dozens of possible metrics down to three that each capture a different feeling: LCP (does the main content load fast?), INP (does it respond fast when I interact?), and CLS (does it stay still, or jump around?). Each has a green/amber/red threshold. Flip between site profiles and watch all three move:

The metrics aren't competing — they each watch a different moment in the page's life. Two supporting metrics (TTFB, FCP) measure the early load; LCP caps off loading; INP watches every interaction; CLS runs the whole time. Tap through the lifecycle:

Here's the part people miss: Google doesn't grade your average user — it grades your 75th percentile. If you have 100 visitors, 75 of them must hit the “good” threshold. That means a fast average can still fail if enough users are on slow phones or flaky networks. Drag the slider and watch p75 cross the line:

You can't fix LCP without understanding the two metrics that feed it. Time to First Byte (TTFB) is everything from navigation to the first byte of HTML — all the DNS/TCP/TLS/redirect work from lesson 1. A slow TTFB poisons every metric after it.

First Contentful Paint (FCP) is the moment anything first appears — text, an image, an SVG. It's TTFB plus the critical rendering path. Both are diagnostic: not Core Web Vitals themselves, but the levers you pull to move LCP.