Web Design
Website Speed and Core Web Vitals: What They Are and Why They Matter
Last updated: By Callum Skinner
Speed is not just a nice-to-have. It affects whether your site ranks, whether visitors stay, and whether they convert. Google’s Core Web Vitals framework gives you a specific, measurable way to understand and improve the speed experience your site delivers.
This article explains what Core Web Vitals are, why they matter, and what actually moves the needle when you’re trying to improve them.
What Core Web Vitals Measure
Core Web Vitals are three metrics that Google uses to measure the real-world user experience of a webpage. They focus on loading speed, responsiveness, and visual stability.
LCP: Largest Contentful Paint
LCP measures how long it takes for the main content element on a page to become visible, typically the hero image or the largest text block. A good LCP score is under 2.5 seconds. Over 4 seconds is considered poor.
Most LCP problems come down to one of three things: images that are too large or not prioritised correctly, a slow server response, or JavaScript that blocks the browser from rendering content.
INP: Interaction to Next Paint
INP (which replaced the older FID metric in 2024) measures how quickly a page responds after a user interacts with it, whether clicking a button, tapping a menu, or submitting a form. A good INP score is under 200 milliseconds.
Poor INP is almost always caused by too much JavaScript running on the main thread, preventing the browser from responding to input promptly. Heavy analytics scripts, ad networks, and bloated frameworks all contribute.
CLS: Cumulative Layout Shift
CLS measures visual stability, how much the page moves around as it loads. A score under 0.1 is considered good. The most common culprit is images and embeds without declared dimensions, causing the layout to reflow as they load. Web fonts that trigger layout shifts are another frequent cause.
Why Google Uses These as a Ranking Signal
Google’s stated goal is to surface content that is both high quality and pleasant to use. Core Web Vitals are a proxy for the “pleasant to use” part. A page that loads slowly, jumps around as it loads, or fails to respond to taps promptly creates a poor experience regardless of how good the content is.
Google confirmed Core Web Vitals as a ranking factor as part of the Page Experience update. The effect is not dramatic enough to override a large quality gap in content, but between competitors with comparable content quality, the faster, more stable page has an advantage. Over time, that compounds.
There is also the conversion argument, independent of rankings. Studies from Google’s own research and various industry reports consistently show that pages with fast LCP have lower bounce rates and higher conversion rates. The relationship is direct: every second of load time costs you visitors before they read a word.
What Actually Makes Sites Slow
Understanding where speed problems come from is more useful than chasing generic advice.
Unoptimised Images
This is the most common cause of poor LCP. A single hero image served at full photographic resolution, in JPEG or PNG format, without explicit dimensions or priority loading hints will tank LCP by itself. The fix involves serving modern formats (WebP or AVIF), setting explicit width and height attributes, and using the fetchpriority="high" attribute on the LCP image.
We use Netlify’s Image CDN in our builds, which handles format conversion and resizing automatically based on the requesting device.
Render-Blocking JavaScript and CSS
Browsers cannot render the page until they’ve processed blocking scripts and stylesheets in the <head>. Third-party scripts (analytics platforms, chat widgets, cookie consent tools, ad networks) are frequent offenders. Auditing which scripts are truly necessary and deferring or removing the rest can have a dramatic effect.
Third-Party Dependencies
Fonts, analytics, embeds, and social widgets all involve network requests to third-party servers you don’t control. Each one is a potential delay. Self-hosting fonts, loading third-party scripts asynchronously, and using rel="preconnect" for critical third-party origins are practical mitigations.
Undeclared Image and Embed Dimensions
CLS is usually preventable. Setting explicit width and height attributes on images and iframes tells the browser to reserve the right space before the resource loads, preventing layout shifts. This is a low-effort fix with a meaningful impact.
How to Check Your Scores
Google Search Console shows field data (real measurements from visitors using Chrome) aggregated by page group. This is the most reliable source because it reflects actual user experiences rather than lab conditions.
PageSpeed Insights (pagespeed.web.dev) gives you both field data and lab results for a specific URL. The lab data includes specific recommendations with estimated impact.
Chrome DevTools (Lighthouse tab) is the right tool for diagnosing specific issues during development. It runs in a controlled environment and tells you exactly what is causing problems and by how much.
The Architecture Advantage
There is a reason we build on Astro. Because Astro generates static HTML at build time, there is no server rendering overhead, no plugin layer, and minimal JavaScript sent to the browser. The pages we build start from a position of being fast rather than needing tuning to become fast.
On a typical WordPress site, achieving good Core Web Vitals requires ongoing active management: caching configuration, image optimisation plugins, script loading adjustments. Those tools work, but they are solving problems that the architecture creates.
If your current site has poor Core Web Vitals or you’re planning a rebuild and want performance baked in from the start, our web design services in Lincoln are built around this approach. More reading on the web design hub.
Common Questions About core web vitals
What Are the Three Core Web Vitals?
LCP (Largest Contentful Paint) measures how quickly the main content of a page loads (ideally under 2.5 seconds). INP (Interaction to Next Paint) measures how quickly the page responds to clicks and taps (ideally under 200 milliseconds). CLS (Cumulative Layout Shift) measures how much the page jumps around as it loads (ideally a score under 0.1).
Do Core Web Vitals Actually Affect My Google Rankings?
Yes. Google confirmed Core Web Vitals as a ranking signal as part of the Page Experience update, and the signals remain part of the ranking system. The effect is modest for an individual metric but meaningful when compounded: a slow site that also has a CLS problem is at a measurable disadvantage compared to a fast competitor with equivalent content quality.
How Do I Check My Core Web Vitals Scores?
Google Search Console includes a Core Web Vitals report that shows field data (real measurements from actual visitors) grouped by page type. PageSpeed Insights gives you a combined lab score and field data for specific URLs. Lighthouse (built into Chrome DevTools) gives detailed lab results with specific recommendations.
What Is the Biggest Cause of Slow LCP?
Unoptimised images are the single most common culprit. A hero image served at full resolution, in the wrong format, without a priority loading hint will delay LCP significantly regardless of everything else. After images, render-blocking JavaScript and slow server response times are the next most common causes.
Will a New Website Automatically Have Good Core Web Vitals?
Only if it's built with performance in mind from the start. A new WordPress site with a heavyweight theme and multiple plugins can score just as poorly as an old one. We build on Astro and use Netlify's image CDN specifically because good Core Web Vitals are the default outcome rather than something that needs retrofitting.
More on web design
-
Web Design
Astro vs WordPress: Which Is Right for Your Business Website?
Comparing Astro and WordPress for business websites: speed, security, maintenance, cost, and which is better suited to your situation.
-
Web Design
Our Web Design Process, Step by Step
A plain-English walkthrough of the Prosper Digital web design process, from the first discovery call through design, build, launch, and ongoing support.
-
Web Design
Website Redesign: When to Do It and How Not to Lose Your SEO
A practical guide to website redesign: how to know when it's time, how to protect your search rankings during the process, and what to plan for.
Ready to put this into practice?
We work with Lincoln and Lincolnshire businesses to build websites and run campaigns that actually perform. Get in touch for an honest conversation about your situation.