Did you know from July (2018) Google will use page speed in mobile search ranking?
What if you can’t afford it?
Like many beginner bloggers, I started this blog on a shared hosting plan (provided by SiteGround).
But because you’re sharing the same server with other websites, shared hosting will always be slower.
So how can you improve your page speed with the odds stacked against you?
You’d think it impossible, but it’s not. You just have to follow a few simple steps.
In this post I’ll walk you through the exact process I used to speed up my WordPress site on a shared hosting by SiteGround.
How I was able to achieve a 92/100 score on Google PageSpeed Insights and 3 second mobile page speed on shared hosting
By working through the steps described below. I have been able to achieve a ‘Good’ 87/100 (mobile) and 92/100 (desktop) on Google PageSpeed Insights.
A 3 second mobile page speed on testmysite.withgoogle.com:
91% Grade A on GTmetrics:
And Grade B (82%) on Pingdom:
How have I been able to to that without using fancy managed WordPress hosting?
Why WordPress Speed Optimization is important
In this 2016 study, Backlinko analysed over 1 million search engine results pages. To find out what ranking factors were common amongst first page search engine rankings.
To do that they looked at content, backlinks and site speed.
And they found a strong corelation between page speed and high Google rankings.
Note, the average page speed was less than three seconds across first page rankings.
It gets worse:
And in addition to this, Google’s new page speed industry benchmarks found that as page speed increased, the probability of a user bouncing increases.
Also, as the volume of content on a page increases, conversion drops 95.6%.
So no matter what, faster is better and less is more.
And sometimes smaller is better too. In the same report Google found that 70% of pages were over 1MB.
For mobile, speed and size matter.
And best practice is under 3 seconds.
Research also shows that pages on the first page of a Google search engine results page receive 95% of clicks.
So if you want to rank on the first page of Google, your page needs to load in under 3 seconds.
Does page speed impact conversions and sales?
So faster website improve ranking and keep your visitors happy. But does page speed impact conversions and sales?
This Hubspot article and infographic by Skilled shows 12 case studies highlighting the benefits of optimising page load time.
And found that page load time dramatically impacts SEO, user experience and sales.
- A 1 second delay in page load time means 11% loss of page views.
- A 1 second delay means a 7% reduction in conversions.
- An e-commerce site making $100,000/day can make an additional $7,000/day by improvement speed by 1 second.
- 64% of smartphone users expect a page to load in less than 4 seconds.
So by reducing your website page load time, you can have a positive impact on your entire marketing funnel.
Why cloud hosting out performs shared hosting
With shared hosting plans like those provided by SiteGround, Bluehost and Inmotion, several websites, share the same server and resources (disk space, storage, bandwidth).
If one of more of the other websites receives a lot of traffic, it can impact your websites performance.
Cloud hosting runs on virtual servers which use resources from an extensive network of servers.
If something breaks or you sees a sudden increase in traffic, it won’t impact performance, because of the higher availability of resources and extra servers.
However you do pay for it.
With Managed hosting plans starting at around $29/mo.
And shared hosting around $2.75/mo. That’s a BIG difference.
How to benchmark your website
Before you optimise your website speed, you need to understand how your site is performing and what is causing slow load time.
Google PageSpeed Insight scores websites out of a 100, 80/100 being a ‘Good’ score.
testmysite.withgoogle.com tells you how fast your website loads in seconds on a standard 3G connection. It also shows you visitor loss due to slow load time.
Since my site is on a shared hosting, I don’t expect to get a perfect 100 score, but I want to achieve ‘Good’ on both mobile and desktop and a speed of 3 seconds or less.
Here’s my report on Google PageSpeed insights:
Which shows me the following optimisation suggestions:
- Optimise images
- Leverage browser caching
Now let’s look at my mobile speed.
Head to testmysite.withgoogle.com and enter your URL. It might take a minute.
Tests on standard 3G connect 70% of mobile network connections occur on 3G.
My mobile load time is 4 seconds. 1 second slower than best practice.
Which is causing me an estimated 10% loss in visitors?
Here’s what my site looks like compared to my industry standards
Whilst still in the top performers, it’s not where I’d like it to be.
But it suggests with a few fixes, I could get to my benchmark of 3 seconds or less.
So let’s walk through the steps…
1. Optimise images – for speed and size
Images are one of the biggest culprits impacting page speed. Large images can dramatically increase the size of web pages and impact speed.
Remember, we want to improve speed and reduce size.
They are also one the optimisation suggestions from my PageSpeed Insights report.
Image quality is important, but it comes at a price.
An 8MB iPhone 6 takes photos 3264×2448 pixels, just one image that size uploaded and adding to a webpage is enough for you to suffer page speed problems.
The first place to start image optimising images is by cropping your images to the size you need and no larger (unless you want to optimise images for retina displays).
You need to know size of the content area for example the width of your blog post.
In a Chrome browser right click and select ‘inspect element’ in any blog post.
In the new window that opens at the bottom of your screen, move your cursor around the code until you see the content area highlighted.
You’ll notice a black call out, the first number is the width. Make a note of it.
In this example the width of my blog is 753 pixels wide. So no need to make my images any bigger than that!
Choose the correct format. PNG, JPG and GIF are the most common image formats used on the web If you want to understand image optimisation check out this excellent guide by WPMUDEV.
In summary, use PNG for ‘flat’ 2D graphics such as logo’s and charts,. JPG for images with lots of colours such as photos and GIF’s for animated GIF’s. Convert nonanimated GIF’s to PNG.
To demonstrate how much you can reduce the size of images, I will use an example I have downloaded from Pexels.
The original size of this image is 4147×2765 pixels 8.2MB in size. HUGE!
By cropping the image down to 1600×1000 pixels and 750 pixels wide I am able to reduce their size to 550KB and 133KB, respectively.
Note: 1600×1000 pixels is a typical size for a ‘hero’ image you might find on a homepage or blog header.
Once cropped you need to compress them, there are many free online tools you can use. In this case I will use TinyPNG.
Which compresses both by a further 40% to a respectable 323.3KB and 79.1KB.
If you want to reduce file size further, you can use Photoshop. By using Photoshop I can get the images as low as 172KB and 42KB. But check quality if you go that extreme.
You can also use a plugin to help automate the process for you.
By using these plugins you’ll be able to achieve a similar result to what you’d get using TinyPNG.Tweet This WordPress Optimization TipClick To Tweet
2. Leverage browser caching
Next on my list of improvements is to ‘leverage browser caching’ What is caching?
Let me explain:
When someone visits a page on your site, they request information (HTML, PHP files, scripts, image fonts etc) from your web host.
The web host then assembles this information into a web page and serves it to your visitor.
All of this can take several seconds.
A caching plugins works by creating a static version of your web page/s.
When a visitor first views a page on your site, your server does the hard work to pull the information needed from your server. Takes a snapshot of your page so the next time a visitor goes to the same page, your server can provide the page much faster.
Caching plugins allow your web pages to be served with super-fast response time, without having to do all the heavy processing, every time the page loads.
I am using WP Rocket because of the additional features offered. However, it is a paid plugin $39 compared to the other two which are both free.
Install the plugin, activate it and work your way through the settings.
If your budget won’t stretch, I’d recommend the WP Super Cache plugin.
If you’re not using either WP Rocket or WP Super Cache, you can still leverage browser caching by adding a few lines to your .htaccess file.
Login to cpanel. Scroll down to the ‘files’ section. And find your .htaccess file, select it, download it and when it’s downloaded, open it in a text editor (I use sublime text) ad the lines below, save the file and upload it using file manager.
To Minify files in WP Rocket use the settings shown below. Remember to check everything works as intended after making your changes.
Minifying your HTML files
You might be wondering:
“What is minifying, exactly?”
Minifying is a term that means removing any unnecessary space that is not required for the code to work. And minifying your code speeds up your page load time.
And one of the best tools to help minify your HTML files is HTML Minify.
You can install the plugin from it’s plugin page here.
Once you’ve installed and activated the plugin, go to, ‘Settings’, ‘Minify HTML’ and select the following options.
Tweet This WordPress Speed Optimisation TipClick To Tweet
4. Eliminate render-blocking
Render means load.
So if something is ‘render blocking’ it means it is preventing the page from loading fast.
Once enabled those files should load more efficiently.
If you’re not using WP Rocket, you can fix render-blocking issues with the Autoptimise plugin.
Install the plugin and once activated, go to ‘Settings’ ‘Autoptimize’.
Depending upon the speed of your website after enabling those settings you can adjust settings further by going to the ‘Show Advanced Settings’ button and enabling these settings.
Click ‘Save changes and Empty Cache’
It’s time to go back to the Google PageSpeed Insights website and testmyite.withgoogle to check your result.Tweet This WordPress Speed Optimization TipClick To Tweet
Results after optimisation
As you can see it is possible to achieve a ‘Good’ score on both mobile and desktop and a mobile page speed of 3 seconds without expensive hosting.Tweet This WordPress Speed Optimization TipClick To Tweet
Is it possible to achieve a perfect 100% score?
Without switching to managed hosting.
Possibly! by using Google’s Accelerated Mobile Pages (AMP).
Let me explain:
AMP is a project by Google to help mobile pages load faster.
It works by stripping away unnecessary content on your page to make them load almost instantly.
AMP pages are recognisable in a search results by the AMP icon seen below.
If you’re comfortable with HTML you can follow AMP guidelines to build your AMP pages.
If you’re using AMP forWordPress and you use the Yoast plugin (for SEO) you’ll want to install and activate the Yoast Glue plugin.
A word of caution:
If you’re considering moving to AMP it’s worth reading this article by MOZ. Because creating AMP pages will not always improve performance.
I am setting up my blog posts for AMP so I can get a perfect ‘100’ score on my mobile pages, but I’ve hit a few problems, that mean right now my AMP pages are not showing.
I’ve also found that some of my content doesn’t render well with the plugin I’ve chosen, so I may switch or abandon AMP altogether if I can’t get those issues working.
Either way, I will update this post.
As you’ve seen improving page speed can give your website, the improvement it needs to succeed.
And with their latest mobile speed announcement Google is making it clear speed is important.
These are the strategies that have made a big difference on my site.
Whether you’ve got the budget to stretch to managed WordPress hosting provider, speed is still important.
But I hope this post shows you can still achieve the benchmarks Google sets on a shared hosting plan.
What are the best ways you’ve found to speed up your WordPress site? Let me know in the comments.