Slow Website? Reduce Your Load Time By Over 50% With These 3 Changes
When was the last time you gave some thought to your website’s speed?
I’m sure you that a slow WordPress website needs to be fixed, but looking for answers tends to end in overwhelming jargon rather than actionable steps you can take, right?
Fortunately, fixing a slow website doesn’t need to be so complex.
In this article, we’re going to look at how you can speed up your WordPress website and focus on best practices even if you aren’t technologically minded.
- 3 simple solutions to improve your website’s speed
- The right habits to follow to keep your website fast
- Exact settings to use when configuring speed plugins
How to Get a Fast Thrive Themes Website?
Did you know we refactored our entire code base to make it leaner and faster. This project is called "Project Lightspeed" and it allows our users to optimize their Thrive sites for faster load times in just one click.
Not Technical? Don't Worry!
Even if you don’t care for the technical side of speed optimization, just look out for feature boxes like this one with key takeaways that you can change on your website.
You might have heard of us talking about the 80 / 20 rule, also known as the Pareto Principle. This says that “for many events, roughly 80% of the effects come from 20% of the causes”.
The discussion on website speed can easily waste more time than it’s worth. But we don’t want this topic to be a distraction for you, so instead of getting bogged down in overly technical junk… we’re going to look at the big wins that will have a noticeable impact on your website.
Let’s start by looking at the problem.
Do You Have a Slow Website?
When it comes to a WordPress site, there are many factors that increase or decrease loading speed. The interplay of those factors will result in the time your site takes to load.
Hosting, the theme, plugins, 3rd party scripts and resources... sounds complex already, doesn’t it?
We wish it were as easy as “use our speed-optimised software and forget about it”.
But there’s a little bit more to it than that.
The Two Reasons Why Speed Matters
When we talk about speed, often we mean the difference of a few seconds. I can hear the skeptics already, “That’s pointless! Why all the discussion over shaving off 3 seconds?”
Well, there’s a few reasons why but most of them boil down to how people feel about waiting.
1) Conversion Rates are Lower on Slow Websites
What do website visitors do if they have to wait?
Time and time again studies have seen a direct link between load time and conversion rate.
If you run a Pay-Per-Click advertising campaign, you'd better hope that each person that clicks is sticking around because those clicks cost you money.
It's hard enough to attract the right visitors in the first place. Test their patience and they won't even be there long enough to click 'buy' or 'subscribe'.
You literally have a few seconds to hook your visitors on arrival at your site. If you are wasting those precious seconds on page load, then it has a direct effect on your conversions. Just have a look at the findings in this report:
“Desktop pages that loaded in 2.7 seconds experienced a peak conversion rate of 12.8%. Pages that loaded 100 milliseconds slower - in other words, in 2.8 seconds - experienced a 2.4% decrease in conversion rate.” - Akamai Retail Report
All that time spent crafting the best headline is wasted if the visitor abandons the site before they've even had a chance to read it.
Give them a reason to stay. Quickly!
Users are more likely to leave a slow website than a fast one, and that will affect your conversion rate.
2) Load Time Affects Google Rankings
Google’s goal is clear: give the right solution to a search as quickly as possible.
The challenge is that Google won’t share their algorithm, which is how they figure out who gets the top spots in search results. Google have said that website Speed affects Search Rankings, but they haven’t revealed the extent of that effect.
What we do know, though, is that Google monitors how their users behave when they click through to a website. If they stay on the website for a few minutes, then it’s fair to say that the visitor saw something they liked. That’s a plus for you and it can improve your ranking!
But if a visitor clicks through from Google to your website and all they see is a blank browser window that takes too long to load, what will they do? They’ll hit that back button. Google will know that they spent less than a few seconds on your site before giving up.
The effect? Google might decide your site isn’t such a good fit for that search term if visitors are rejecting it quickly. Down goes your ranking.
This observation has been seen a number of times, and there is a noticeable correlation between Search Ranking and site speed: Sites that load faster rank higher.
However, it’s still just a guessing game. Perhaps websites that get the top spot just happen to have invested time and effort into site speed. It might not be because of that speed.
A faster website can improve your search ranking, though we don’t know to what extent.
The 3 Layers of a Fast WordPress Website
Now that we see the benefits, it’s time we look at how to fix your website speed issues.
This is also a great opportunity to put the spotlight on one of the Thrive Themes team members who usually lives behind the scenes: Lorant.
If you’ve used our support forum, you may have digitally met Lorant. He’s one of our technical support experts and is always happy to help. He’s helped so many of our users with issues that were related to site speed and now he’s offered his observations and expertise for this article.
I can’t take credit for the extraordinary knowledge you’re about to unpack.
Credit goes to Lorant. Insert digital applause.
Speed is important, but you should optimize for the best user experience possible, and not for speed itself. Delivering awesome stuff to your site visitors at a decent speed is far better than delivering s***, really fast."
Hosting has one of the greatest impacts on your site speed, even though you can’t control it. Apart from choosing a good website host, that is.
Each time someone loads up your website, that information is sent from your Hosting provider’s hard drive to your visitors browser, so it’s the first speed bottleneck you’ll encounter. The way the hosting company has set up their network, their actual server locations, and their infrastructure all affects the speed at which your website loads.
If you have a poor host, then it won’t matter how much additional technology you use to speed up your WordPress site, your web host can only deliver your website data at a certain speed.
Of course, the importance of host speed depends on your goals. If your website is a personal portfolio of your freelance work, then speed won’t matter as much as for an ecommerce site getting thousands of hits per day.
In my opinion choosing the right host for the job is the best investment you can make when building a WordPress website."
The best thing about WordPress is that you can build almost everything by using different bits and pieces from different developers, put them all together and make it work.
To illustrate what we’re talking about, Lorant ran a test for us.
He built a simple website with some images, a number of pages and links, and installed multiple plugins from different developers. Not all plugins play nicely together so this is a good example of an average website.
Using Pingdom, he tested that website’s speed first on a cheap shared hosting provider:
Now look at the speed difference when moving that exact same website over to a high quality hosting provider. Absolutely nothing else was changed about the website:
That brought the load time from 5.35 s down to 899 ms… simply by changing the host!
This example shows the two extremes in speed, but the takeaway is clear:
Without changing anything on the website, your speed can be vastly affected by the host you choose.
Lorant Talks About Hosts:
“There are some big players in the industry offering cheap shared hosting options, and they can be quite hit-or-miss.
GoDaddy, Hostgator and Bluehost are huge players, but they have a reputation of overselling and overall poor performance and poor support. Since they’re huge, they will have a lot of happy customers simply because many of them hardly use their sites, so they don’t run into problems and are happy to pay for these companies.
A mid-range option that gets good reputation is Siteground. They seem to be the go-to solution for people who want decent hosting without paying a lot.
Higher end solutions are properly managed hosting packages, such as our recommendation with WPX Hosting.”
Something else to be careful of is the low-price entry packages that hosts provide. For example, SiteGround’s ‘GrowBig’ account is $7.95 per month… but only for the first year. After that, it bumps up to $24.95 per month… roughly the same price as the far superior WPX hosting, anyway.
If you are budget conscious, then start with one of these entry level packages for your first year, but once you’re paying full price, look for a superior host to invest that money and move your site across.
2. CONTENT OPTIMIZATION
If you got the server-side configuration correct, it’s time to move on to content optimization. On an average site, the main resource drain are images and this is especially good to check since you have control over optimizing them (for a comparison, there’s little you can do to optimize embedded youtube videos)."
The Average Webpage is now 3 MB in size. That’s how much data needs to be downloaded when a visitor arrives and it includes images, fonts, text and code.
To speed up your site, you should always aim to keep your page size as small as you can, preferably below average. But sometimes a single uncompressed image can be larger than 3MB.
If you aren’t doing anything to optimize your images, then you could be making huge websites which are awfully slow to download.
There are 2 ways to fix this.
If you’re using professional stock photos, images from a designer or images you’ve taken on your own camera, you might find that the dimensions are far too large. Take this example:
4400 x 3000 pixels? Although a web browser would resize the image to suit the visitors display, it still has to download the entire file size first.
That’s like buying 300 square meters of carpet just for one small bedroom. A waste of resources.
It’s best to upload the largest version you think you’ll use. WordPress creates different versions of the image on upload. So if you plan to use an image as a full-width background, upload it at 1920px wide. If you know you’re only going to use it in a 700px content area and will use it as a featured image, upload only a 700px wide version.”
If your image file is larger than you intend to display it, resize it before uploading to WordPress.
Both Windows and Mac have a built in crop and resize feature in their default image viewers, but if you prefer more control you can use use an online service like Canva, or download free desktop software like GIMP or Paint.net.
Once you’ve uploaded an image, WordPress will create different sizes of the file. When you select that image in an editor such as Thrive Architect, choose the dimensions that closely reflect the size you intend to display.
In other words, don't use the 'full-size' if your intended use is just a thumbnail!
WordPress also has it's own resizing and cropping feature built in, though we've discovered that it can be slightly buggy.
Here's a short video Shane made that shows this WordPress resize feature in use:
If you do want to resize your images from within WordPress, make sure you follow the next step before uploading.
Resizing your images isn't the only way to reduce their file size. Another way is with Image Compression.
Image Compression is the process of cleverly storing the visual data in an image. There’s some pretty smart software out there that can dramatically reduce the file size of an image and barely affect how it looks.
At Thrive Themes, we always use Kraken.io for our image compression. And yes, every single image you see in this article has been compressed or ‘Krakened’, as we call it.
Kraken has a free website interface you can use, and it’s incredibly simple. Once you’ve resized your images, you can drag and drop them into Kraken.io and it will apply their image compression to the files. Then you download these compressed images before uploading them into your website.
Here is an example with 6 of the images used in this very article being compressed through Kraken's website interface. Take note of the last line, a summary of the results on all 6 images.
Originally, these 6 images came to 279KB, but Kraken reduced them by 70.33% down to just 82KB! And I’ve seen some files reduced by even more!
Now consider how much smaller this makes your website to download… every kilobyte saved is speeding up the time it takes for your website to load.
Kraken isn’t the only option out there. There are plugins like ShortPixel and WP Smush that allow you to compress files from inside your website. While each image compressor is good, they don't all work the same way for every image and you might find some tools give better results in certain conditions.
Rather than stressing over which one is best, it's more important that you use some kind of compression than none at all.
Here’s what Lorant has to say about his preference:
I prefer kraken.io instead of WP Smush or Shortpixel because it’s a hosted solution that doesn’t depend on my server and I have full control over the images before I upload them to my site. ”
Always resize your images to the largest dimensions you intend to display on your site. And for excellent and simple image compression, use Kraken.io’s drag and drop web interface before uploading the images to your site.
3. CACHING & MINIFICATION
Oh boy. Here we go.
This aspect of speed already sounds scary, right? Don’t worry, our goal is to give you the exact solutions you should try. This means: no excessive information that doesn’t matter.
The first thing to note is that you need to be careful with these tools, because the incorrect settings can cause a headache. But used correctly it really makes a difference. We’ll show you how.
Let’s keep this easy:
When someone opens your website, your host needs to figure out what they should be seeing and then send all of that information to them, bit by bit until the page fully loads. This means your host has to do some thinking, and dig into your WordPress database to pull up the right stuff to send. That takes time.
But you aren’t changing the content on your website every minute of every day. So your host shouldn’t need to spend that time figuring out what information each user needs every single time, right?
Instead, you can save time by telling your host "send the exactly the same thing you sent the last visitor". This cuts out the thinking stage.
That’s what Caching does.
Caching means that so long as nothing on your website has changed recently, there is a version of all the information for a web page stored in a neat package. When a visitor arrives as your site, your host sends them the whole package in one go, rather than thinking about each bit first.
Lorant noted that there are 4 types of caching we encounter:
- Server side. “Many hosts, especially those who claim to offer WordPress hosting provide some type of server side caching. The user may or may not have options to configure these.”
- Caching plugin. “A plugin that you install on your site to handle caching for you. User has full control over the caching options. W3 Total Cache, Autoptimize, WP Fastest Cache, WP Super Cache, WP Rocket are popular ones.”
- Caching from CDN (Content Delivery Network). “We usually encounter only Cloudflare as a CDN, but it does come with its own caching”
- Local, browser cache. “Modern browsers also try to cache pages in order to improve speed.”
Unless you really know what you’re doing and how to combine the different caching layers, it’s recommended to use either server-side, a plugin or CDN… don’t combine multiple caching types.
In a moment we’ll give you our specific recommendations, step by step for caching.
Isn’t the word ‘Code’ intimidating? Yeah, we agree… which is why all of our plugins and our Visual Editor Thrive Architect are there to give you full WordPress functionality without touching a line of code.
But behind the scenes, what you don’t see is that there is lots of code. And it might be worth optimizing that code with a process known as ‘minification’.
According to Wikipedia, Minification “is the process of removing all unnecessary characters from source code without changing its functionality”.
It makes your website leaner, cleaner and faster. We’ve already gone to great lengths to ensure that our plugins are fast, but with the right configurations, you can enable Minification and speed up your WordPress website even more.
Because Thrive Architect is creating lines of code behind each action you take, it’s incredibly important that you disable minification for logged in users! Minification can clash with any plugin, not just ours!
Our Suggestion for Caching & Minification
Ok, we promised to keep this easy for you. So here is our suggestion to bring the speed boost of both Caching and Minification to your website in one go.
Use the free WordPress Plugin W3 Total Cache. But use the right settings!
Lorant has been so kind as to show the exact settings you should use for W3 Total Cache. Here’s the video (no audio):
And here is the direct link if you want to look more closely.
Regarding these setting, Lorant also adds:
I left out Object Cache and Browser Cache on purpose. Those 2 options can use a lot of server resources and can actually slow down sites hosted on shared servers.
Don't use multiple types of Caching. Instead, just use the free W3 Total Cache plugin for WordPress and configure it just as Lorant suggests in the above video.
And make sure you disable minification for logged in users!
What About CDNs?
We don’t recommend you use CDNs until you have a website that is getting a lot of traffic.
But so that we do justice to the topic of speed, we’ll quickly mention what they are:
CDN stands for Content Delivery Network. It’s a way of moving your website content physically closer to your visitors to increase speed. Even if your website is fast, a visitor in Australia connecting to a website hosted in England has to wait for that data to travel around the world.
By using a CDN, you can store packets of website data on a network spread out around the world, allowing website visitors to download from the server closest to them.
Don’t worry about CDNs for now. Just know that one day when you’re ready to take your speed to the next level, you might want to consider CDN services.
Speed Up Your WordPress Wesbite - The Checklist
With just these 3 changes alone, you’ll start to see a noticeable impact on your site speed and as a result hopefully a small improvement in your website conversions. So here’s your checklist:
- Use a good host! We recommend WPX for the higher end, and if you can’t afford it, then SiteGround.
- Optimize your images! Resize them to the maximum size you intend to display them, and use kraken.io to compress them before upload
- Set up Caching & Minification! Use the W3 Total Cache plugin with the settings above.
There’s much more that can be done if your WordPress site is slow, but if you follow these 3 steps in this article then you’re sure you're covering the 20% of changes that will bring 80% of improvement.
And if you do run into any technical problems, commenting here isn’t the right place. Instead, head into our support forums for some assistance from our team. They know more about this than I do.
You might even get a reply from Lorant himself!
Let us know what you thought of this article by leaving a comment below.