Google has a tool called “PageSpeed Insights” that gives recommendations about how you can improve your site speed. It gives you a score between 0-100 on mobile and on desktop. The benchmark is between 50 – 70. By focusing on some elements we managed to increase our score from 54 on mobile (57 on desktop) on to 91 (92 on desktop).
Through this article, we will share how we improved our WordPress website speed. Nevertheless, do no focus too much on scoring 100 because at a certain point it could be at the expense of the user experience on your website.
PageSpeed Insight Criteria
When you build your WordPress website, the site speed should be one of your priorities. If from the start you focus on that aspect, it will allow saving time for other aspects of your website. Because in any case, you will have no choice if you want to improve the ranking of your website. Google takes into account the site speed as a parameter to rank websites. Based on studies users might leave the website if it does not load within 4 seconds. In this article, we will explain how you can improve your WordPress website speed by following the recommendations of the Google PageSpeed Insight.
Thus, Google wants to push website owners to improve the user experience by improving speed. There is nothing more annoying than when you want to visit a website but it takes too much time to load. Since the web offers a lot of alternatives, you might lose potential users. Which means that they will never get the chance to read your awesome content.
In order to improve the page speed, Google focused on 10 elements:
- Avoid landing page redirects
- Enable compression
- Improve server response time
- Leverage browser caching
- Minify resources
- Optimize images
- Optimize CSS delivery
- Prioritize visible content
- Use asynchronous scripts
We did not focus on all, we focused on the most important ones. We had to find a balance between scoring high and the user experience of our website. Nevertheless, we managed to score 91 which is way above the benchmark. Which plugin should you use for each element?
1. Optimise your images
The first aspect of the speed of a website is the optimisation of images. Otherwise, it will hurt your page performance. Even though there are a lot of image optimisers plugins, we recommend Wp Smush. It will automatically optimise the images you upload. The only thing you have to do is to activate the feature in the settings of the plugin. There are other image optimisers such as ShortPixel Image optimiser. Nevertheless based on our criteria to select the plugin to activate, “Smush image compression and Optimisation” is the best fit.
You have also the ability to optimize all the image you have on your computer before uploading them on the website. In our case, we use “Imageoptim” which is a free small software that you download on your computer. The advantage of this software is that the optimization does not impact the quality of the image
2. Social media sharing plugins
If you read most of the documentation, it states that by implementing social share plugins it improves your ranking. Because if users share your content Google will consider that you have pertinent content and thus, might rank you higher. However, some of the plugins might actually negatively impact the performance of your website. Thus, when you want to implement a social media sharing plugin, have a look at their features to see if there are SEO friendly.
- WordPress Social Share, Social Login and Social Comments Plugin – Super Socializer
- Social Media Share Buttons & Social Sharing Icons (Ultimate Sharing)
This is also the case when it comes to Facebook page feed in the widgets. A lot of blogs share in their widgets (sidebar) their social media such as Facebook page posts or Twitter. The implementation of those channels through plugins hurts the site speed. There is a workaround to that by implementing them manually in a few clicks.
3. WordPress Caching plugins
For some of you who might not be familiar with computers, you might wonder what is a cache?
Thus, to speed the process up part of your website is temporarily on the user browser. Especially for your website’s static content, such as published posts that rarely change over long periods of time.
The purpose of caching your website reside in five factors. First, deploy website data that rarely change in a readable format infraction of times. Secondly, speed up the entire site loading process. Thirdly, provide a better user experience to all site visitors. Fourthly, Rank higher in search engine results thanks to the faster load times. Fifthly, reserve server resources and reduce crashing, especially on shared hosting plans.
We recommend you to use the WP Super Cache based on the criteria we mentioned in our article on how to select a plugin.
How to do it on WordPress?
The only thing you have to do is download the Autoptimise plugin and activate the following elements.
5. Leverage Browser Caching in your WordPress website
When you use the PageSpeed insight and you get this recommendation, you use this plugin in order to solve the issue.
What the plugin does:
“As it’s name, it will fix Leverage Browser Caching issues in your WordPress website. Also, it improves page speed score in website testing tools like: Pingdom, GTmetrix, PageSpeed, Google PageSpeed Insights, and YSlow.
About Leverage Browser Caching
Leverage Browser Caching means storing static files of a website in visitor browser. And then retrieving them from browser quickly instead again from the server. Actually it uses to speed up each page of a website.
How Leverage Browser Caching Works?
When you visit a web page, your browser downloads all content of the particular page as well as common static files like css and js files. And when you visit other page of same website, your browser downloads them again. But if you have enabled Leverage Browser Caching, then all statics files will serve from your browser instead server. Now when you will visit any page of the particular website, it will only download unique contains of the page and static files will serve from your browser. in this way, it speed up each page of a website.
Benefits of Leverage Browser Caching
Primary benefit is speeding up website because static files will serve from your browser. it saves internet data of website visitor. it also saves bandwidth of website server and decrease load of server. Simply it decrease HTTP requests.”
6 & 7 Cloudflare & CDN
Cloudflare which is a content delivery network (CDN), helps to improve the speed of your website. The CDN is a system of distributed servers (network) that deliver pages and other web content to a user, based on the geographic locations of the user. However, it would be too heavy to explain everything in this article. Thus, we will cover the topic in another article. The only thing you have to retain for the moment is that it improves the site speed and the security of the website. Cloudflare is not the only CDN available on the market. It advantage resides in the fact that it is free.
In order to speed up your website, you are able to minify the source code of your website. Which is one of the criteria of the GoogleSpeed Insights.
Recap table: plugins to optimize the speed of the website.
WordPress plugins that you could use
Smush image compression and Optimization
3. Optimize CSS delivery
4. Prioritize visible content
5.Leverage browser caching
Leverage Browser Caching plugin
WP Super Cache
Social media sharing plugins
6. Enable compression
WP Super Cache (advanced settings)
7. Minify resources
It is important to keep in mind that the PageSpeed Insight test gives your recommendations regarding how you can improve the speed of the website. Nevertheless, it is not mandatory to score 100.