With today’s internet speeds and even shorter attention spans it is important to have your site load as fast as it can. With WordPress this can get complicated quick. This is my own Perilous Journey on how I show you how to speed up WordPress load times. I’ll go through how to troubleshoot your own site using free tools, then provide you the information needed on how to get your own site to load faster than you though possible.
Why Are We So Hell Bent on Fast Load Times?
Because nobody wants a slow loading website. With today’s high speed connections and uber short attention spans you have about 9 Seconds to grab someones attention before they surf to the next website. Thats the same amount of time as my son’s Goldfish “Fish Stick” (long story). So if your website takes about that long to load? Potential clients/visitors/subscribers have probably already moved onto other websites never to return to yours.
What About the SEO Benefits?
Well, Google states that it takes load times into account. There are (theoretically) over 200 different factors which come into play in the insanity that is SEO and trying to get Google’s attention this is still an important one. Fast load times are more for your visitors and potential clients. Plus – who doesn’t like things to go faster when it comes to the internet? NOBODY. Well, except your competition.
Make Your Site Load as Fast as Turbo!
So What Causes Slow Load Times?
There are a lot of places to look on why your site might be running slower than it should:
WordPress Themes – By this I mean poorly designed WordPress Themes – Sure they might be pretty, but they could be pretty awful when it comes to the backend and overall performance.
WordPress Plugins that either use too many resources to function or are poorly designed to begin with. You might have heard “Don’t load your WordPress site down with a ton of Plugins”, or even better “Don’t go over X Amount of Plugins on your site”. These are all half truths. I have around 30 Plugins running. You just have to be careful on WHAT plugins your running – not HOW MANY. What is the right number? It depends on how many you feel you need to get the right balance of functionality and speed from your site. :-)
Too Many Cascading Style Sheets - or CSS. These are used to tell the browser how to display stuff. Remember that any plugin you install will most likely pop another one of these on your site. Having to load all of them separately will slow your site down a little bit.
Too Much JavaScript – This is one of the real killers. Too many scripts running up in the HEAD section will prevent your site from displaying before the javascript code finishes loading!
Not Optimizing Your Images – I’ve been guilty of uploading 1.4MB images. Considering the front page is 1MB in total size? Thats a big no-no. From optimization, using height/width, or the ALT tag. Not optimizing your images correctly will slightly (or greatly) affect load times.
Too Many HTTP Requests – This is how your browser communicates with the server your site is hosted on. It does this for every element on your site from beginning to end. Any time a visitor goes to your site it goes something like this:
Browser: “Ring Ring”
Server: “How Can I Serve You?”
Browser: “Please Serve Me Your Header Info”
Server: “Please Wait”….. “OK, Here You Go”
Browser: “Ring Ring”
Server: “How Can I Server You?”
Browser: “Can I get the site logo?”
Server: “Please Wait”… OK, Here You Go”
And so on and so forth until your site is loaded on the browser. I know this is a very simplistic view. But you can imagine if you have a LOT of these requests happening and any one of them take a long time to get a response? Then your site will be affected.
Your Host – Especially if you are on a basic shared hosting plan. Unfortunately their is very little on what you can do here except change hosts – which can get expensive!
All of the above are factors that could be affecting your load times. So what do you need to do to get it back up to speed? Well first you need to start with:
Step 1 – Figure Out What is Going Wrong
Before you can get your site to load faster you need to figure out what is causing it from loading so slow to begin with. This is where you will need to check out a few things and run a couple tools to get your started. Why? Because if you don’t know the problem – how are you supposed to find the solution?
Speed Test Tools Online
You’ll want to run your site through the following tools and see what they come back with. Mind you they will all say pretty much the same thing here. But I like having a LOT of data to work with.
Google Page Analyzer - Although this tool doesn’t provide any type of speed test? It does provide information and tips on what you should try and do to get a better score from them.
Pingdom Tools - I really like Pingdom’s free speed test. It gives you so much information from the “Waterfall” showing you how your site loads for people to their YSlow Score which provides even more great information. The other thing I like is that it will archive the tests you perform so you can go back and take a look and see if your going in the right direction or not :)
GTMetrix - This is another free page speed test. It does the same thing as Pingdom. Both are equally great tools and I’ve used both of them a lot recently.
QuickSprout - This is Neil Patel’s free new online website analyzer. It is geared more for SEO, but it gives some great information on what could be bogging your site down as well.
P3 (Plugin Performance Profiler) A WordPress Plugin to See What is Slowing Your Site Down
P3 (Plugin Performance Profiler) - Which will slow your site down dramatically when you run it. So install it, get your reports, and de-activate and DELETE it as soon as you run it. I suggest running this when your site has the least amount of traffic as well. Also – you might tick off your Hosting Provider as it is a pretty intensive application. So why run it to begin with? This will provide you with a very detailed reports on the plugins your currently running on your site which are causing it to run slow.
Step 2 – What to Do With Your Data?
This is the trickier part is figuring out how to read the results and what to do with all of the data you collected. Below are example on how to read the data you put together from Pingdom and P3 WordPress Plugin Profiler
Pingdom – Look at the “Waterfall”
Click to Enlarge
I’m using Pingdom as the example here but all of the tests above (except Google) have something similar and will display the same data. Here you want to look and see how long the different requests are taking to load. Make a note of all the higher number elements and write them down. You can sort the data by load time so they are sorted from highest to lowest.
Look at the Performance Grade
This will give you a grade on how your site behaves and is interpreted. If you are doing everything perfect you get 100. Don’t fret if you don’t get 100′s across the board. If you hit the little dropdown arrow on the right it will show you what it found. It will be up to you to determine if these are things that you can tweak or change to help improve the scores. As you can see from the results of testing here – I still have work to do.
Page Performance Score
P3 (WordPress Plugin Profiler)
I would suggest looking at the Pie Graph and then have it Email you the list so you can quickly deactivate and unload it. Remember I said it is a giant resource hog that will slow your site down. With the example I’ve posted it shows 40 plugins loaded onto my test site. These were either currently running or I was testing/reviewing them to see how they worked before deciding to roll them into production.
Pie Graph
This shows you the top plugins that are using the most resources to run. You’ll notice along the top it provided how many plugins were tested, the load time for ALL of them, the overall impact of the time it took to run to display them, and how many MySQL Queries it took – again for all of the plugins installed. This is good information to review – but don’t go uninstalling your plugins just yet!
Resources
Email the List of Results
This list of information provides to you ALL of your plugins, the amount of time it took to load, and the % of resources used. I color coded the plugins based on the % of resources. This data should be matched up with your Pingdom waterfall results to see which plugin (if any) are actually slowing your site down.
Please Note: I’m in no way stating the plugins listed in the example are “bad” or that you shouldn’t use them. These were the ones I happen to be testing or using on my own site. Your results will vary and you will need to make your own determinations about your own site.
This example showed me that I had plugins that I didn’t really need to run any more like WP Popular Posts, Pie Register, Genesis Simple Hooks, Go Codes, Thank Me Later, Twitter Embed, Social Media Widget, and WP Auto Links. I found that I either had other functionality in place, WordPress had it built in, or I decided to “hand code” it as I did to replace the Social Media Widget. Other things that I noticed are plugins like TubePress, Crayon Syntax Highlighter, WP Subscribers needed to be tested more to see if they actually impacted the overall site load times and then figure out if I can either optimize them or find viable alternatives. And WordFence I knew was a resource hog as it is a built in Firewall into WordPress and it does a LOT of stuff behind the scenes. Some of the others weren’t being used in production so I wasn’t worried about them.
List of Plugins Sorted by % Resources
By auditing your WordPlugins you can find out if any of them are affecting load times. As a side effect you can end up reducing HTTP Requests, find out you were using plugins that were doing duplicate work, and even lighten the server load a bit which your hosting company will appreciate!
Step 3 – Time to Speed it Up
Use a Different WordPress Theme? – You know I’m a big fan for using Genesis. It is setup from the gate to be SEO friendly and optimized to run fast. Of course you have to be careful of what Child Theme you use with it still. Most of the ones from their site are great. Before you run off to re-design your site though I would perform everything else first and if your site is still having issues – it could be the Theme you’re using that is slowing things down.
Review Your Plugins - Remember I said go through the data you collected and find those WordPress plugins that are taking a long time to load. You will need to either remove them and find alternatives – or keep them if they are crucial to running your website. Doing this step alone can reduce your load time down by a few seconds! I ended up chopping about 11 different plugins that I either didn’t need or they were having to work too hard to run right with my own site. It is a frustrating but critical process to find what works and what doesn’t.
To Minify or Not to Minify – That is the Question - This is another of the big ones for helping you in your quest to reduce http requests and help load your site faster. Minify your *.CSS and *.JS that load in the HEAD section of WordPress. What does it mean to “Minify” to begin with? It is the method of taking all of the Cascading Style Sheets from your theme and plugins and combines them into one file. It will also take any JavaScript *.js files and combine them into a separate file as well. Oh, and if you use a plugin like W3 Total Cache? They can minify your HTML as well. All of this helps make your site load faster by presenting to the browser an overall smaller page size, and generate less HTTP requests.
Make Sure to Test!
The issue I found while performing this step is that if you get to aggressive with the plugin settings. You will have strange results. My suggestion is start at the minimal settings of whatever plugin you decide to use and make sure to test, test, test! Some plugins that I have tested that work with varying degrees of success:
Better WP Minify (BWP)
WP Minify
W3 Total Cache
Cache Plugins – WP Super Cache vs W3 Total Cache
Use a Cache Plugin
There is a lot of debate which one is the better plugin. And until today I would have gone with W3 Total Cache. Unfortunately their current version is broken for me. So I’ve since switched to WP Super Cache. In reality they both are great Plugins as they will help cache your content to again present it to visitors faster.
W3 Total Cache – As I said before its broken for me as of this writing. But that was with the CDN feature of the plugin and MAX CDN so I’m sure they will get it squared away on their next bug fix. This one can get out of hand trying to configure it at first. But it is literally an all in one solution for Browser Caching, CDN Management, and Minifying your content. It is complicated to learn how to use it and if your on a shared hosting provider like say Host Gator? They frown upon most people using it as it could actually hurt you more than help if it is misconfigured.
WP Super Cache – This is a simpler cache plugin that will cache the content on your site. It also has some basic CDN functionality built in. I’m currently using it as it is a lot easier to get setup plus Host Gator recommends I use it. If you aren’t technical at all? I suggest using this plugin over W3 Total Cache.
GZIP and Browser Caching
What both of these plugins also help you enable though is the ability to use gzip or compress elements of your WordPress site and Browser Caching. Browser Caching if done correctly will have the pages ‘pre-loaded’ and be able to serve them to visitors faster. This feature is usually installed in most web servers. You’ll have to contact your Host to see if this feature is enabled. Of course you can geek out more about using GZIP (mod_deflate) by going to the Apache site and read more about it.
External JavaScript and JavaScript in Plugins
Social Media Widgets
Reduce Your JavaScript!
This one is the most frustrating one for me. On one hand you’re told by countless people have Social Proof that people like your site. The issue? All of those Facebook/Twitter/Google + profiles you load require external JavaScript calls and they take time to retrieve and load onto your site. And they are horrible when it comes to page load times. Now I have tried virtually ALL of the Social Media plugins out there. They either slowed the load time of the site down, or in a lot of cases after I applied any type of cache/minify settings? They just didn’t work at all. So currently I’m sticking with Digg Digg to keep it simple – not because it was the best I was just able to get it to work lol.
Unavoidable JavaScript
If you have Google Analytics setup, or if you run any type of Ad Banners? These are also out of your control to some extent. One of the things you can try and do is host the banner ads locally and have your own affiliate link setup. Either way you will still get dinged by this as well. There are ways to get around this, but they are highly technical and require skills I don’t currently possess or a dedicated server to use.
Move JavaScript to Load Near the Footer
Although this is hit or miss for me. You can experiment on your own site. Again you’ll need to make sure you didn’t break anything after doing any changes here. I know some safe things to move to the Footer? Your Google Analytics tracking code and the “Amazon helper popup script” that I was using for the Amazon images I use on the site. Other things like the Digg Digg share bar will load way too late for it to be useful.
How? I use Genesis and this will allow me to place JavaScript codes down in the Footer. There are WordPress plugins that do this as well to varying degrees of success. And of course W3 Total Cache will allow you to do this. In the end? I just let them run up in the Header to avoid this headache for the time being.
Optimize How Images Are Used
Optimize Your Images
Reduce the File Size of Images - If you aren’t already you really should anyways. I think of it as a kindness to visitors by doing this. Although this only helps your load times by a small margin every little bit helps. You can do this a few ways:
WP Smush-it - You can download and install this plugin and have it run through your site. Depending on the site of your site and how many images you have running though? It very well could stop running. Warning: Make sure to go to the Media settings and disable the “Auto Optimize Images Upon Upload” Feature. Go in after your images are uploaded and then run it.
Smush-it – This is the direct link to the Yahoo site where you can upload your images, get them optimized BEFORE you load them onto your WP site. No plugin necessary then!
Image Software – I know not everyone can afford a program like Photoshop. But a lot of image software nowadays offer the ability to optimize your images for webpages. Google “free software for optimizing images” and you will see a ton of free software that does it as well. There is also Gimp which is free.
Use Sprite Images for Static Content
Ever hear of using sprite images for static content? I have and trying to do it by hand nearly drove me nuts. There is a great site out there that helps generate sprite images and even gives you the CSS code to help you place it on your site. This is still pretty advanced for a lot of people and I’m still on the fence of the actual benefits of using sprite images. Oh and the site? Spriteme.org
Use Height and Width - ALWAYS declare the height and width for all of your images on your site. Although WordPress does this for most of your images. Any custom stuff you add? Make sure to declare them. Plus it really isn’t that much more work to put in height=”1px;” width=”1px;” now is it?
Featured Images - If your site supports this – figure out the correct size of the image needed and use it instead of having WordPress do it for you. Re-sizing using HTML doesn’t change the actual physical file size.
Use of the ALT Tag - I know not necessarily a speed optimizer – but if your going through all the other hassle make sure to fill in this field for both the handicapped and Search Engines visiting your site.
Use a CDN
A CDN or Content Delivery Network hosts your content on their server network and presents it faster to anyone around the planet faster than just hosting it all on your site. A good CDN also takes a load off of your server the site is hosted on so you can provide a consistent server – even during peak traffic. There is usually a cost involved though. And is there a real benefit to using one? I would ask yourself a few questions before deciding to invest in one:
Do you get a lot of traffic? – I’m talking in the thousands of visitors.. not hundreds.
Do you have an international visitor base?
Is your site slowing down during peak traffic times?
Then sure I would recommend getting a CDN. Otherwise? The answer would be no. I did some speed tests on this site which is currently using a CDN vs. a friends site who is hosted by Host Gator as well without a CDN. And the load times were pretty close. A CDN would end up being a costly expense you just don’t need for the time being.
If you want to try one for free though? I suggest CloudFlare. I even wrote an article about it. Just make sure to keep an eye on your traffic and see if it changes for the worse. I have since switched to MAX CDN and I couldn’t be happier with the service.
Read More: CloudFlare Review|Does it Really Work?
Your Host Could Be Your Biggest Block
Unfortunately if you do ALL of the above and your site still isn’t loading the way you want to? You might be better off moving to a different hosting service. Again this can get expensive if your a blogger on a budget. I’ve heard awesome things about WPEngine. It can start out at $29.99 a month for their Personal plan for up to 25,000 visitors a month and jumps up from there. Other services I researched VPS.net and Synthesis both offer the same type of dedicated WordPress hosting and can be a bit cheaper. I would only justify this if you are getting enough traffic and revenue to be able to support it.
Some Other Tips
Reduce the Amount of Ads
If you have a lot of advertising on your site? Then that will indeed slow your site down. Especially if they are externally hosted. If you do feel the need to display all those advertisements? Try and host them locally on the server instead and add your own link to the product your advertising. I use Max Banner Ads Pro and it allows me to do just that:
Read More: Max Banner Ads Pro Plugin Review | Take Charge of Your Banner Ads
Add Expires headers
Expires headers let the browser know whether to server a cached version of the page. You can do this using either W3 Total Cache or in my case I have my CDN handle these. The benefits?
Reduce server load
Reduces page load time
Wrapping it All Up
I know this was a LOT of information to process and get through. So just to summarize everything again to keep it all straight:
Review Your WordPress Theme
Review Your Plugins (Reduce,
Minify CSS, JavaScript, and HTML
Use Browser Caching
Reduce HTTP Requests (by doing the above)
Optimize Your Images!
Move JavaScript in the Footer
Get a CDN (if justified)
Move to a Different Host (again if justified)
Want to Learn More?
Now I didn’t pull all of this from my magic Raider’s Cap. I had to sift through a LOT of information. If you want to read some advanced stuff on how to really get your site to load in under a second? I suggest checking out Portent.com – They have seriously geeked out and have one of the fastest loading sites I’ve found on the web.
So…. How Fast is YOUR Site Now?
Yes, I went through ALL of the steps above. I even went through the entire site with a fine toothed comb trying to remove anything that was slowing the site down. I ended up removing 11 different WordPress plugins, read countless articles, re-designed the sidebar, used sprites for some static images, and even switched to a different CDN. By doing all of that I managed to reduce the amount of HTTP Requests from over 100 down to 71. I reduced the overall file size of the site from 1.4 MB to 1.0 MB. I improved my Google Score to 80 from 67. And I can consistently get load times of about 3.5 seconds. I know not great. When you load the site up now though it should be pretty snappy on both browsers and mobile devices.
Have Any Questions/Thoughts/Concerns?
Have any questions about the article? Or want to add some tips on what you did to help your own site perform better? Or even better – if you used the tips above? I would love to hear from you in the comments below with your results. Either way leave a comment – if I like it I’ll update the article with it and make sure to cite you for providing the tips!
One last thing… want some help with your own site? Well contact me and I’ll see what I can do to try and help.
Image credit: ktsdesign / 123RF Stock Photo
Be the first to comment...
Related Posts:
Must Have WordPress Plugins for the New Blogger
CloudFlare Review | Does It Really Work?
7 Reasons Why You Should Move Your Blog to a Self Host WordPress
Internet Speed Fixes | Why You Lagging Bro?
RSS Feed Powered by MaxBlogPress Bring My Blog Visitors Back