* Note: This post was first published in March 2013. Some of the tools I mentioned here maybe outdated.
It is no secret that Google is now using site speed as one of the ranking factors. Google Webmaster Central Blog made an official announcement on this some years ago:
You may have heard that here at Google we’re obsessed with speed, in our products and on the web. As part of that effort, today we’re including a new signal in our search ranking algorithms: site speed. Site speed reflects how quickly a website responds to web requests…
And, Matt Cutts has repeatedly mentioned about the importance of website speed optimization in his videos and blogs.
While searching and reading more on this topic, I bumped into several case studies that confirm on this – In one article on Search Engine Watch, Work Coach Cafe gained an extra 40% organic traffics after cleaning up its codes and broken links; on another case study, SmartFurniture.com CEO confirmed that the site made a quantum lead in search engine rankings simply by increasing his site performance.
Faster Page Load Time Also Equals To Better Conversion
But wait, there are more reasons why you should take time to speed up your website.
In one study on travel site users, I learned that 57% of website users will only wait for three seconds or less before abandoning a site.
The popular research at Tagman, it shows that an increase of one second in page load time can cause nearly 7% loss in customer conversions.
In another case study at Cloud Living, site visitor engagement improved by 19% (average session duration, see image) after site speed optimization.
In short, page load time not only affects search rankings, it also impacts greatly on conversion rate and visitors reach. For more similar statistics, make sure you visit Mashable for this beautiful infographic.
Easy Ways To Improve Your Website Speed
When I first learned about all these two years ago, I was like “Wow, there’s so many benefits in this!”. What’s come next is inevitably the question ‘how’. How do we speed up our websites? How do we measure the speed of our website and compare with others? How do we get things done without getting into too much technical details?
Ian Lurie wrote 29 Ways To Speed Up Your Website back in March 2011 and it’s a true gem. If you are serious about tweaking your website speed, you should follow every single tips shared in the article.
However many of these solutions may be beyond the technical skills of everyday website owners and bloggers.
So I thought I’d revisit on this topic and look for simple ways and so the non-techie users can implement without pouring too much of time and energy.
1. Slim Down Your Site
In many times when a page load time is slow, it simply means the page is overweight.
The solution is easy: Go on a diet!
Take a thorough check on your website and ask yourself these questions:
- Are you keeping too many unused CSS in the server? Delete them!
- Are your images too large? Optimize them with Photoshop, Fireworks, or Smush It if you don’t have a graphic software installed in your PC.
- Are you having excessive HTTP headers? Remove them!
- Are you keeping too many spam comments? Undeleted comments in your spam box will simply slow down your database response time. Remove them asap!
- Are you using too many plugins on your CMS? Are you using outdated plugins and scripts on your site? Well then it’s time to do some clean up and updating job.
While these tips seem pretty simple, I won’t be surprise to see experienced webmasters or web designers fail to keep up with it.
A few years back I was careless and I wasn’t aware that the WordPress theme I am using has a <?php wp_get_archives(‘type=monthly’); ?> embedded in the header.php file.
Needless to say, the function generates dozens of unnecessary lines in HTML files as time goes. It’s a silly mistake that can be fixed in seconds, but then it took me more than 2 years to realized it as I wasn’t looking on my own source code.
2. Avoid Unnecessary HTTP 300’s, 400’s and 500’s
HTTP 300’s refers to server redirects, HTTP 400’s refers to authentication issues, and HTTP 500’s refers to server errors – all these results for HTTP requests cause unnecessary extra round trips* for the browsers. While certain HTTP 300’s are unavoidable (such as 301 redirection to a new page location), you should look into every HTTP 400’s and 500’s errors and try to fix every one of it.
* What’s A Round Trip Time Anyway?
General speaking, a webpage weights roughly 1,100KB in size and consists of roughly 100 objects (source); a web browser can only request 2 – 6 objects at a time depends on user’s configuration. Round Trip Times is the number of round trip it takes for a browser to open up a page completely. For example, In order to load a webpage with 100 objects, a browser that is configured to carry 5 requests at a time will takes 20 round trips to load the webpage. Since the lesser round trip times it takes, the faster a webpage loads; we should minimize the number of objects available on one page.
3. Use CSS Sprites
CSS Sprites refers to the technique where multiple images were combined into one image file and shown parts of it to the users at a time. Using CSS Sprites reduces the number of browsers round trips and hence makes web pages load faster.
Now wait, I know this might seems a little too much for some of you who don’t like to get your hands wet on CSS but trust me, the concept is much simpler than it sounds. And, best of all, there are free tools online that can get things done without touching the CSS codes. Check out Sprite Me and Sprite Pad – things can be done in just a few drag-and-drop and clicks.
Also, for further readings and examples of CSS Sprites, visit this and this tutorial.
4. Avoid Using CSS @import
CSS @import function helps load external stylesheet to your webpage. The bad thing about this is that it simply adds additional browser round trip times and increase your webpage load time. To solve this, simply use a <link> tag instead.
In case you are a casual blogger and have no idea what am I talking about, just go have a look on your header.php (if you are using WordPress), ctrl + F and search for ‘@import’, move .css files to the same server if necessary, replace @import lines with <link> instead.
<link rel="stylesheet" href="style1.css">
<link rel="stylesheet" href="style2.css">
5. Update Your CMS
Well this is a no-brainer, right? Updates are meant to boost performance and security and the least you can do for your visitors is to keep them on an updated CMS platform.
6. Cache All You Can Cache
These days in most cases I rely on a third party plugin for caching. For one, I am too lazy to look into it; secondly, there are pros that can do things much better than me, why waste my energy in this? In case you are on WordPress, try WP Super Cache – it’s one of the most popular cache WP plugin at this time of writing. In case you are Joomla, check out Cache Cleaner.
In brief, these plugins help cache the latest version of your webpage and reduce the needs of generating dynamic content during a repeat visit.
There are plenty of technical details to crunch in this topic, feel free to read more at here and here.
7. Get On A Content Delivery Network (CDN)
A CDN stores your static files across servers worldwide and serves your web pages from different servers based on user’s location. Example, when a user from Malaysia access to your website, the CDN will delivers your web content (mainly static files like images and HTML files) from the server located in Asia, say Singapore; on the other hand if the user is located at Mexico, the network will choose to deliver the content from a nearer server location, say United States.
There are different brands of CDN available out there but in general CDN can be grouped into two categories – Pull CDN and Push CDN. For more details, I suggest you have a look on some of the reputable CDN services such as MaxCDN and CloudFlare.
8. Consider A Better Web Host
If you are serious about tweaking your site faster, consider picking a better hosting.
Roughly one year ago I switched one of my websites from a shared hosting account at Hostgator to WP Engine (a cloud based hosting). Things changed dramatically ever since I moved, the average page load speed cut down from over 900ms to 500ms – an almost 100% improvement (see chart below).
Lesson learned: Sometimes you just can’t rely on the cheap stuffs. If you are paying less than $5 per month, don’t expect to get on top of this speed game. If you want your website to load lighting fast, perhaps the easiest way to do so is to shift your website to a better web host.
9. Optimize Your Database
If you are on MySQL, things can be done easily on phpMyAdmin. And if you are on WordPress, things can be done even easier with the right plugin. WP Optimize, for example, allows you to clean up your database in just a few clicks.
10. Place Your Scripts At The Footer Whenever It’s Possible
One easy way to improve your page load time in the view of visitors is to to place codes and scripts (for example, Google Analytics) at the footer whenever is possible. Though I believe it barely helps in term of SEO, doing so will nevertheless makes your website viewers feel that the page is loading in a faster manner – as this allows critical content to load before browsers execute the scripts.
More Tips On Speeding Up Your Website
There, you now have my 10 quick tips on how to improve website speed.
I am sure there are many other methods to get the job done, why not tell us yours – What’s your #1 tips for a non-techies to speed up their websites?