Website loading speed has always been one of the significant factors for overall user experience and now that Google has also made it clear to favor faster-loading sites, it is time to work on the matter and boost our site speed.
Another harsh truth is that people are getting impatient. If your web page is not loading in 2 seconds then almost 75% of visitors will leave your site and never look back.
That affects your website ranking and overall experience of readers. Also, your bounce rate increases which are not good for SEO rankings.
Google PageSpeed insight is a tool by Google which analyzes your website loading speed and ranks your site on a scale of 1-100 (higher the better.)
The results given by Google PageSpeed Insight includes both Desktop and Mobile devices and the score is different for both.
Getting a 100/100 score is a milestone and while there are tons of factors that decide this score, I have listed some of the most important ones that will help you get a super high score in Google PageSpeed Insight test.
But before getting started here’s some motivation for you.
Below is the PageSpeed score for Google.com website.
As you can see, not even Google (developer of the tool) has got a perfect score.
However, their desktop website is nicely optimized with 92/100 score.
So now as you may have got some relief, let’s move on and take a look at important changes that can improve Google PageSpeed Insight scores.
Note that, there’s no fixed order of implementing these changes. Run the test for your site and do proper changes accordingly.
1. Eliminate Render-Blocking Resources Above The Fold
Eliminating Render-blocking resources is the most difficult part of your site as you need some technical knowledge to solve this error.
Here we have to move all the Javascript code from header and body of the site to the footer (at the bottom) of the website.
You can use WordPress plugin AutoOptimize to handle this technical part for you.
After installing the plugin, go to its settings and uncheck “Force JavaScript in <head>” and check “Inline all CSS” option.
2. Optimize Images
The next step in improving our Google PageSpeed Insight is to optimize images on our site.
Images take a long time to load and if you’re like me who loves to add only high-quality images to the site, then loading time of your still will also be high.
To avoid this situation, we should either optimize images to be added before uploading or while uploading to the site.
There are many free image optimization tools available on the Internet for both Windows and Mac OS, which reduces the size of websites without degrading the quality.
If you want WordPress to automatically optimize your images then install WP Smush.it plugin which will automatically reduce the size of pictures when you upload them to WordPress.
A good practice is to keep the size of images lower than 200KB and in JPEG/JPG format.
3. Minify CSS, JavaScript, and HTML
Minifying HTML, CSS, and JavaScript files can be a tricky thing to do on a dynamic website. But, if you have a simple website just like me then it’s not going to take us a while to get it done.
Minifying your code removes:
- White space characters
- Developer/Programmer’s Comments
- New line characters
- Block delimiters
You can either install and let WP Super Minify plugin or you can follow this tutorial to do it manually.
**Installing too many plugins may cause server issues and lower the performance of it.
4. Leverage Browser Caching
Browser caching is an amazing method to store the static files of your site and deliver them using the cache technology.
However, it is one of the challenging parts as well. To make it a little simpler, I would suggest you use Content Delivery Network (CDN) on your website.
A CDN, as the name suggests, is a network of servers located at various locations around the world. These networks cache the static version of your web page such as CSS, Javascript, Images, etc. And when a visitor lands on your site, these files are delivered from the nearest server location.
It affects the loading time of your site as well as improves server’s performance.
MaxCDN is a popular and recommended CDN which I’ve used and trust. Alternatively, you can use CloudFlare Free CDN service which is also satisfactory – if not best.
5. Enable GZip Compression
Being a desktop user you must be familiar with compression technology where we compress multiple files into one to save space.
Similarly, we use GZip compression which allows your web server to provide smaller file sizes which load faster for your website readers.
Over the time, enabling GZip compression has become a standard practice, and if you aren’t planning to left behind your competitors then it is recommended for you to enable it on your server.
Refer to this step by step guide to enable GZip for improving website speed. There are various ways mentioned for different servers, choose and follow the appropriate one.
6. Reduce Server Response Time
This one goes hand in hand with above-mentioned change.
The only reason why people face slower server response time is because of shared web hosting where multiple requests from different websites stored on the same servers are happening at once.
Google knows our server is not fast and it wants us to either upgrade to a dedicated web hosting (which is costly) or improve the current performance.
For the later, I would suggest you use Cache Enabler plugin from the team of popular KeyCDN.
It is a lightweight plugin which also is a plug and play. Meaning, you don’t have to do any changes or make settings, just install and activate the plugin and you’re good to go.
The performance after using the plugin won’t be a match to a dedicated server but it is enough to remove that error from Google Pagespeed Insight test and improve our score. That’s what more important for us as of now.
7. Enable Lazy Load Images
Again, I would like to use the same sentence I used earlier in point #2. Images take a long time to load and which in turn increases the loading time.
If you’ve 15 images on a single page, each of 100KB (let’s assume) then the server has to load 1.5MB of data at once which will take forever (not really) – but few seconds.
Lazy load is a simple solution to this complex problem where instead of loading all the images at once, we’ll load images one by one as the reader scrolls and they appears on the screen.
It improves the user experience as well as loading time by dividing the server request to load an image.
Install lazy load plugin to add this feature on your site. At the time of writing this post, the plugin has 80,000+ active users with 4.2-star ratings.
If you’re using a theme from MyThemeShop, then there’s an inbuilt functionality to enable Lazy Load on your site under Theme Options.
8. Don’t Overlook Mobile Experience
And lastly, to further improve the Google Pagespeed Insight mobile score, we need to optimize our site for mobile users.
It can be done in several ways, such as using a responsive theme/framework, removing pop-ups and interstitial ads, and enabling AMP.
Premium themes such as Genesis, MyThemeShop, StudioPress are already mobile responsive.
Accelerated Mobile Pages technology is oriented to the mobile users and it strives hard to serve web pages instantly.
Whether you have observed or not, but AMP pages are getting ranked higher and it may become full-fledged SEO ranking factor in 2017.
I’ll soon write a step by step tutorial on enabling AMP on WordPress website.
Signing Off
Depending on the structure of your site and optimization performed by you, there could be more changes you may have to consider for scoring 100/100 score in Google Pagespeed Insight test.
While getting this score may not boost your rankings overnight, it will help you outrank your competitors with less optimized sites.
If you think some instructions aren’t clear and I should add more suitable links or write in detail steps then do leave your thoughts below.
Run a quick test of your web URL and comment down what are your scores. Let’s see who has got the highest score.
Socialize this article and help your blogger friends achieve high scores in Google PageSpeed Insight.