Quick Tip for Improving Website Load Time

Website load time is a critical metric to keep track of as it impacts the usability of your site as well as your rankings in search engines. In April of last year Google announced they were adding site speed as a new signal in their ranking algorithm. It makes a lot of sense, search engines are obsessed with speed and performance because it directly impacts how their customers, the web searcher, will interact with the results they find.

This also goes back to the most important rule of SEO, design for the user, and the user wants the fastest site possible. I read a great tip recently about a truly simple and effective method for improving website load time and I’ve begun employing it across multiple brands, and it’s working like a charm. In fact, this blog itself now uses this technique so along with being on a shiny new server, it’s also optimized to load much quicker than before.

One of the biggest ways you can increase your site speed is by reducing the amount of time it takes for the images on your site to load. You can dramatically improve your website load time by hosting your images on another server, especially a lighting fast server like Amazon S3. This means that every time your website loads images, rather than making the request to the same server that is loading the site itself, it is making the request to Amazon S3 which is a blazing fast server, you’re now running the two tasks in parallel.

You can monitor your spite speed for free with Pingdom, which is completely free and can help you easily determine which elements of your site are contributing the most to your load time.

Website Speed TestThat’s it! In most cases it will take you under 20 minutes to make this entire change and you can easily test the impact of the change and see how your load speed has improved after the fact. Remember, this not only improves the usability of your site but it has been confirmed as a signal in Google’s ranking algorithm so there’s no reason why you shouldn’t be looking for every way possible to optimize your site speed. Now get out there and tune your site for maximum performance!

{ 6 comments… add one }

  • Michael July 21, 2011, 8:53 am

    Using sprites is the best way to handle all the images that make up the design of your site (buttons, arrows, social icons, etc). That way instead of making 30+ requests it only makes one request, and positions it using CSS which has no effect on load time.

    Another area for improvement is in CSS and Javascript files, which are usually formatted for readability, contain extraneous code (#FFFFFF can be replaced with #FFF, etc.) and the like. Run those through a “minify” script and it’ll clean them up and make them much smaller. Consolidating them into as few files as possible is also beneficial just like images, because you are reducing the number of requests to the server.

    Also I find it ironic that Google factors in page load time for rankings, but the things that usually slow our sites down the most are Google products (Analytics, DFP, and AdSense).

    • Morgan July 21, 2011, 9:20 am

      Thanks for sharing @Michael – excellent power-user tips! I’ll definitely be passing this information along to my dev team, sounds like a great way for us to improve load time even more!

  • Michael July 21, 2011, 9:30 am

    No problem, great article. Another thing I forgot to mention is that most images used on the web are much larger and higher resolution than they need to be. I usually go in Photoshop and re-save an image at a much lower quality, usually the human eye can’t even tell the difference, and it can cut file sizes by 50-75%. Of course don’t do that if photos are the point of your site, like beautiful images of a kayak trip or whatever.

    For example, the Pingdom image you have is 64k. I changed it from RGB color to Indexed color and it dropped to 24k. I’m about to email it to you, see if you can tell the difference. 40k might not sound like a lot, but if your site is image-heavy it really adds up quickly.

  • Poor Uncle July 21, 2011, 3:39 pm

    Does Wordpress or one of its zillion plugin can do all of that automatically?

  • Michael July 21, 2011, 4:32 pm

    I’ve used a plugin called WP Minify to compress the HTML, CSS and Javascript. It seems to do a pretty good job reducing file size, but on one of my sites it seems to not compress one of my Javascript files correctly and caused some problems and I had to disable it. I also don’t know how productive it would be because it seems to compress the files on each page load, so the extra processing might not save you much compared to just downloading the full scripts. I think it is much better to minify them manually and just run with that, it’s simpler and faster.

    I use these sites to compress Javascript and CSS:
    http://www.minifyjavascript.com/
    http://www.minifycss.com/css-compressor/

    Below is a very good online tool for compressing images if you don’t have Photoshop. I think the best bang for your buck is setting it to 80%, you’ll barely be able to spot any differences and it usually cuts the file size by 60% or so. If you set it to 90% you usually won’t see any difference from the original image and the file size will usually be cut by about half.

    http://www.stanleyshilov.com/online-tools/image-compression/

  • AndyO July 22, 2011, 4:11 am

    G’day Morgan,

    I’m using CloudFlare (http://www.cloudflare.com) on some non-domaining related projects, and it seems to work quite well, even with the nearest CloudFlare datacenter being in Singapore for our main user base in Australia.

    It works like a reverse proxy, caching html, scripts, and images and pushing it out to users via their homegrown CDN. They also have some beta features like in-line minification.

    HostGator is also a ‘CloudFlare partner’ and has easy integration options in the control panel.

    Google Analytics stats code can also be included on every page that CloudFlare serves up (via some nifty ‘CloudFlare Apps’), saving having to go and add it in via a WordPress plugin, or on basic sites, each individual page.

    While it might not suit all applications, I highly recommend it, and basic plan is free.