If you’re serious about your WordPress website, you need run a page speed test. There are many variations of these tests out there, and some are more appropriate for your target audience than others. But all of them will give you a pretty good idea of where you can still improve your site.New to WordPress? Don’t worry! Our FREE WordPress for beginners training is here to help. Find out how to set up your own site, learn the ins and outs of creating and maintaining it, and more. Soon you’ll be able to do it all by yourself!
For some of you, some speed optimization recommendations may come across as “technically challenging”, but lucky for you, you have a WordPress website, which makes optimization much easier. One of the things that makes WordPress so awesome is that there are plugins that can help you. Some are free, some paid-for, but all will help you to simplify difficult tasks. In this article, we’ll tell you about a few places you can test your page speed yourself. Then, we’ll look at some speed optimization recommendations and show you how to solve them using plugins.
Running a page speed test
Running a page speed test is as easy as visiting a website and entering your website’s URL into a box. The speed test then analyzes your website and comes up with recommendations. There are many different speed test tools, but here are a couple worth looking at.
- Pingdom has a tool for speed testing, and it lets you test from different locations around the world, or from a server that is relatively close to you. If you’re targeting a local audience, for example, this is a good way to see how fast your website is for them.
- Google Lighthouse is a performance tool that lives in the Chrome browser’s Web Developer Tools. To access it, right click on a page, choose Inspect and check the Audits tab in the new window that opens in your browser. Here, you can test speed for mobile device or desktop, and on different bandwidths and connection speeds. The test result looks like this:
Minor point: most sites appear slower in Lighthouse. This is because Lighthouse emulates a number of situations and devices – for example a slow mobile/3g connection. (see the second bar in the screenshot above). With mobile first a reality, we think this is actually a good thing. If you want to know more, go read Edwin’s in-depth post on Google Lighthouse!
Before Lighthouse came along, Google PageSpeed Insights was a great way to look for speed improvements – and it still is. It even lets you download optimized images, CSS and JS files for your site. But if you’re working with WordPress, you may find it difficult to directly replace your files with these optimized files. Luckily, WordPress has plugins that will generate them for you.
There are many, many more speed testing tools available online. These are just a few that I wanted to tell you about before going into WordPress solutions that will help you improve your site speed.
Optimizing your page speed using WordPress plugins
Once you’ve run a page speed test, you’ll probably feel like you should spend some time optimizing your website for speed. You will have quite a few recommendations, ranging from things you can do yourself and some things that you may need technical help with.
Your speed test might come back with this recommendation:
Images usually play a large part in speed optimization, especially if you use large header images. Or if your site is image-heavy overall. It’s always a good idea to optimize these images. And it can be done with little quality loss these days. One of the things to look for is, like in the page speed test example above, images that are in fact larger than they are shown on your screen. If you have an image that covers your entire screen, and squeeze that into a 300 x 200 pixels spot on your website, you might be using an image of several MBs. Instead, you could also change the dimensions of your image before uploading. And serve the image in the right dimensions and at a file size in KBs instead. By reducing the file size, you speed up your website.
Setting image dimensions in WordPress
WordPress comes with a handy default feature, where every image you upload is stored in several sizes:
So if you want all the images in your posts to be the same width, pick one of the predefined ones or set your custom dimensions here. Images that you upload scale according to these dimensions and the image in the original dimensions will also be available to use.
This means that if, for example, you load the medium size image instead of the much larger original, this will serve an image in a smaller file size, which will load much faster.
Image optimization plugins
There are also a number of image optimization plugins (both paid-for and free) available for WordPress, such as Kraken.io, Smush or Imagify. Plugins usually remove Exif data from the image, which is a good idea because Exif data includes information about camera settings used to take the photo – really interesting for a photographer, perhaps, but not something you need for the image in your blog post. You can also have these plugins replace your image with an image that is slightly lower in quality.
Some of these plugins can also help you resize your images. Take these plugins for a test drive and see which works best for you and minifies your image files best. To find out more about image optimization, be sure to check this post about image SEO.
Another issue that comes up a lot in page speed tests is browser cache optimization.
Browser cache is about storing website files, like JS and CSS, in your local temporary internet files folder, so that they can be retrieved quickly on your next visit. Or, as Mozilla puts it:
The Firefox cache temporarily stores images, scripts, and other parts of websites you visit in order to speed up your browsing experience.
Caching in WP Super Cache
Most speed optimization plugins help you to optimize your site using caching. Sometimes it’s as simple as this:
The Advanced tab of WP Super Cache here has a lot of more in-depth configuration for that, but starting out with the set defaults of a plugin is usually a good start. After that, start tweaking these advanced settings and see what they do.
Note that WP Super Cache has an option to disable cache for what they call “known users”. These are logged in users (and commenters), which allows for development (or commenting) without caching. That means for every refresh of the website in the browser window, you will get the latest state of that website instead of a cached version. That last one might be older because of that expiration time. If you set that expiration time to say 3600 seconds, a browser will only check for changes of the cached website after an hour. You see how that can be annoying if you want to see, for instance, design changes right away while developing.
Other WordPress caching plugins
I’m talking about WP Super Cache here because it’s free and easy to use for most people at least. But there are alternatives. WP Fastest Cache is popular as well, with over 600K+ active installs. It has similar features to optimize caching:
A paid-for plugin I also like is WP Rocket. It’s so easy to configure, you’ll wonder whether you have missed something. But your page speed test will tell you that it works straight out-of-the-box. There are more advanced settings where you can fine tune your site. But before we look at that, we need to talk about compression.
Your page speed test tool will probably tell you to:
- Try to minify your CSS files
- Minify the JS files of your site
- Minify your HTML files or
- Enable (GZIP) compression
In WP Rocket, the settings for compression look like this:
Again, many of the right settings are on by default, similar to Yoast SEO, but even more can be configured to your needs. Your web server’s settings many also affect how well compression works.
If you use one of these plugins but your compression optimization still isn’t working properly, contact your hosting company and see whether they can help you. A decent host should be able to help you out, especially if it’s one of these WordPress hosting companies.
Serving CSS and JS files
The combine option for these files is, as you can see in the WP Rocket screenshot above, not recommended for websites that use the HTTP/2 protocol, which allows multiple script files to be loaded at the same time. But combining these files is still good for non-HTTP/2 sites because it reduces the number of server requests, which again makes your site faster.
Don’t forget CDNs
There are many ways to optimize page speed in WordPress
Page speed tests will give you even more recommendations than we’ve covered here. Again, you might not be able to do all of these yourself. If that’s the case, get help from your web developer or agency, or your hosting company. But in the end, if you want a fast website, WordPress is a great choice because there are many great plugins that can help you optimize the speed of your website after a page speed test!
Read more: Site speed: tools and suggestions »