Web Design

Website Speed Optimization Guide — Core Web Vitals That Actually Matter

Website speed optimization and Core Web Vitals performance dashboard

A one-second delay in page load time reduces conversions by an average of 7%. On mobile — where more than 60% of web traffic now originates — users expect pages to load in under two seconds or they leave. Website speed isn't a technical luxury; it's a business metric that directly affects how many visitors become clients.

Google's Core Web Vitals have been ranking factors since 2021, but in 2026 they've become more decisive, particularly as AI-generated search results push organic listings further down the page. The sites that survive the AI squeeze are the ones that load fast, feel responsive, and keep visitors engaged.

The Three Core Web Vitals You Must Pass

Google's PageSpeed algorithm centres on three user experience metrics. Understanding what each measures helps you prioritise where to invest effort.

LCP — Largest Contentful Paint

Target: under 2.5 seconds. LCP measures how long it takes for the largest visible element on the page — usually the hero image or main heading — to load. This is the metric most directly tied to perceived load speed. Poor LCP is almost always caused by large unoptimised images, slow server response times, or render-blocking resources.

INP — Interaction to Next Paint

Target: under 200 milliseconds. INP replaced FID in 2024 and measures how quickly your page responds to any user interaction — a click, a tap, a keypress. High INP usually means too much JavaScript running on the main thread. Auditing and deferring non-critical scripts typically fixes this.

CLS — Cumulative Layout Shift

Target: under 0.1. CLS measures visual instability — how much the page layout shifts around while loading. The most common culprits are images without explicit width/height attributes and ads or embeds that load asynchronously and push content around.

Images Are the Biggest Performance Lever

Images account for more than 50% of page weight on the average website. Optimising them is the fastest path to a meaningful speed improvement.

Image Optimisation Checklist
  • Convert all images to WebP or AVIF format
  • Compress with a tool like Squoosh or ShortPixel
  • Always include explicit width and height attributes
  • Use loading="lazy" for below-fold images
  • Use loading="eager" and preload for your hero image
  • Serve appropriately sized images for mobile via srcset

Hosting and Server Response Time

All the front-end optimisation in the world won't fix a slow server. Your hosting provider's Time to First Byte (TTFB) — how quickly the server starts responding — is the foundation everything else builds on. Shared hosting at $3/month is the single most common reason a professionally designed website scores poorly on PageSpeed.

For most small business websites, a VPS or managed hosting plan on providers like DigitalOcean, Cloudways, or Kinsta will dramatically reduce TTFB. Pair this with a CDN (Cloudflare's free tier is excellent) to serve static assets from a server physically close to your visitor.

Moving from shared hosting to a managed VPS is often the single action that takes a site from a PageSpeed score of 45 to 85, before touching a single line of code.

JavaScript: Load Less, Defer the Rest

Every JavaScript file your site loads blocks rendering until it's downloaded, parsed, and executed. Audit what's actually running on your site. Marketing teams love adding tag managers, chat widgets, heatmap tools, and analytics scripts — each one costs load time. Evaluate whether each script is delivering measurable business value. For scripts you do need, add defer or async attributes so they don't block the initial render.

Web Fonts Done Right

Web fonts are a common performance trap. Loading five font weights from Google Fonts adds multiple network requests and can cause layout shift if the font loads after the page renders. Use font-display: swap to prevent invisible text during load. Preload your primary font file. And be honest with yourself — most sites only need two font weights to look professional.

Conclusion

Speed optimisation isn't a one-time fix; it's an ongoing discipline. Start with your hosting, then tackle images, then audit your JavaScript. Run PageSpeed Insights regularly and address regressions before they compound. The sites that load fast don't just rank better — they convert better, hold attention longer, and give visitors a reason to trust you from the first second they land.

Is your website costing you clients because it's too slow?

We audit, redesign, and rebuild websites with performance baked in from the start — not bolted on afterwards.

Talk to us
Back to all articles