How to Improve Your Website Speed

The internet is a competitive place. There are countless websites that all want to attract as many users as they can get. Gaining a competitive advantage is difficult. A fast website offers that advantage.

Since the rise of native smartphone apps, users have become accustomed to higher speed and responsivity. When a user taps their screen, they expect a fast response. A website that responds with a blank screen and a snails-pace loading bar gets abandoned in favour of a faster one. Seconds matter. A user is 32% more likely to leave a website that loads in three seconds than if it loaded in one second.

Don't despair. Slow website speed is not hard to solve. In this article, we will look at the key factors affecting website speed, how to test them, and how to fix them. By the end of this article, you should have no trouble speeding up your website.

Website speed is the time it takes for a website to load.

Now we know what it means, let's discuss how we measure website speed. We don't sit there with a stopwatch waiting for the loading bar to finish. There is more to it than that. There are different ways to measure website speed. We call these ways: 'Website Speed Metrics'. Let's look into those now and see what they tell us.

As I said, there are many ways to measure website speed. Some are more helpful than others. Below, I define the main Website Speed Metrics.

Page Load Time is self-explanatory. It is the time a web page takes to load all its content. This value does not tell the whole story. Other metrics provide more detail and tell us more about how to improve our website speed.

When a browser loads a web page, it sends a request to a server for the website data. The 'Time to First Byte' refers to the time taken for the first byte of website data to return to the browser. 

This time is affected by two main factors: server speed and internet connection strength. We can't do much about the internet connection. The main variable we can affect is the server speed.

Hosting companies often provide different server options at different pay levels. A faster and more powerful server will be more expensive but much quicker. If you do not want to pay more for your server, improve other speed metrics first.

A browser needs a certain amount of data to render a web page. The Start Render Time refers to the time taken to reach this level of data.

Like TTFB, this comes down to the server speed and internet connection. You can't change much else to improve this metric.

Speed Index measures from when the web page first displays to when it finishes rendering. The Speed Index naturally improves as you target and speed up other metrics.

FCP measures how long the first content element takes to display on a page. Often, this element is the navigation. It can also be a background image or something similar. Essentially, it is the first thing to render into the page.

To improve this metric, reduce the size of background images or even preload them. For navigations, ensure that your font loading is optimised using 'font-display'. If you don't know about 'font-display', this video by Google explains it very well.

LCP refers to the main piece of content visible during the page load. Typically, it is a heading or hero asset (image or video). The approach to improving this metric is similar to FCP.

We can also 'eliminate render-blocking resources'. That means reducing the amount of code that runs before the render starts. That means pushing unnecessary CSS and JS to the bottom of the page. We can do this manually or use a plugin to do it for us. I'd recommend a plugin for those without expertise.

Slow website speed has the power to undermine a great website. Users are rarely patient. Most will abandon a web page that takes longer than three seconds to load. A website losing users is a failing website.

Slow page loading affects other parts of website performance. SEO performance will tumble as bounce rates rise and click-through rates fall. Users abandoning the website send signals to search engines to lower its ranking. A lower ranking leads to fewer users finding the site. With fewer users come fewer chances to convert them to customers. All that means, a slow website will affect your bottom line. 

Conversely, a fast website improves user experience. Improved user experience means more click-throughs and lower bounce rates. Search engines start to rank the site higher. Higher rankings mean more traffic and a larger pool of users to convert to customers. A fast website will boost a business's reach and profits.

We now know how important it is to have a fast website. We know what metrics to test to see how fast our website is. Now, let's go deeper. Let's discuss the key areas that affect website speed and how you can improve them.

I mentioned this already in the TTFB section. The more powerful a web server is, the quicker it can respond to requests and send data. Most hosting companies have tiered plans.

The cheaper plans often use 'Shared hosting'. That means you have many websites on the same server. More websites to manage on one server makes it slower. 

Having 'Dedicated hosting' means you have one server for one website. That is much quicker. Dedicated hosting is often more expensive but better for high-traffic websites. Refer to your hosting company to see which option is best for you.

Websites are becoming more and more visual. Images, video, audio and 3D models all must be downloaded and rendered on a web page. The more media files we include on a web page, the slower it will be.

We must optimise our media as much as possible. Online tools like TinyPNG and Squoosh help us reduce image weight without losing quality. Tools like Handbrake do the same for video.

Minimising file weight is not the only way to optimise web page media. We can also affect how it is loaded. Lazy-loading helps the page prioritise the files used higher up the page. That means it downloads them before the ones 'below the fold'. Without lazy loading, they are all downloaded at once.

For the highest-priority media, like the LCP content, we can preload it to download concurrently with the web page data. Preloading means the media renders quicker but slows the TTFB.

Imagine a book with huge paragraphs filled with long words and boring language. Now, imagine a book with short sentences and simple language. Which is easier to understand? The second one, right?

It's the same for website code. Long and complex JavaScript files take longer for a browser to understand and compute. Using optimised code makes it easier for a website to compute JavaScript code and use it on the site.

With every website now heavily dependent on JavaScript to function, using simple, easy JavaScript code is imperative for a fast website. Having a good Front-end Developer is essential here.

All websites rely on plugins to make complex features easy to use. The plugins can have a negative effect. When we outsource the code to a plugin, we rely on that plugin to have fast, optimised code. If it does, it will fit into our site seamlessly. If not, it can slow it down immensely.

Using plugins is essential. It makes everyone's life easier. Where possible, opt for popular plugins with good reviews and regular updates. These are more likely to be performant and secure.

Now you know all about website speed. You know what it is, why it is important, and the main factors affecting it. Now, let's see how to test your website. These are some of the best, most comprehensive tools for testing your website speed.

A fast website is vital. In many ways, website speed is as important as website content. If a user abandons a website because it loads too slowly, the content doesn't matter. Keep that in mind and use the advice I have given here to speed your website up and remove the possibility of users leaving it because it is too slow.