WordPress website running slow?
A chief complaint I come across from WordPress users is, “My website is so slow!” And they are right. Their sites take 5-10 seconds to load. That’s way too long.
Back in 2010, Google said that websites should load in two seconds or less, and a 2009 survey found that “47 percent of consumers expect a web page to load in two seconds or less.” On top of that, “40 percent of consumers will wait no more than three seconds for a web page to render before abandoning the site.” See more info about this study in the article “How Fast Should A Website Load in 2016?”
So, you’ve probably done the one thing everyone recommends — installed a caching plugin.
Probably something like, W3 Total Cache or WP Super Cache, which did help a bit, but it’s still taking over two seconds to load. So how do you get your site even faster so you start getting that sub-two-second load time?
There are other options:
What I’ll be discussing here is based on Google PageSpeed Insights, a great tool for showing you what your website is doing correctly and areas you can improve.
Also, you’ll want to be able to measure your site’s load time before and after. For that, I recommend Pingdom’s Website Speed Test.
Now, let’s jump in and make your website fast.
Step 1: Get A Proper Hosting Account
If you’re like me, you’re not very familiar with server design and architecture. However, having a server that is setup correctly for your website is one of the most important aspects of website speed.
Luckily, you don’t need to know about server design or architecture. You just need a hosting account with a hosting company that knows what they are doing. $3 a month hosting may seem enticing, but you get what you pay for.
Instead, you’ll want a hosting account set up to maximize performance. For WordPress, that means a managed WordPress hosting account. Some examples include WP Engine, WP Radius, Flywheel, and Pantheon.
Step 2: Optimize Images
On most websites, images are what slow the load time down. Having a lot of large, high-quality images can cause some websites to take 15 seconds or more to load.
But, because websites are viewed on computer monitors with limited resolutions, and because many images contain data that isn’t needed, we can compress these images and make the file size smaller. A smaller file size means a faster load time.
Now, people usually get scared when I mention image compression because they start thinking their images will look like the ones from 90’s websites, all blocky with strange coloring, but you can use a compression technique called lossless compression which compresses the images without degrading the quality.
With WordPress, doing that is quite easy. It can be done with a plugin!
I recommend EWWW image Optimizer. Anytime you upload an image, it will automatically optimize it for your site. On top of that, you can have it go through all older images and optimize those too. It will even optimize images from themes and plugins.
Some hosting companies won’t allow you to use this plugin, though. So if that is the case, you can use their cloud version.
There is a small fee per image to use the cloud servers to optimize your images, but it is extremely affordable.
Step 3: Minify And Concatenate
Just like images, the number of files your site has to load will cause your site to slow down. WordPress, your theme, and all your plugins will be loading CSS and Javascript files, and those files can start adding up. So, we can combine them and then remove all unnecessary characters.
Now, you will load one CSS file and one JavaScript file. Doing this can be quite difficult to handle. So you can use a plugin instead. Autoptimize will handle all the minification and concatenation for you.
If something breaks, such as if a JavaScript file needs to be loaded before the Autoptimize files, you can set Autoptimize not to affect that file.
Step 4: Inline Above The Fold Content
I view this more as a speed trick than actually increasing the speed when I did some tests.
When loading a website, content loads in a particular order, and this order isn’t always great. Sometimes content at the bottom of your screen will load before content at the top, which can delay content at the top of the screen. This is called Above the Fold since visitors can only see what’s at the top of the page.
So, you can start using this technique to have the content above the fold appear first, and Autoptimize will allow you to do this as well.
All you have to do is take your style.css, copy it, and paste it in this tool.
It will scan your page and let you know what to enter into Autoptimize’s setting for inlining CSS.
The only problem is that some pages may require different inlined CSS. I recommend testing it out and using the Critical Path CSS Generator tool from above to try on other pages.
Step 5: Use A CDN
Finally, you’ll want to use a CDN, Content Delivery Network.
The specifics of a CDN can get quite complex., but in simple terms, a CDN will load images, media, and other files from servers other than your main server that makes everything load much faster.
A great CDN provider is MaxCDN, and it can easily be set up through your caching plugin.
If you want to learn more about CDNs, check out WP Beginner’s “Why You Need a CDN For Your WordPress blog”.
What Tips Do You Have?
Making a WordPress site faster is about applying best practices, and then testing it out. Have you found certain techniques or plugins that have helped speed up your site? Please share them in the comments below.
18 Comments