Google has a pretty great opinion about website speed. They value it.
The reason for this is pretty intuitive: the faster that a page loads, the more likely a reader will stick around to read it. My site used to load in 8-10 seconds, which is pretty much an eternity in web terms. For comparison: Mashable loads in 2.4 seconds, CNN loads in 3.2 seconds, and TMZ loads in 6.5 seconds.
Considering the complexity of some sites relative to most self-hosted WordPress sites, there really isn’t any reason not to have a pretty fast site.
What I want to do in this post is show you some tools that you can use to test the speed of your site, some tools that you can use to determine how your plugins are impacting your load time, discuss caching and CDNs, discuss optimizing your images, font families, and finally wrap up at the basis for your site: your theme.
There are plenty of page speed testing tools that you can use to find the speed of your page. I primarily use two: the Pingdom Website Speed Test and Google PageSpeed Insights. Each of these provide somewhat different insight that I’ve found helpful to speed up my site.
The Pingdom tool allows you to specify a query from three locations: New York, Dallas and Amsterdam. The Amsterdam query is always interesting to me because it shows me how much longer it takes for my stuff to load overseas, which is an interesting insight if you’ve got overseas readers.
You can see that the query grades you relative to other sites that have used their tool and gives you some specifics of your page.
Underneath the summary are four tabs: waterfall (which lists every request for your page load), performance grade (which lists some metrics related to page speed and grades you on them), page analysis (which digs into all of the details of your load processes including time and size for each process), and history (which gives you the history of your last few tests).
The most helpful tool for me is the performance grade tool which details the processes recommendations to speed your site up. Here’s the analysis for my site:
The way that I improved these metrics was simply to take their verbiage and Google it to find out what I could do to speed things up (like this):
You can see that one of the ways to solve this issue is to use a CDN (content delivery network), which I’ll discuss in a little more detail later. My CDN is giving me grief right now, so it’s turned off which is potentially slowing down my site.
The Google PageSpeed results are more or less the same, although they offer mobile-specific insights as well. Here’s a screenshot of Google’s perspective on how I could get speedier:
You can see that under each recommendation there is a section entitled “Show how to fix” which tells you specifically which files and processes they are considering with further webmaster references about the issue. Ironically, one of the biggest problems that Google identifies with my site are processes associated with AdSense.
As I said, there are plenty of other tools out there but these are the two that I’ve found most useful. Each of these allow you to make multiple measurements of the page speed, which is important when we start discussing what’s under the hood of your website and how it is impacting your page load.
It probably goes without saying that you can use these same tools to test the page load of your competitors or peers as well.
Testing Plugin Speed
When I first started using WordPress, I was especially liberal about the plugins that I would use. There are plugins for nearly everything you could want to do on your site. Since they have a lot of extraneous code, plugins are costly when it comes to page speed. When it comes to speed, less is better (You’ll see below that I still use fifteen, so do as I say not as I do 🙂 ).
I saved a ton of load time by ditching all of my social plugins and using code snippets to create social share buttons. I took look at everything that I was doing with plugins and evaluated whether the function was necessary, could be done another way or eliminated.
One tool that has been invaluable to me in this process has been GoDaddy’s P3 Plugin Profiler (don’t worry, this was created by GoDaddy but you don’t have to have GD hosting to use this).
After loading the plugin, you perform a straightforward scan where the plugin loads the site in a separate window. P3PP determines how each of your plugins impact your overall load time. Here are a couple of screen shots from my site:
There are multiple insights that this plugin give you, the most valuable being the association of load times to specific plug-ins.
You can also use the page speed tools to A/B test problematic plugins. The key to doing this is to generate a sample size of multiple loads with the plugin on and multiple loads with the plugin off.
There was two super-useful plugins that I decided to delete after going through this process to evaluate them. And I do think it is a common condition for many self-hosted WordPress sites to have plugins significantly diminishing their load times.
Caching Plugins / CDNs
The goal of caching plugins is to increase server performance and reduce download times. This is done by leveraging data stores (caches) so that future requests for that data can be served faster, and by consolidating disparate code into static HTML. I speak of this in the abstract as I have no idea the specifics of how this occurs. What I do know is that caching plugins can speed up your site quite effectively.
Caching is complex. You may not know the name Rick Anderson unless you use the Thesis framework, but he is a pretty well-respected web developer and Thesis developer. Here’s a quote from him when he was discussing how he manages caching plugins on his web properties:
“it’s actually far more complicated than I understand. And so you know, anytime you see a simple tutorial on how to use W3 Total Cache, the person is either using an extremely simple site or they’re completely full of sh*t.”
What I want to reinforce about caching is that it is not so straightforward. For example, I was reading how a setting from one caching plugin purportedly ruined websites utilizing the Thesis framework (which is what I use). Some key thoughts before attempting to use a caching plugin:
- Backup your site (regularly)
- When you make changes check your site on all major browsers and mobile.
- Find some instructions from the website on how to set-up the plugin AND Google the plugin and your framework to determine if anyone is having issues with them.
That said, there are two big caching plugins: W3 Total Cache and WP Super Cache. I use W3 currently but have used Super Cache in the past. Here’s the general consensus about both: W3 is more complex and works better (particularly with their CDN integration), and WP Super Cache is easier to set-up and maintain. I general agree with both critiques.
Here’s a screenshot from W3 Total Cache showing all of the settings tabs that you would have to set up:
Particularly with W3 Total Cache, it’s advisable to find a reputable set-up and mimic that to begin with. And then to fiddle with the settings as you feel comfortable / brave. For instance, I adjusted the minify settings and gained some speed. That said, I am hesitant / mortified to adjust much else.
I don’t know that there’s too much more to share about caching plugins. Their effectiveness is dependent on the settings that you have and how the caching impacts your other plugins.
One other aspect for W3 specifically is its integration with CDNs. CDNs host your media and deliver them from redundant servers to load for the user faster. I use MaxCDN (when I have the settings right), but there are plenty of other ones, Amazon Cloudfront and Rackspace to name a couple. CDNs work really well to speed up loading of your media files.
W3 integrates pretty seamlessly with CDNs, adding an additional dimension to their effectiveness. There is some debate about whether CDNs are necessary for smaller WordPress sites (and theoretically they may not be). But I actually did an A/B test of my site with my CDN on and without CDN on and found a demonstrable decrease in load time using the CDN.
Image Optimization / Font families
I wrote a recent post about image optimization, and how media size impacts load speed. If your media files are humongous (as mine have been in the past), then they may be seriously undermining the effectiveness of your content with readers and with search engines. I personally use EWWW Image Optimizer to automagically optimize my images, but a third-party has reportedly taken over the SmushIt plugin and given it similar functionality (there are other plugins that optimize images, these are just the two most recognizable ones).
Another thing to consider are the fonts on your site. I use Google fonts, and one of the neat features of their font sets are that they tell you how much additional load time adding any particular font set would add. If you get into that level of detail for your site and don’t want to use web-safe font families, this is a calculated way to improve your site without compromising too much speed.
Framework and server
When it comes to premium WordPress themes, Genesis and Thesis are (or at least used to be) the most prominently used frameworks. Genesis seems to have surpassed Thesis both in users and in goodwill, but I mention both because I use Thesis for this site and because both themes are extremely fast. This is one of the reasons why you’ll see a lot of notable bloggers using these themes (off the top of my head Matt Cutts, Chris Brogan, and Jay Baer use Genesis, Derek Halpern and Bed Bath and Beyond run Thesis).
I can relate my own experience with premium and not so premium themes: Thesis had a huge transition from versions 1.8 t0 2.0. They completely revamped everything in their platform, and I didn’t have time to learn how to use the new platform. So rather than use the older version I switched to a different theme. I noticed immediately that the support was worse, the look of the site was worse and the load time was off of the charts worse. After experimenting with a few themes, I bit the bullet and learned how to operate in Thesis 2.0. I should actually credit web development company Themedy, who create really fantastic child themes for both Thesis and Genesis as I couldn’t have built a responsive site from the ground up with Thesis.
Once I went live with Thesis 2.0, my load time decreased demonstrably. You’ll see that so many bloggers use the Genesis platform that anyone competing in their space is almost disadvantaged not to be using a premium framework.
Finally, one aspect of speed optimization that sometimes goes unmentioned is server speed. Server speed is an important aspect of page load, and this is why premium hosting companies like WP Engine charge more than GoDaddy or Network Solutions. They flat out serve content faster. So, if you’re really serious about page speed your hosting is an important contributor to that as well. And of course like CDNs and premium themes, there is a premium cost associated with this sort of hosting as well.
I hope this gives you an overview of some things that you can do to identify and correct speed issues with your website. I read a lot of blog content that IMHO is amazing, but that suffers from a lack of distribution. I hope you can see how slow load times can impact distribution quite a bit. Hopefully you saw something in this post that you can do so that more people will be able to read your stuff.