Every second of load time costs you money. Google's research shows that a 1-second delay in page load time reduces conversions by 7%. A 3-second load time loses 53% of mobile visitors entirely. If your website is slow, it's not just a user experience problem โ it's a direct revenue problem.
This guide covers every lever you can pull to make your website fast โ from quick wins you can do in an hour to fundamental infrastructure improvements.
Want a Website Built for Speed From Day 1?
Every site we build scores 90+ on Google PageSpeed. Clean code, optimised assets, fast hosting โ all included.
Step 1: Measure First
Before fixing anything, understand your baseline. Run your site through these tools:
- Google PageSpeed Insights โ pagespeed.web.dev. Shows your Core Web Vitals and specific improvement opportunities.
- GTmetrix โ detailed waterfall analysis of every resource that loads on your page.
- Chrome DevTools (Lighthouse tab) โ run from your own browser for the most accurate local measurement.
- WebPageTest.org โ test from multiple global locations to understand geographic performance.
Focus on these three Core Web Vitals: LCP (Largest Contentful Paint โ how fast the main content appears), CLS (Cumulative Layout Shift โ visual stability), and INP (Interaction to Next Paint โ responsiveness to clicks).
Step 2: Optimise Images (Biggest Win)
Images are the single largest contributor to page weight on most websites. Unoptimised images are the #1 cause of slow load times. Here's the fix:
- Convert to WebP: WebP images are 25โ35% smaller than equivalent JPEG/PNG with the same quality. Use Squoosh.app or ImageOptim to batch convert.
- Resize correctly: Don't serve a 3000px image in a 400px container. Resize to the actual display size before uploading.
- Use lazy loading: Add
loading="lazy"to all images below the fold. The browser only loads them when the user scrolls near them. - Specify dimensions: Always set width and height attributes on images to prevent Cumulative Layout Shift (CLS).
- Use a CDN for image delivery: Cloudflare Images or imgix serves images from the closest server to your visitor globally.
Step 3: Optimise Your Code
Bloated CSS, JavaScript, and HTML add unnecessary bytes that slow every page load.
- Minify CSS, JS, and HTML: Remove whitespace, comments, and redundant code. Tools like Terser (JS) and cssnano (CSS) do this automatically.
- Remove unused CSS: Tools like PurgeCSS scan your HTML and remove CSS rules that are never used. This alone can reduce stylesheet size by 90%+ on sites using Bootstrap or Tailwind.
- Defer non-critical JavaScript: Add
deferorasyncattributes to scripts that don't need to run on page load. This frees the browser to render the page first. - Eliminate render-blocking resources: Any CSS or JS in the
<head>that blocks the browser from painting the page hurts LCP. Load critical CSS inline; defer the rest. - Avoid WordPress page builders: Elementor, Divi, and similar tools generate excessive DOM size and unused CSS. Hand-coded sites are almost always faster.
WordPress warning: A typical WordPress site with 10โ15 plugins and a page builder theme loads 2โ4MB of CSS/JS on every page. A hand-coded site handles the same visual output in under 200KB. The difference is 10โ20x.
Step 4: Choose the Right Hosting
Cheap shared hosting is one of the most overlooked causes of slow websites. If your server takes 600ms to respond before any content is sent, no amount of frontend optimisation will make your site feel fast.
Time to First Byte (TTFB) should be under 200ms. Check yours in PageSpeed Insights.
Best hosting options for speed in 2026:
- Vercel โ ideal for static sites and Next.js. Global edge network, automatic CDN. Free tier covers most SMBs.
- Cloudflare Pages โ fastest global CDN available. Free for static sites. Excellent for HTML/CSS/JS sites like the ones we build.
- Netlify โ great developer experience, automatic deployment from Git, global CDN included.
- Hetzner + Nginx โ if you need a VPS, Hetzner offers excellent performance at low cost with proper Nginx configuration.
Let Us Build You a Fast Website
Every Solvv AI site is hosted on Vercel or Cloudflare Pages โ global CDN, 90+ PageSpeed scores, and lightning-fast load times as standard.
Step 5: Optimise Web Fonts
Google Fonts can add 300โ500ms to your load time if loaded carelessly. Use these techniques:
- Use
rel="preconnect"for Google Fonts domains (already in our template) - Only load the font weights you actually use โ loading 8 weights when you use 3 wastes bandwidth
- Add
font-display: swapto prevent invisible text while fonts load - Self-host fonts using Google Fonts Helper for maximum control
Step 6: Implement Browser Caching
Once a visitor has downloaded your CSS, images, and JS, they shouldn't have to download them again on the next page visit. Browser caching stores these files locally on the visitor's device.
Set long cache headers (1 year) for static assets โ CSS, JS, images โ and use cache-busting through filename versioning when files change. On Vercel and Cloudflare, this is configured automatically. On self-hosted servers, add it to your Nginx config or .htaccess.
Speed Optimization Priority Order
If you're overwhelmed, fix in this order:
- Measure with PageSpeed Insights โ identify your biggest issues
- Compress and convert all images to WebP
- Defer non-critical JavaScript
- Migrate to a modern CDN-backed host (Vercel or Cloudflare)
- Minify CSS and remove unused styles
- Optimise web font loading
- Implement caching headers
Skip the Optimisation Headache
We build performance-first websites that score 90+ on PageSpeed from day one. No retrofitting required.