Why is my website slow?

Why does your website need to be speedy?

Before customers even start navigating around your website, a short loading time is going to help them locate it in the first place. Google now takes the loading speed of a website’s mobile version into account when compiling its search results. In short, a faster site will help you rank higher on Google and other search engines.

Once people have found your site, a quick loading time will help you keep them there too. We’re used to a higher browsing experience, and most people will start getting frustrated if the site takes longer than 3 seconds to load. When you realise that the average time a page takes to load using 3G is over 12 seconds, you can see why this is a problem.

🎞How to generate a video that compares the performance of two sites:

1. Go to https://t.co/MbP6FcaP6M
2. Visual Comparison > Start Test > Create Video

As much as I love numbers, I think this type of visual comparison is really powerful for conveying impact.

Example 👇 pic.twitter.com/JO5INVDg3w

— Katie Hempenius (@katiehempenius) September 26, 2019

The stats tell us that for every extra second your web page takes to load, you will have:

• 11% fewer page views
• 16% decrease in customer satisfaction
• 7% loss in conversions

So not only will people close your site if a page loads too slowly, but the increased friction will result in them loading fewer pages, and spending less time on your site. They may even give up altogether, and decide not to return.

Connection speed and reliability are increasing all the time, but even so you can’t depend on there being good access everywhere that your users are.  Their internet speed will vary depending on whether they are at home, the office, on coffee shop wifi, or out and about using their phone on a train. Even people with fast 4G phone connections are actually using 3G some of the time.

How do we make your site speedy?

If you’re interested in the technical stuff, there are three big areas where we can get those all-important performance improvements. We think about these when we design and build our websites.

1. On the servers

• Use high quality servers, with fast processors. Servers receive your request for a webpage, send the page data back to your device, and reassemble it again for you to view. So how fast can your web server serve pages? There’s a noticeable difference compared to cheaper shared hosting, especially if many people are on the site at once.
• Minimise the amount of work that the server needs to do. By using only essential and high quality WordPress plugins and writing nice, clean code, we make sure there’s not too much work for our server to do to create the web page.
• Save web pages we’ve already made. We use a server cache to save pages that have already been created. This completely side-steps the database and templating steps, and we can use this saved copy until the content changes. This sounds like jargon, but what it means is that the server doesn’t have to deal with a repeat request from scratch.

2. Over the network

• Send as little data as possible. Bloated web pages can take a lot longer to load than their leaner cousins. But there has been a trend in recent times that has seen the average page size go up and up. There can be lots of assets that make up a page, including the page structure itself (html), styling, images, javascript to add interactive elements, adverts or tracking…Big images are a major culprit. Take a look at this extreme example from CNet, where viewing just one giant picture added $2.61 to a user’s mobile bill! At a dozen eggs we use a plugin to automatically compress images into a range of sizes, so the server can send back the one that’s most appropriate for the device.
• Send that data the shortest distance possible – yes, physical distance. If you have a global audience you can use a CDN (Content Delivery Network – a server more local to them) to save copies of your webpage geographically closer to different user bases. That means when they access your page, the version they need can be picked up from their nearest server, rather than being requested from the other side of the world.CMP

3. On the device

• Be smart with styling and javascript. These contain a lot of data, which has to be re-interpreted by the device that receives it. The more styling and data there is, the more time it takes for a device like a smartphone to render a webpage. At a dozen eggs we’ll often keep our javascript usage to a minimum, and use it as a ‘progressive enhancement’ to web pages. This means the pages still look great and work well even without it.
• Use fallback fonts. Slow loading web fonts can be a major cause of delaying the First Contentful Paint (the moment when all the content of your page has appeared on the device). So we can show a similar font that the user already has on their device, while waiting for the web fonts to load. It maintains the look of the website while ensuring that content is available to your users quicker.

What’s next? Test your current site speed

Websites can be tested to see how they shape up in terms of server response time, network time, and how long it takes to show that content on the screen.

Put your site into webpagetest.org/easy, or Google’s Page Speed Insights, which will analyse your site and show you a waterfall of resources about the elements that make up your page. This includes images, styles, icons, and fonts. Here’s how one of ours looks:

The less red you have, the more efficient and speedy your site will be. This gives you a basis to start making decisions about the future of your webpage, and building a site that works for both you and your users.