12 Ways to Speed Up Your Site (and why it can’t wait!)

Roadrunner had it right. Strategy and tactics only go so far. That’s why Wile E. Coyote never stood a chance. It takes speed to win the day. The same is true of websites. Your customers and prospects have better things to do than wait around for web pages to load.

That’s why, more than likely, your competitors are already heads-down shaving milliseconds off the load times of their web pages. It doesn’t matter that you’ve got a better price and a glitzier interface to boot. If your rivals can serve up the goods faster than you, you will start losing business to them.

Faster is ALWAYS better, and user experience is what it’s all about. Or almost all. There’s another reason you need to get a move on. The Google team is up-front about the fact that site speed helps determine search ranking.

So stop dilly-dallying. You need to get up to speed as fast as you can! Get started right away by zipping through the following 12-step program:

1. Lighten up.

Hypertext Transfer Protocol (HTTP) is the set of rules a web browser follows every time it retrieves content. Stuff like image files and extraneous code takes time to download. The more you’ve got, the slower it goes. So if your pages happen to be loading slowly at the moment, no need for the long face. You just need to lighten up!

2. Put stylesheets where they belong, in your head.

It’s not brain surgery. In HTML, the head of your web page is where basic info like the page title is stored. A stylesheet is code that describes how your web page will display on screen. If you place a link to the stylesheet in the head, the browser starts displaying content as soon as it gets it. By linking to your stylesheet in the head of the code, browsers can cache it, storing it in the background so the data will be served up faster for visits to other pages using the same stylesheet. Bingo!

3. Clean up your code.

Your content management system or publishing tools may include excess code, and the whitespace between the code on your page source can gum up the works. By cleaning up your code, removing extra characters and spaces, you can reduce the total size of your page a gazillion bytes. Minimize and minify. It may not be glamour work, but it’s gotta get done.

4. Give your JavaScript a good, swift kick in the pants.

You don’t need to embed your fancy JavaScript in the page code itself, so why do it? Put it into separate .js files where it can wait patiently in the wings, ready to go when it’s needed. No need to have it hanging around all the time, taking up space and getting in the way!

5. Reduce iFrames.

Sure, iFrames are a great way to load pages and snippets of code dynamically, without heavy-duty programming. But when it comes to iFrames, less is more. They can slow down your web page load time, big time! When in doubt, throw them out.

6. Stop kowtowing to Flash.

Flash can be problematic. Sure, Flash can be impressive. But more often than not, it’s more of a show-stopper than a showstopper. If you need to use it at all, use Flash in moderation, as a component within the page. Get on with the show!

7. Don’t forget that cookies have calories.

Eliminate unnecessary cookies, and keep ’em as small as you can. Set the date to expire so they can do so gracefully. Exercising restraint with cookies will reduce your waistline, and your load time!

8. Configure server caching.

Configure caching on your server. There are a number of tools and plugins to help you do what needs to be done. For example, check out W3 Total Cache for WordPress, JotCache for Joomla and Memcached for Drupal.

9. Separate website servers from databases.

If your business depends on large databases, consider placing them on a separate server from your website. Database transactions suck up server resources like nothing else. Your website and databases will be happier apart. It’s for the best!

10. Get a hosting service with more OOMPH.

Invest in a robust, reliable hosting service. Go on the cheap and you’ll have to compete with other sites for bandwidth. As if you didn’t have enough competition already!

11. Reduce image size, but remember that one size doesn’t fit all.

No two ways about it. You gotta reduce image file size, and use the kind of compression best suited for the purpose. For example, while JPG is a standard that may degrade detail just a bit, it’s great for images with lots of colors. PNG and GIF work best for line art and images with fewer colors, but the PNG format offers a somewhat broader range of colors than GIF.

Be sure to resize images before you upload them. Don’t resize images using height and width in the HTML code. Use Photoshop or whatever else you’ve got. Forcing people to download a 1,000-pixel-wide image to fill a 150-pixel-wide thumbnail is just plain cruel. Discover your kinder, gentler self.

Keep images and any other files under 25kb whenever possible. The main reason is the iPhone, which won’t cache uncompressed files larger than 25kb.

Last but not least: give image-lazy loading a shot. Image-lazy loading is yet another clever way to speed things up. With this technique, the loading of images that will appear below-the-fold is delayed until the user scrolls down. The initial page load happens in the blink of an eye. How cool is that!

12. Don’t rest on your laurels, test load speed regularly.

Your work is never done. You gotta test, test and retest. But don’t worry, there are plenty of tools available that reduce the drudgery. For example, try out Google’s Page Speed, Yahoo’s YSlow and Pingdom Tools. Hallelujah!

Hope you stuck with the program and found the above pointers helpful. Our goal is to lighten your load and speed up your website. As Roadrunner would say: “Meep, meep!”