Skip to main content
Let's talk
Home Services Work Blog About me Contact Pricing Let's talk
Back to journal Development · 3 min read

How to speed up a website without losing its design

Performance work starts with a symptom: the hero appears late, a button responds slowly or content shifts during loading. A single PageSpeed score does not explain the whole experience. Connect measurements to what visitors notice and make small, verifiable changes.

1. Record the starting point

Choose the home page, a service page and one heavy article. Record the device, connection, URL and date. Run several measurements so one unusually slow response does not determine the plan. Note when the main action becomes usable.

Core Web Vitals measure loading, responsiveness and layout stability through LCP, INP and CLS. The “good” thresholds are 2.5 seconds, 200 milliseconds and 0.1 respectively, assessed at the 75th percentile of visits. Lab tests and real-user data answer different questions.

2. Start with images

Compare an image’s file dimensions with the space it occupies. A small card rarely needs a source several thousand pixels wide. Prepare appropriate sizes, compare WebP or AVIF with the original and inspect fine details after compression.

Images below the initial viewport can be lazy-loaded. Do not automatically apply loading="lazy" to the prominent image that may determine LCP. Set dimensions or an aspect ratio so the browser reserves space and nearby text does not jump during loading.

3. Review fonts and external services

Count the fonts and weights requested before the page can be read. Remove unused requests, check fallbacks and avoid hiding text for a long time. After a change, open the navigation and form; saving bytes should not damage their layout.

Inventory widgets, analytics and libraries, with a purpose and owner for each. Remove services that are no longer needed. For something only required after a user action, consider deferred loading and test its effect on the complete journey.

4. Reduce work during interaction

If scrolling or clicking feels slow, look for work triggered too frequently: size calculations, cursor handlers or large interface updates. Disable suspect effects individually and compare behaviour.

Inspect heavy blurs, background videos and large moving layers on an ordinary phone. Removal is not always necessary; a smaller area, fewer simultaneous elements or less frequent updates may be enough. Keep clear feedback after button presses so people know their action was received.

5. Check speed and page integrity together

Repeat measurements under the same conditions. Then follow the main journeys: open navigation, visit a case study, change language and complete form fields without submitting. Check for missing images and damaged line breaks.

Keep the originals and record the change and result. A permanent perfect score is not a useful promise because content and test conditions change. Set a practical budget for new images and apply the same review process to new pages.

What to do next

Reducing heavy images and unnecessary requests is often a useful first step. Let measurement set the priority: fix what delays a visitor’s actual task.

Sources and further reading

Discuss your website
Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++ Let's talk+++
Project in mind?

Let's build your
digital product

Websites, SaaS, bots and AI integrations with a defined scope, timeline and launch support.

Get in touch