Website speed is not a nice-to-have. It affects your search rankings (Google uses Core Web Vitals as ranking factors), your bounce rate (53% of mobile users leave sites that take more than 3 seconds to load), and ultimately your revenue. This guide shows you how to measure where you are and what to do about it.
Why website speed matters
Speed affects your business in three ways:
- SEO rankings — Google uses Core Web Vitals as ranking signals. Pages that fail the thresholds are at a disadvantage in competitive search results.
- User experience — users are impatient. Amazon calculated that every 100ms of delay costs them 1% in sales. For smaller sites, the impact can be even more dramatic.
- Conversion rates — studies consistently show that faster pages convert better. A 1-second improvement in load time can increase conversions by 7–27% depending on your industry.
Core Web Vitals explained
Google's Core Web Vitals are three specific metrics they use to measure the quality of user experience. Understanding them is essential:
LCP — Largest Contentful Paint
LCP measures how long it takes for the largest visible element on your page to load. This is typically a hero image, a large heading, or a video thumbnail.
- Good: Under 2.5 seconds
- Needs improvement: 2.5–4.0 seconds
- Poor: Over 4.0 seconds
INP — Interaction to Next Paint
INP (which replaced FID in March 2024) measures how responsive your page is to user interactions — clicks, taps, keyboard input. It captures the worst interaction delay throughout the page lifecycle.
- Good: Under 200ms
- Needs improvement: 200–500ms
- Poor: Over 500ms
CLS — Cumulative Layout Shift
CLS measures visual stability — how much your page layout "jumps" as it loads. The classic example is a button that moves just as you're about to click it because an ad loaded above it.
- Good: Under 0.1
- Needs improvement: 0.1–0.25
- Poor: Over 0.25
🔍 Audit Your Website Now
GradeMysite checks your SEO, performance, security, and accessibility in 60 seconds. No sign-up needed.
Run a Free Website Audit →Best free website speed test tools
1. Google PageSpeed Insights
The most important tool — it shows you both lab data (simulated tests) and field data (real user data from Chrome). The field data is what actually affects your Core Web Vitals score in Google Search. URL: pagespeed.web.dev
2. GTmetrix
GTmetrix provides detailed waterfall charts showing exactly which assets are loading slowly and in what order. Very useful for diagnosing specific bottlenecks. Offers free tests with location and device selection.
3. WebPageTest
The most powerful free option for advanced users. Lets you test from multiple global locations, simulate specific connection speeds, and run visual comparisons between pages or timeframes.
4. Chrome DevTools
Press F12 (or Cmd+Option+I on Mac) and go to the Lighthouse tab. This runs a full performance audit and gives recommendations. The Network tab shows you exactly which resources are loading and how long they take.
How to run a proper speed test
To get useful, reproducible results:
- Test multiple pages — don't just test your homepage. Test your most important product pages, blog posts, and landing pages.
- Test mobile and desktop separately — mobile performance often differs significantly. Google primarily uses mobile scores for ranking.
- Run tests multiple times — results can vary due to server load and network conditions. Take an average of 3–5 tests.
- Test in incognito mode — browser extensions can affect page load times.
- Check field data, not just lab data — PageSpeed Insights shows both. The field data (CrUX data) represents real user experience.
How to fix a slow LCP
LCP is most commonly caused by slow server response, render-blocking resources, or large unoptimised images. Key fixes:
- Optimise your hero image — convert to WebP, compress it, and add
fetchpriority="high"to the<img>tag so the browser loads it first. - Add resource hints — use
<link rel="preload">for your LCP image or font. - Eliminate render-blocking CSS/JS — defer non-critical scripts and inline critical CSS.
- Upgrade your hosting — slow server response time (TTFB over 600ms) directly hurts LCP.
How to fix layout shift (CLS)
The most common causes of layout shift are images without dimensions, dynamically injected content, and web fonts loading late:
- Always set width and height on images — even with responsive images. The browser uses these to reserve the right space before the image loads.
- Reserve space for ads and embeds — if you're loading third-party widgets, set a min-height container so they don't push content around.
- Use font-display: swap — or better yet, preload your fonts so they're available before the page renders.
- Avoid inserting content above existing content — banners, cookie notices, and ads should be loaded in reserved spaces, not injected dynamically.
Image optimisation
Images are typically the heaviest resources on any web page. Proper optimisation can cut your page weight by 50–80%:
- Use modern formats — WebP offers 25–34% smaller file sizes than JPEG at equivalent quality. AVIF is even smaller but browser support is still growing.
- Resize before uploading — don't upload a 4000px image and display it at 800px. Resize to the actual display dimensions first.
- Compress with tools like Squoosh — Google's free Squoosh app lets you compress and convert images in the browser.
- Use lazy loading — add
loading="lazy"to images below the fold so they only load when needed.
Server and hosting performance
No amount of front-end optimisation can fully compensate for a slow server. Key considerations:
- Upgrade from shared hosting — if your Time to First Byte (TTFB) is consistently over 600ms, your hosting is the bottleneck. Consider a VPS or a platform like Vercel/Netlify for static sites.
- Use a server close to your users — hosting in a UK data centre if your users are predominantly UK-based cuts latency significantly.
- Enable GZIP or Brotli compression — compresses text assets (HTML, CSS, JS) before sending them, typically reducing transfer size by 60–80%.
Caching and CDNs
Caching and Content Delivery Networks (CDNs) are two of the most effective ways to improve performance at scale:
- Browser caching — set appropriate Cache-Control headers so returning visitors' browsers load assets from their local cache instead of re-downloading them.
- CDN for static assets — a CDN serves your images, CSS, and JS from servers close to the user. Cloudflare (free tier available) is the most popular option.
- Server-side caching — for WordPress sites, plugins like WP Rocket or W3 Total Cache cache your HTML pages so the server doesn't regenerate them for every visitor.
Use our free website audit tool to check your performance score and get specific recommendations. Also read our complete website audit guide.
✅ Get Your Free Website Audit
Run a complete audit of your website and get an instant grade with actionable recommendations.
Run a Free Website Audit →