⭐ Beginner — No coding experience needed
Page Speed: What LCP and TTFB Are and How to Improve Them
Learn what page speed actually measures, why LCP and TTFB matter for Google rankings, and the most effective ways to make pages load faster.
What you will learn in this guide
- What LCP, TTFB and FCP actually mean
- How Google measures real user speed vs lab speed
- The 5 biggest causes of slow pages
- How to identify the largest contentful element on your page
- Cheap fixes that take pages from 4s to under 2s
1 What page speed actually measures
"Page speed" is not a single number. Google tracks several different measurements that capture different parts of the load experience.
| Metric | What it measures | Target |
|---|---|---|
| TTFB | Time to First Byte — how long server takes to start responding | Under 600ms |
| FCP | First Contentful Paint — when first text/image appears | Under 1.8s |
| LCP | Largest Contentful Paint — when the biggest above-fold element finishes loading | Under 2.5s |
| INP | Interaction to Next Paint — how fast the page responds to clicks | Under 200ms |
| CLS | Cumulative Layout Shift — how much content jumps as it loads | Under 0.1 |
2 Lab data vs field data
Speed tools show two different things:
Lab datais what PageSpeed Insights or Lighthouse measures by loading your page once on a clean simulated device. It is repeatable but does not reflect real users.
Field datais the real average from real Chrome users loading your page over the last 28 days. This is what Google uses for ranking. Field data is only available once your page gets enough traffic.
3 The 5 biggest causes of slow pages
- 1Unoptimised imagesOne 4MB JPEG hero image accounts for half the load time on most slow sites. Convert to WebP, resize to actual display size, lazy-load below-fold images.
- 2Render-blocking JavaScriptThird-party scripts (ads, analytics, chat widgets, A/B test tools) block the main thread. Each one delays everything else.
- 3Slow server (high TTFB)Cheap shared hosting often takes 1-2s just to start responding. Move to a VPS or use Cloudflare. Cache HTML if possible.
- 4Bloated themes and pluginsWordPress sites with 30+ plugins typically load 3MB+ of CSS/JS before any content. Audit and remove plugins you don't use.
- 5Custom fontsEach web font is another download. Use system fonts where possible, or limit to 1-2 weights of one font.
4 How to actually fix it
- 1Run the Page Speed TestOpen performance-tools.html#pagespeed. The tool runs both lab and field data when available.
- 2Find your LCP elementPageSpeed Insights highlights the largest contentful paint element. Usually a hero image, sometimes a heading or video.
- 3Preload the LCP imageAdd
<link rel="preload" as="image" href="/hero.webp" fetchpriority="high">to the head. Often takes LCP from 3.5s to 1.8s in one change. - 4Defer everything elseAdd
deferorasyncto non-critical scripts. Lazy-load below-fold images withloading="lazy".
Realistic targets:A WordPress site can usually reach LCP under 2.5s with image optimisation alone. Going under 1.5s usually requires custom hosting and a fast theme.