How to Speed up your WordPress Site – The Ultimate Guide

how-to-speed-up-your-wordpress-website,-flothemes
Ever went to a website and it loaded slow, so you just left? Happens quite often. We are in the era of instant gratification, that’s why social media channels perform so well at getting users’ attention. Slower loading sites convert less, have higher bounce rates, perform poorly for user experience and rank lower for SEO.

A survey from Google concluded that users want to see your site load in less than 3-4 seconds, if it doesn’t, it’s likely they are going to go somewhere else. Kissmetrics backs this up with data suggesting that 40% of users will leave your site if it doesn’t load in less than 3 seconds. These numbers are even more true for mobile users. If you don’t have a mobile responsive site that loads fast, it’s time to update your website, or accept the consequences. Balancing site speed and great user experience has always been troublesome for photographers, due to a heavy load of images that they obviously want to upload in high resolution (so it looks perfect on a 4k screen). Hence, in the this article we’ll describe 10 steps which you can take to help improve your overall site speed and performance.

Sections

  1. How to test for site speed
  2. Using Optimization Plugins
  3. Choosing the Right Hosting
  4. Using Content Delivery Networks
  5. Correct Image Optimization
  6. Optimization Case Studies

Want professional help to speed up your site? Check out our Speed Optimization service. We’ll improve your overall site speed, your site’s performance metrics, and make sure it’s all optimized for the web.

SEO Services

 

1. How to test for site speed

Before we discuss how you can improve your site speed, first you need to understand how to test your site speed. There are a number of tools available and in this article we will focus on 2 of them. Using Google Page Speed insights for testing site speed will not test your site speed unless you have a high ranking domain name, so for most users it will not actually show your site speed. It does give good details for some optimization options, however these are only suggestions and you won’t actually know if you’re getting a faster loading site after updating them.

The 2 tools we recommend using to test your actual site speed are GTMetrix or Pingdom. In this tutorial we’ll explain how to use GTMetrix, but the principles remain the same for both tools, as they both highlight the same items you’d need to resolve. If you use GTMetrix, make sure to sign up for a free account. It will allow you to choose your server location, which is important for testing your site. You should be choosing a server closest to your clients’ location. For example, if you are a photographer based in the UK, then choosing a server from London will give you the best results as it’s most likely that your clients are also based in the UK. Testing from a server in the US will give you incorrect results.

GTMetrix lets you test site from the following locations (with a free account):

  • Vancouver, Canada
  • Dallas, USA
  • Hong Kong, China
  • London, UK
  • Mumbai, India
  • Sydney, Australia
  • São Paolo, Brazil

Pingdom lets you test from the following locations:

  • Stockholm, Sweden
  • Melbourne, Australia
  • California, USA
  • New York, USA

So based on your location, you’ll want to choose a tool that will let you test closest to your clients. Also remember that your hosting company will also make a difference to your scores here. If you choose hosting that’s not in your country, or your client’s locale, your site is going to perform poorly for them. We’ll cover more details on choosing hosting for WordPress later.

A note on Google Page Speed Insights: Google PageSpeed Insights tests around 30 rules that account for page speed, however it does not calculate specific loading times like GT Metrix. There are 3 grades for rules, should fix, consider fixing, and passed. Following the steps in the next section we aim to fix most items in this test as these are the most critical to improving your site speed and score.

SEO for photographers v2

Get your free SEO guide today!

​​This ​ultimate SEO guide (67 pages of gold content) ​​will help you increase your organic ranking and traffic. Sign up now!

GTMetrix

A much better way of actually testing your page speed is using a resource such as GT Metrix or Pingdom. GT Metrix will be used for testing the responsiveness and loading time of your site and then provide a performance grade based on the results. It will allow you to record the load time improvements from before and after completing the recommendations in this article.

We recommend that you test your site now and record the results, then after reading the following article you will be able to check for some improvements. NOTE! Make sure to select the server that is closest to your location.

How to speed up your wordpress site, gtmetrix

You may also want to check your hosting’s location to see if it actually matches your own location. If you need to find out where your server is hosted, contact your hosting provider or check for yourself by using WHO.IS. Enter your domain name, and in the 4th tab called DNS records, there will be a location (not all hosts will show this):

How to speed up your wordpress site, gtmetrix 1

If your servers are not close to your (and your client’s location) it’s time to start looking for a new hosting company. Check out our guide to WordPress hosting.

GTMetrix tools page

Now you’ll want to go to GTMetrix, and sign up for a free account. Then you can start to analyze your site. You’ll see the following dashboard (see image below), you can choose a browser by clicking the name of the browser, the location by clicking on location and can update any other settings. You can also do this by clicking on the “analysis options” on the right side.

In the dashboard you can also see a record of sites that you have tested as well as options for monitoring your site over a period of time.

how to speed up your wordpress site, gtmetrix

To get an accurate reading of your page loading time you should run the test several times, making sure to select the server that is closest to your hosting server. To do this, first set up an account with GT Metrix, then before running a test, select the server region (as in the image below):

How to speed up your wordpress site, gtmetrix 3

When testing your site for speed, make sure to test it a few times to make sure you’re testing the cached version of the site. It’s also important to test various inside pages, such as blog posts or galleries. If you are using a caching plugin, clear your cache after each site change, and test again.

GT Metrix will summarize a 5 number of metrics for page loading time.

  • PageSpeed score – Google Page Speed Insights Score
  • YSlow Score – YSlow Optimization Score
  • Requests – number of HTTPS requests needed to load the site
  • Load time – Fully loaded time of the page
  • Page size – Size of the page in MB and KB

How to speed up your wordpress site, gtmetrix 4

The most important factor you will want to take into consideration here is load time. Whilst it’s nice to have a good performance grades for PageSpeed and YSlow, Google will ONLY be concerned about the loading time of your site, so will your potential clients.

Benchmarking
Record your Google PageSpeed Insights and GT Metrix scores, then you can begin the next test to review the improvements. Each time a plugin is added you should review its effectiveness and test the score for both Google PageSpeed Insights and GT Metrix. If you have caching enabled, make sure to clear the cache, test once, then test again for the most accurate results.

With Google PageSpeed Insights you will have to wait 30 seconds between each test due to a cache being on your site from Google.

Next we will look at how you can use the different results tabs to make decisions on optimizing your site.

Results Tabs

You’ll see just below the loading results there are several tabs with different information about your site. You’ll see the following tabs:

1. Page Speed

This tab will give you results from the Google Page Speed Insights test, testing close to 30 metrics and offering recommendations on things you can improve. The most common issues will be combining JavaScript and CSS files, optimizing images, and caching. You can hit the arrow beside the grade to find out more about the specifics of each section, and learn more about ways you can resolve the issues.

How to speed up your wordpress site, gtmetrix , page speed

2. YSlow

This tab will give you results from the YSlow test, testing around 20 metrics and offering recommendations on things you can improve. The most common issues will be the number of HTTP requests on your site, using a Content Delivery Network (CDN), minifying JS and CSS and header expiries for specific resources, that is the lifetime of the cache for those resources.

How to speed up your wordpress site, gtmetrix , yslow

Learn more about Page Speed and YSlow scores from GTMetrix.

Note: Don’t just go chasing the YSlow and Page Speed Scores, sometimes there will be items that can’t be done without a custom site. Think practically and aim to improve the most important metric – loading time.

3. Waterfall

The waterfall tab gives an overview of all the loaded resources and the time it took to load each. It gives you a good chance to see which resources may be causing a bottle neck or slowing down the loading of the site. You’ll notice large images load particularly slow here.

How to speed up your wordpress site, gtmetrix , waterfall

4. Timings

To find out how long it takes for the visitor to actually see a loaded page, run a test, then go to timings. Look at the Onload time, this is the time the resources are downloaded and the page is painted for users to view. The Fully Loaded Time is the time that any extra Javascript files are executed after the page loads. You can learn more about the different loading times by hovering over the box for each.

How to speed up your wordpress site, gtmetrix , timings

5. Videos

The video tab is optional. When you go to this tab you can enable video recordings of your site load, and then preview the load to see if you can catch any resources that are slowing down the page loading time.

6. History

You can view a full list of test results for your site over a period of time, including loading times, the PageSpeed and YSlow scores, and the Page Size and Number of requests. This is a good way to see if your site is improving or getting worse over time.

How to speed up your wordpress site, gtmetrix , history

Now that you know what resources to use for testing your site, and how to debug issues, we can discuss how you can optimize your site including details on the best WordPress optimization plugins, how to choose hosting and how to optimize your images.

Backup your site

Before we get started, it’s critical that you backup your WordPress installation prior to optimization (we actually recommend backing up on a regular basis, trust us it will save you some hassle longer term). Try a plugin such as UpdraftPlus to backup your entire WordPress site, including your database, plugins, themes, uploads, and more.

2. WordPress Plugins

In this section we’ll review 3 plugins that can assist your site’s loading time. They will help with GZIP compression, browser caching and the optimization of your Javascript and CSS.

WP Performance Score Booster

With WP Performance Score Booster you will be able to improve various rules for your site, including:

  • GZIP compression
  • Leverage browser caching (only partially, a caching plugin is still required)
  • Remove query strings from static resources like CSS & JS files.

Simply download the plugin from the WordPress repository and install it, nothing else is required. You can then test your site again in both GT Metrix and Google PageSpeed Insights. Get WP Performance Score Booster Here.

Better WordPress Minify

This is very similar to the above, however there are only a few plug-ins that will help reduce the size of your JavaScript and CSS files, and/or combine files together to reduce the number of requests made to your server when loading a page, thus decreasing loading time. The standard plugin settings should be enough for your installation, so you can simply install the plugin and activate it. Get Better WordPress Minify Here.

WP Super Cache

This will be one of the main things that is recommended via Google and one of the easiest to implement to improve speed. Installing a plugin such as WP Super Cache is a great way to improve loading time, however it is recommended that you follow a tutorial on how to set this up correctly, as a wrongly configured caching plug-in can cause more issues than good. Another note on caching, when you are testing the site for its speed, it’s best to clear the cache, refresh your page wait 30 seconds and then retest to check for improvements.

For other notable caching plugin options, also take a look at WP Fastest Cache or for a paid plugin check out WP Rocket, as it’s the best in the market.

NOTE: If your hosting is using caching options, make sure to review their documentation to see if caching plugins are allowed. Providers such as WP Engine do not allow the use of caching plugins as they cache the site from the source. Get WP Super Cache here.

Other Optimization Options

The following options may not show improved loading times for your site, but they certainly help maintain an optimized site by keeping the database clean and the load on your site lower.

WP Optimize

WordPress is a great CMS platform, however it can create heavy and slow databases due to the saving post revisions, keeping spam comments, trackbacks, etc. WP Optimize helps clear these items for you. Do read all the instructions before using this, and please make a back up of your database before installing and activating this plug-in for the first time, or before major updates.

You can also check out this list of back up plugin recommendations.

To use WP Optimize, download and install the plugin for it to show up in your WP Admin. Click on it to access the plugin admin area. You will have 4 options selected initially. For your purposes this will be fine. You don’t need to select the options in red without reading more about them. Also remember back up your database before proceeding with the process. Once you have created your backup simply select Process on the right hand side and wait for the plugin to do its magic.

Deactivate & Remove Unnecessary Plugins

Using large numbers of plug-ins can affect how your site loads. Each plug-in loads its own JavaScript, some also use PHP, which means your site has to load more resources at the start, which slows down its response time. So if you have a lot of plug-ins installed, review them, and remove those that are no longer useful.
NOTE: Keep plug-ins up to date at all time, failing to do so may make your website vulnerable to cyber attacks.

Remember to test your sites performance after adding any plugins and see if you’re making the right adjustments to the site. If you’ve been following and implementing the recommendations we’ve described so far, your site should already be running considerably faster at this point.

3. Hosting

Choosing a hosting provider should be one of your top priority business decisions. Before you go for a cheaper, random provider, consider this – your hosting choice will impact the way your website works, how fast it loads, as well as how secure and backed up it is against hacks and server crashes. You get the point.

Since there are so many options available out there, here’s a number of things and features you should take into consideration when choosing the right hosting provider. You can also, check out the list of hosting providers we recommend to our Flothemes clients. If you’re wondering how much space you will need – Siteground for examples offers the Grow Big package, with 20 GB of web space available, which is more than enough to begin with.

Back to the features that help you choose correctly:

Speed

Speed is important for your website. Look at the various options that your hosting provider offers, this can be anything from shared hosting (which has a limited bandwidth and disk space) to dedicated server hosting (which is very fast and hosts only your site). Also pay attention if the provider you’re choosing supports WordPress. If you use or plan to use Flothemes for your site, you need it.

Server Location

Find out where your hosting provider is located, and whether they have servers that are close to your audience. This is important when looking to provide a quick loading site for your viewers. The closer the servers are to your audience the better your site loading time will be. If we go back to Siteground’s example, they have strong servers located on 3 continents (America, Asia and Europe) and offer free CDN (over 100 additional server locations) therefore, there’s always a data center located somewhere close to you.

Price

What is your price range? Some honest advice – spend the most that your budget allows! If you can afford that fancy new iPhone you can afford good hosting for your BUSINESS. Better hosting will improve your site’s speed and increase customer satisfaction, which hopefully in turn can help with conversions for your business. And as mentioned earlier, don’t forget about bounce rates, if your site is slow – your users will leave before even seeing your great content.
The best value providers are Siteground, Flywheel and WP Engine. We’ve tried and tested them with hundreds of websites and can firmly state that they provide great value for the money you pay.

The last two are specifically WordPress hosting providers, offering built in caching, and optimized loading time for WordPress sites. Whilst they are more expensive, especially for multi sites, if you have large amounts of traffic, require fast speed and have the budget, it’s an investment worth making.

Customer Support

Always check what people have been saying about your hosting provider. Do they have good reviews? What is their up time (the time that websites are likely to be live)? and do they respond to their customers promptly?
The providers we’ve recommended above we also chose due to their support teams. Each one of them is offering good support with prompt responses. Again, check their locations to make sure that they work well with your time zone and whether support is included with your plan.

Site Traffic

Do you have huge amounts of traffic coming in or are you only starting out? This should be taken into consideration when choosing your hosting provider. If you’re a new business, you’re likely to have lower traffic – so a shared hosting plan will work fine for you for the first 6 -12 months. If you have an established blog or site and can see a considerable amount of traffic coming in on a regular basis, a shared hosting plan isn’t going to work. We recommend using Google Analytics to carefully track your site’s progress and the number of monthly visitors. This will also be useful when you try to decide whether you should upgrade your hosting plan or switch to a different provider.

Conclusion

If you have a hosting provider and are considering a change, we recommend contacting one of the following providers. Check the options they offer, many provide free, or paid switching services so you can be assured that your content is going to be moved correctly. Others also offer free domains, 1-click WordPress installs, as well as great site backup options.
Honestly, choosing a great hosting service should always be viewed as a business investment rather than an expense, don’t just go for the first provider, and don’t consider cost as the main factor. With hosting, you really get value for your money. Your decision will influence your site performance, reflected in the experience your customers receive when they visit your site.

4. CDN’s

What is a CDN?
Content Delivery Networks (CDNs) will drastically reduce server lag by storing static resources on a network of fast loading servers. What does that mean? Basically it holds a cache of your static content (Images, CSS and JavaScript) in various server locations all over the world. When a user from the UK requests to view your site, they get served images from the closest server, which drastically decreases loading time. GTmetrix put this simple graphic together to make it easier to understand:

How to speed up your wordpress site, gtmetrix , CDN

How to speed up your wordpress site, gtmetrix , CDN 2

Recommended CDNs

CDNs are not for everyone, they should be seen as the final option for really optimizing your site. It depends on your budget and needs. If all the other options haven’t helped then a CDN will do the trick, especially if you’re serving a large base of international clients. The following 2 are viable and affordable solutions for photographers’ needs:

StackPath (formerly MaxCDN) – pricing starts at $10 a month for unlimited sites and up to 1TB bandwidth. Their solution is great for most small to medium website owners, and is easy to implement. StackPath is a popular and well-known CDN that powers the likes of The Next Web, Garmin, Kodak and WP Engine.

Cloudfare – Offering a free basic plan, Cloudfare is useful for testing out a CDN and improving speed. Paid packages start from $20 per site. Unlike many CDNs, CloudFlare doesn’t charge for bandwidth usage. On the basis that if your site suddenly gets popular or suffers an attack, you shouldn’t accumulate a huge bandwidth bill. According to CloudFlare, on average a website using the CDN will load twice as fast, use 60% less bandwidth, have 65% fewer requests, and is more secure. Used by Reddit, Zendesk and MIT.

5. Image Optimization

For photographers this is one of the most fundamental things you’ll need to do to improve overall site performance. Images add HTTP requests to your site, so the more images you use on the site, the more requests you’re going to have. This is where choosing quality over quantity really makes sense. You shouldn’t be adding 1200 images to a gallery, or blog post if it’s really not required. If you can’t tell a story in 30 images, you should review your storytelling method.

Of course, everyone has a different approach to storytelling. But keep in mind that users have a very low attention span while browsing online, hence, shorter posts and galleries can guarantee that a user will consume more high quality content without getting bored.

Image Sizing Recommendations

Slideshows – 2880px width x 1500px height (You’ll need to crop your images here)
Blog Posts – 1500px in width x height auto
Galleries – width auto x 1500px in height

See our full guide on image sizing here.

Remove unnecessary images

Do you really need all the images you’re displaying on your site? If not, it’s time to start removing them from your content. Remember, think about quality over quantity. If you can create a blog post and tell a story in 10 images instead of 100 images, then do so. Of course as a photographer, there is a lot of power in your images, however images can speak 1000 words. So it’s time to review your portfolio and cut away the fat. In doing so you’ll optimize your site, and create a better portfolio with your best images.

Common places users add too many images:

Full Screen Slideshows – We recommend between 1-5 images here, more is a waste. You want the users to get off your home slideshow and into some content. Use 1-5 images to create the WOW factor, otherwise these images are too large for optimal site performance.

Galleries – Adding 500 images to a gallery is boring. Who is really going to check all the images from someone else’s wedding, unless it’s family or friends. Show your best work, remove the rest. Normally a portfolio of 30 strong images will do the job.

Blog Posts – If you can you tell your story with less images. Do it. Shorter posts can mean more of your posts are consumed. Remember the average lifespan on your site is around 3-4 minutes. Provide shorter more quality posts will allow you to display your best images quicker.

Optimize Existing Images

Imagify
For those of you who have already uploaded hundreds, or even thousands of images to your site, all hope is not lost. There are several ways that you can optimize existing images on your site to improve performance.

The easiest method is to use a service such as Imagify then offer one time or monthly services to optimize your site images. If you’ve already uploaded your images to the web, I’d suggest using the One Time services to allow them to optimize your existing site images. You can also get their WordPress plugin and optimize your images on your site directly. Again you’ll most likely need an account, or need to buy credits to optimize a larger number of images on the site. View Imagify

WP Smush Pro
You can use another plugin option such as WP Smush Pro to reduce the images with not loss in quality right in your WordPress dashboard. This is great if you have an existing site or blog and feel that it’s running slowly.

Just install the plugin and bulk Smush all your images. Even better, the plugin includes the option to smush your images on upload, so going forward you’ll know that all your images are optimized for web.

There is a free version available, however the Pro version does a much better job and at $19 a month is a great option to consider.

Tiny PNG Plugin
You can also use the Tiny PNG WordPress plugin and API to optimize existing images. You’ll most likely need a paid account (if you have more than 500 images). Once you sign up for the API you can automatically optimize 500 images for free when uploading images to your site.

Via FTP
If you’re more technically minded, you can do this yourself via FTP. Please make a back up of your website before attempting to do this, or create a full restore point via your hosting panel, including the contents folder. Download the full contents folder, making sure to keep the same structure as before, use one of the image optimization tools available such as JPEG Mini, then re-upload the folders via FTP to the same location, replacing the existing content.

Optimize Images before uploading

Uploading optimized images to the web is super important for a better performing site. Now that you’ve optimized existing images, you’ll want to make sure you don’t make the same mistakes going forward. There are a few generic sizes you can use for sizing images for web:

Full Screen Slideshows – 2880 px width and 1500px in height
Regular Slideshows (slideshows that aren’t full screen) – 1200px in height and width auto
Galleries – 1200px in height and width auto
Blog Posts – height auto and 1200px in width

Check out the tutorials from below explaining how you can save images for the web while using one of the following tools:

Photoshop – Batch save images in Photoshop
Lightroom – The Ultimate Guide to Saving Images for the Web

Image Optimization Tools

There are several tools that can also assist with optimizing your images before uploading them to the web.

JPEG Mini

JPEGmini uses a recompression technology which significantly reduces the size of images without affecting image quality. You can use their web version for free, or purchase a desktop version.

JPEGmini is very straightforward. Simply drag the images into the application and let it work. You can also resize images and export them directly to a new folder. You can find more details on JPEGmini here and see how it works here.

The Pro version of JPEG Mini offers a LightRoom extension that will automatically add further compression when exporting from LightRoom. We highly recommend taking advantage of this, as a photographer it will greatly improve your workflow.

Tiny PNG

TinyPNG also has a free web app that uses smart lossy compression to reduce the size of your PNG or JPEG files. All you have to do is go to their website, upload your images, they will automatically compress them and give you a download link or a zip file.

With the free version you can upload a maximum of 20 images at one time with a 5mb per image limit. If your images are larger, you’ll need the pro version.

6. Optimization Case Studies

So you don’t get lost in all the theory and recommendations that we’ve listed out above, here are 3 practical examples of how we’ve optimized client websites for speed via our speed optimization service. We’ll show you the site score at a base level before optimization, highlight any issues, then we’ll explain how to solve them.

** Note, we did these a while ago, hence we’re using Google PageSpeed & Pingdom and the scores may have change as the sites and content have changed also**

Kate Lowe – Example #1

Site – www.katelowephotography.com
Hosting – Heart Internet shared plan.

Google PageSpeed Insights
Using Google PageSpeed Insights we were able to see that the following items were issues for this user.

How to speed up your wordpress site, case study

How to speed up your wordpress site, case study 2

Optimize images – 700kb of possible reduction on images.
Enable compression – Adding GZip plugin to save around 600kb of data.
Eliminate render-blocking JavaScript and CSS in above-the-fold content – Minifying plugin.
Leverage browser caching – Use of Caching plugin.
Reduce server response time – This may be improved by the caching plugin, however the hosting provider may also be a concern here. If it’s a shared hosting plan we recommend upgrading to an alternative hosting provider, such as SiteGroud.

Pingdom

How to speed up your wordpress site, case study pingdom

When using Pingdom we are trying to focus specifically on the load time of the site. The page size can give an indication on how large your page is. If it’s large, it’s going to be a problem for mobiles. The number of requests is the amount of resources the server is asking for, and the grade is the total performance of the page.

Starting Results
Google PageSpeed Insights – 33/100 mobile and 38/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 69/100. Requests 133. Load Time 6.16s. Page Size 4.8mbs.

Analysis & Solutions

As we can see from Google PageSpeed insights, there are multiple items that we can control to improve site speed and performance. The page size is 4.8mb and there are a large number of requests, which we can see from the pingdom results. The objective here will be to enable caching, reduce the server response time; compress the site, which should reduce the number of requests and the page size. We will also minify the Javascript and CSS further, most notably from additional plugins; and will optimize the images, which again will reduce the page size and response time from the server.

Image Optimization
After we’ve optimized the images (using the tools described earlier in this article), for Google PageSpeed Insights we have – 43/100 mobile and 48/100 desktop. Some further reduction can be completed, however it’s only 100kb, which will not drastically improve the actual loading time.
For Pingdom (Server Amsterdam) – Perf. Grade 68/100. Requests 112. Load Time 3.67s. Page Size 4.2mbs. Due to the shared hosting the load times look to be fluctuating depending on the current number of users requesting files from the server.

Enable Compression and leverage Caching – WP Performance Score Booster
To mitigate this we’ve used WP Performance Score Booster to enable compression and reduce the size of the files being requested by the server.
For Google PageSpeed Insights we have now – 65/100 mobile and 71/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 73/100. Requests 112. Load Time 4.25s. Page Size 3.4mbs.

Eliminate render-blocking JavaScript and CSS –Better WordPress Minify
We could see a number of CSS files that could be compressed to reduce the number of loadable resources. Using Better WordPress Minify CSS optimization option, we were able to reduce the CSS code. There were still 2 Javascript queries that could not be removed, and 3 CSS items that are related to google fonts.
Google PageSpeed Insights – 65/100 mobile and 71/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 76/100. Requests 103. Load Time 5.04s. Page Size 3.3mbs. (Size is down, but again note the load time, due to the inconsistency of the server)

Reduce server response time and caching – WP Super Cache
To help reduce the server response time, we are implementing a caching plugin. This means that the site is being served quicker as the files are cached in various servers around the world.
Google PageSpeed Insights – 70/100 mobile and 79/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 77/100. Requests 100. Load Time 2.23s. Page Size 3.4mbs.

End Results
Google PageSpeed Insights – Increase of 37 points for mobile and an increase of 41 points for desktop.
Pingdom – Reduction in page size from 4.8mb to 3.4mb. An increase in the load time from 6.16s to 2.23s, which is significant.

How to speed up your wordpress site, case study pingdom 2

Further Improvements:
We would suggest a switch of the hosting provider if the user wants to increase the reliability server response times. The use of a CDN will also improve the site’s overall load time.

Caitlin McWeeney – Example #2

Site – www.caitlinmcweeney.com
Hosting – Name Cheap

Google PageSpeed Insights

How to speed up your wordpress site, case study 3

How to speed up your wordpress site, case study 4

Optimize images – 1.4mb of possible reduction on images.
Enable compression – Adding GZip plugin to save around 500kb of data.
Eliminate render-blocking JavaScript and CSS in above-the-fold content – Minifying plugin.
Leverage browser caching – Use of Caching plugin.
Reduce server response time – This may be improved by the caching plugin, however the hosting provider may also be a concern here. If it’s a shared hosting plan we’d recommend upgrading to an alternative hosting provider, such as SiteGroud.

Pingdom

How to speed up your wordpress site, case study pingdom 4

When using Pingdom we are trying to focus on the load time of the site specifically, the page size can give an indication as to how large your page is, if it’s large it’s going to be a problem for mobiles. The number of requests is the amount of resources the server is asking for, and the grade is the total performance of the page.

Starting Results
Google PageSpeed Insights – 35/100 mobile and 30/100 desktop.
Pingdom (Server Dallas) – Perf. Grade 73/100. Requests 76. Load Time 5.19s. Page Size 3.2mbs.

Analysis & Solutions

Image Optimization
We were able to reduce the sizes of the images by 1.1mb, there is an additional 300kb that can be reduced for desktop, however using the smaller image here will affect the mobile site. We used Google’s image optimization options in the mobile tab:

How to speed up your wordpress site, case study pingdom 5

After optimization, with Google PageSpeed Insights we got – 42/100 mobile and 45/100 desktop.
With Pingdom (Server Dallas) we get – Perf. Grade 73/100. Requests 76. Load Time 5.51s. Page Size 2.1mbs.

Enable compression and browser caching – WP Performance Score Booster
To mitigate this we’ve used WP Performance Score Booster to enable compression and reduce the size of the files being requested by the server. We reduced the size by 500kb.
Google PageSpeed Insights – 59/100 mobile and 60/100 desktop.
Pingdom (Server Dallas) – Perf. Grade 73/100. Requests 76. Load Time 4.95s. Page Size 1.6mbs.

Eliminate render-blocking JavaScript and CSS – Better WordPress Minify
We were able to reduce the number of requests by 32 for the site, showing a small improvement in site loading time, but a larger increase in the site’s performance grade. We used the option to optimize the css and html. Just be wary to test each option when activating as it can break your theme’s styling if done incorrectly.
Google PageSpeed Insights – 59/100 mobile and 60/100 desktop.
Pingdom (Server Dallas) – Perf. Grade 86/100. Requests 44. Load Time 4.86s. Page Size 1.6mbs.

Reduce server response time and caching – WP Super Cache
Google PageSpeed Insights – 67/100 mobile and 69/100 desktop.
Pingdom (Server Dallas) – Perf. Grade 87/100. Requests 44. Load Time 2.43s. Page Size 1.6mbs.

End Results
Overall we were able to make some great improvements for the site speed and scores. We increased the scores by 34 for mobile and 40 for desktop. The page speed has improved from 5.19s to 2.43s. The page size has been cut in half to 1.6mb from 3.2. Again for this client, the hosting provider is a shared hosting plan, from a provider that may not score well in stress tests. For improved scores and load times a change of a hosting provider would improve the site further.

How to speed up your wordpress site, case study pingdom 6

Google PageSpeed Insights – 67/100 mobile and 70/100 desktop.
Pingdom (Server Dallas) – Perf. Grade 87/100. Requests 44. Load Time 2.43s. Page Size 1.6mbs.

Yvonne Zemke – Example #3

Site – www.yvonne-zemke.de
Hosting – Hosteurope.de shared Hosting

Google PageSpeed Insights

How to speed up your wordpress site, case study 6

How to speed up your wordpress site, case study 7

Optimize images – 272kb of possible reduction on images.
Enable compression – Adding GZip plugin to save around 630kb of data.
Eliminate render-blocking JavaScript and CSS in above-the-fold content – Minifying plugin.
Leverage browser caching – Use of Caching plugin.
Reduce server response time – This may be improved by the caching plugin, however the hosting provider may also be a concern here. If its a shared hosting plan we’d recommend upgrading to an alternative hosting provider, such as SiteGroud.

Pingdom

How to speed up your wordpress site, case study pingdom 7

Using pingdom we are trying to focus on the load time of the site specifically, the page size can give an indication as to how large your page is, if it’s large it’s going to be a problem for mobiles. The number of requests is the amount of resources the server is asking for, and the grade is the total performance of the page. Yvonne’s site has actually scored quite highly initially in this test. This shows that Google PageSpeed insights isn’t necessarily a good indicator of speed.

Starting Results
Google PageSpeed Insights – 34/100 mobile and 43/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade – 84/100. Requests 58. Load Time 2.11s. Page Size 2.6mbs.

Analysis and Solutions

Image Optimization
We were able to reduce the sizes of the images by 300kb. We used Google’s image optimization options in the mobile tab:

How to speed up your wordpress site, case study 9

Google PageSpeed Insights – 38/100 mobile and 48/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 83/100. Requests 57. Load Time 2.26s. Page Size 2.3mbs.

Enable compression & browser caching – WP Performance Score Booster
To mitigate this we’ve used WP Performance Score Booster to enable compression and reduce the size of the files being requested by the server. We reduced the size by 600kb.
Google PageSpeed Insights – 65/100 mobile and 82/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 96/100. Requests 57. Load Time 2.00s. Page Size 1.7mbs.

Eliminate render-blocking JavaScript and CSS –Better WordPress Minify
We were able to reduce the number of requests by 18 for the site, showing a small improvement in site loading time, but a larger increase in the site’s performance grade. We used the option to optimize the css, Javascript and html. Just be wary to test each option when activating, as it can break your theme’s styling if done incorrectly.
Google PageSpeed Insights – 65/100 mobile and 82/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 95/100. Requests 39. Load Time 1.96s. Page Size 1.7mbs.

Reduce server response time and caching – WP Super Cache
Google PageSpeed Insights – 67/100 mobile and 87/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 96/100. Requests 39. Load Time 1.2s. Page Size 1.7mbs.

End Results
Overall we were able to make some improvements for the site speed and scores. The site was already loading quickly, however it was scoring poorly with Google PageSpeed insights. We increased the scores for Google by 33 for mobile and 44 for desktop. The page speed has improved from 2.15s to 1.20s. The page size has been reduced by 900kb to 1.7mb.

How to speed up your wordpress site, case study pingdom 9

Google PageSpeed Insights – 67/100 mobile and 87/100 desktop.
Pingdom (Server Amsterdam) – Perf. Grade 96/100. Requests 39. Load Time 1.2s. Page Size 1.7mbs.

Conclusion

As you can see, many sites have the same pitfalls – caching, compression, unoptimized images and at times unreliable hosting services. Thankfully many of the items are easily mitigated with some work, a few plugins and a little elbow grease.

You can also see from the above examples that Google PageSpeed insights is only an indicator of performance, but not a true indicator of site speed. When testing for speed, please remember to use GTMetrix or Pingdom, and select a server that is close to your and your audience’s location.

SEO Services

 

If you’re interested in if getting help from our team with improving your site’s speed and performance, take a look at our Speed Optimization services.

Flothemes Team,
Supporting You.

2 comments

    tammyrose295

    10:41 May 25, 2018

    Amazing This kind of a great Blog. I presumed it turned out extremely helpful. I uncovered this which is exceptionally utilize full. Extraordinary article and data continue sharing more! Love yours blog. Quantity of Thanks.

    Tim

    20:12 May 25, 2018

    I recommend testing your speed several time for a baseline and then after each change you make to optimize speed. This is because you will always get something different, and there will always be "wonky" results. For instance, my homepage speed is usually less than two seconds, but yesterday I got a result in the vicinity of 20 seconds. Personally, I take five readings, throw out the highest and lowest, and average the middle three. But I'm a little strange that way.

Comments are closed.
What Are You Looking For ?
We need cookies to run our site optimally, by continuing to browse you agree to our cookie policy for our required cookies. If you’d like to update your cookies, check out how to clear cookies for your browsers here.
Accept