I’ve found the perfect combination of plugins to score a 100 on Google PageSpeed Insights with WordPress. Read on to learn how I did it.
Lately, I’ve been reading discussion after discussion about Google’s PageSpeed Insights tool, in preparation for this post. After hours and hours of research, I’ve come to a conclusion.
PageSpeed does one thing extremely well, regardless of what anyone says.
It divides the SEO community.
I’m British, but I live in the States. We have a saying in Britain.
“It’s like Marmite, you either love it or hate it.”
If you don’t know what Marmite is, Google it. Let me tell you, if you like salty food, you’ll LOVE Marmite.
You’re losing them, James. Pull it together, man.
What is Google PageSpeed Insights?
If you know what Google PageSpeed Insights is, skip ahead to the next section. If you have not heard about PageSpeed Insights before, take a knee.
PageSpeed Insights is a tool that scans any webpage and, using a series of optimization testing algorithms, gives a score out of 100 based on how well the page performed.
It also gives you a series of recommendations for you to fix your page and improve your score.
The reason why it’s so popular is that it’s been created by the SEO gods themselves,
What? Neil who?
And if PageSpeed Insights has been crafted by Google, then surely it must be a good indicator as to how they rank your webpage in the SERPs?
What’s the Problem with PageSpeed Insights?
I personally don’t have a problem with it.
I think it’s a great tool. In fact, I think you should go ahead and put your own webpage into PageSpeed Insights and see what score and feedback you is returned.
Unfortunately, the world isn’t about me.
The SEO community is in two minds with PageSpeed Insights:
- It’s BS and doesn’t mean anything. The New York Times has a score of 35, and they’re one of the biggest websites in the world.
- It’s a pretty useful tool for giving you an indication as to what parts of your site could use a tune up to get you closer to the speed that Google is looking for.
First of all, the New York Times doesn’t need to care about what score they get from PageSpeed Insights. Millions of people will go to their website regardless.
I mean, I do see where the naysayers are coming from, to a certain extent.
PageSpeed Insights does complain about Google Analytics if you have it installed on your site.
A tool created by the very same people who gave birth to PageSpeed Insights.
That’s like wanting to make some art and deciding to recreate a Jackson Pollock painting, and then complaining about the mess you’ve made on the floor around you.
It’s your own mess. You made it, why are you complaining about it?
How To Get 100 on PageSpeed Insights with WordPress
The rest of this article will be opinionated. It might read a little differently to most other articles about optimizing WordPress.
I’m going to avoid phrases like: “Use a good hosting provider” and then proceed to list three different hosting providers for you to pick from.
Nah. I’m not going to beat around the bush, as they say.
I’m going to tell you exactly how I got a 100 score on Google Page Speed Insights.
Word for word.
Plugin for plugin.
Code for code.
1. Use SiteGround for Your WordPress Hosting
I’m probably the one hundreth person to recommend SiteGround for WordPress hosting.
Why? Because it’s fast, easy to setup, secure, and above all, affordable.
How many more times do I have to inflate their egos?
I’m tired of telling my friends and family to use SiteGround by now. It’s all I say when they ask me what hosting provider they should use to host their new WordPress site.
If you do decided to host your WordPress site with SiteGround, I’d really appreciate it if you click the button above as I’ll get a small commission for referring you.
Oh, you’ve found a WordPress host that’s cheaper? No worries, I’ll see you in a few weeks when your site keeps going down, or your customers complain about how slow it is.
I’ve been a happy customer of SiteGround for a very long time, and I’ll continue to be a happy customer for many more years.
SiteGround are also recommended by WordPress.org.
You know, the people who make WordPress.
2. Download the Autoptimize WordPress Plugin
There are free WordPress plugins, and there are paid WordPress plugins. You do not need a single paid WordPress plugin to handle your cache.
All you need to do to get blazingly fast, optimized caching on your WordPress site is install Autoptimize, by Frank Goossens.
Autoptimize has over 1 Million active installations and is actively maintained, unlike some of the other WordPress cache plugins which have been left to die as newer versions of WordPress are released.
Just look at those ratings. 795 very happy customers!
I’ve tweaked the settings to my liking and have found a sweet spot that works well.
I’ve shared my settings below. If you have any questions, leave a comment at the end of this post and I’ll help you out.
Frank, we love you! Don’t you ever stop developing Autoptimize and caching our WordPress pages. We’d be nothing without you.
3. Compress Every Single Image
This is one of the most important steps to achieving a 100 score on Google PageSpeed Insights.
Compress your bloody images, people!
The number of times I’ve landed on WordPress sites with a 2+ megabyte image that need to be loaded frightens me.
Some people use WordPress plugins to compress images. Not me.
I keep the number of plugins installed on my WordPress sites to an absolute minimum.
Instead, I use the brilliant ImageOptim for MacOS.
It’s a free app that I literally just drag and drop images on. It’s really satisfying to see each file get compressed.
Unfortunately, Windows users are out of luck as ImageOptim is only for MacOS. However, if you know of a similar tool for Windows, please share it in the comments at the end of the post!
4. Avoid GIFs Like the Plague and use MP4 Instead
Some of you won’t like me for saying this, but it’s true. GIF is a horrendously unoptimized file format that increased your page’s load time substantially.
Whenever I need to demonstrate how I do something on my laptop, I use the wonderful, free, screencapture tool, Kap.
After recording your screen, Kap gives you a number of file types to export your recording as:
I use MP4 for all of my screen captures on my WordPress sites. The screen recording below is an MP4 that’s 320KB.
That’s not small. In fact, that’s quite large.
However, had it been a GIF, it would be 18MB.
And the quality of GIF is worse than the MP4!
To make my MP4 videos act like GIFs, I turn on autoplay and loop, mute them, and disable playback controls. The best part is, you can do all of this in the standard WordPress editor.
5. Lazy Load Your Images with Autoptimize
This one gave me one of the biggest boosts to my PageSpeed Insights score.
For those who don’t know, lazy loading is the process by which images, videos, text, or any other type of media, loads as the user scrolls to its location on the webpage.
Therefore, your page load times are significantly improved because the whole page isn’t loaded the first time a user lands on it.
Autoptimize has a second tab that you may have missed. I missed it initially.
Go to the Autoptimize plugin settings in WordPress, click on the second tab from the left, labelled “Images”, and you’ll see the settings to lazy load your site’s images.
Autoptimize will push you to check the first checkbox: “Optimize Images”. Don’t do that. It costs money after a certain period of time.
Instead, check the second checkbox: “Lazy-load images?”, like so:
You will not want to lazy load all of your images. For example, your site’s logo.
Only lazy load images that are in the body of your articles.
If you don’t add your logo to the lazy-load exclusions, every time your page loads, your top logo will flicker in to place. It’s not a good user experience.
Underneath the checkbox is an exclusions text input. Put the path to the images you do not want to lazy load there.
6. Forget Google Fonts
Now, I’m being a slight hypocrite here. If you haven’t already noticed, I’m using Google Fonts on MoneyMonster 🤫
Why? Well, I wanted to test how much of a performance hit I’d take using the exact same theme but with Google Fonts installed on one of my sites and not the other.
And let me tell you. It makes a big difference to the PageSpeed Insights score.
I’m not using Google Fonts on the WordPress site that has a 100 score on PageSpeed Insights.
How much do your readers really care about the fancy fonts? At the end of the day, they’re only interested in the content.