How to build faster loading websites

During the 1980s and 1990s, technology resources were precious. Programmers would eke every byte out of available storage space – nothing was wasted.

When it came to early online networks such as Compunet, deathly slow modem speeds meant efficiency had to be the watchword of the day. Uploaded programs would be compressed to within an inch of their lives to ensure they could be downloaded as quickly as possible. Interfaces were fast, obvious and efficient, to ensure no one's time was wasted.

When the web first became popular with the masses, savvy designers adopted this philosophy. With connection speeds still sluggish, every trick was used to try and speed up websites: heavily compressing images and reducing them in number; removing white space; making scripts as efficient as possible.

The aim was always to retain visitors with itchy fingers, who were increasingly likely to go elsewhere on a whim as the number of available websites grew at an alarming rate. Yet somewhere along the way, this line of thinking has been largely lost. Today, many designers have become a little lazy when compared to the medium's pioneers.

With broadband almost ubiquitous in many countries, optimisation has fallen by the wayside. Many now assume they can throw anything they want online and it'll be downloaded 'quickly enough'. But when you step back and look at many current sites, a 'good enough' approach often isn't good enough.

Just a lag of a few seconds might be all the encouragement a restless visitor needs to go elsewhere, potentially losing your site a sale. And in an age of broadband, it's absurd that some sites shove loading delays down your throat akin to (or even worse than) those suffered users during the late 1990s.

This article aims to address this concern. It's time to bring back the old rallying cry, and to make sites fast again, using a mix of tried and tested technologies and methods. Plus we'll also discover some new kids on the block that can help make your online creations more efficient with surprisingly little effort.

The need for speed

Although the majority of efficiency tips rely on technology – compression, server tweaks, coding – speed isn't all about how quickly something downloads. There's also the perception of speed and efficiency. You might have the fastest site in the world from a technical standpoint, but that's all for naught if it's tricky to get to grips with.

In other words, if it takes time to figure out how to use your site, a user may well believe it's slow regardless of other factors. Conversely, if your site is straightforward, a user is more likely to think it's fast – and that's half the battle won. In other words, before you start fiddling with software, compression techniques and hosting, take a look at your website itself.

Is it obvious to use? Is the navigation efficient? Is the copywriting punchy and succinct? If not, rethink. Reduce the amount of content and consolidate where possible. For example, plenty of corporate sites retain dated 'about us' sections split into sub-sections, but when a user accesses a few web pages in a row, each of which has just a few lines of copy that looks lost in an otherwise largely blank screen, they're going to feel like they've wasted their time.

When it comes to navigation, ensure everything is labelled in an obvious manner. Punch yourself repeatedly in the face should you ever consider lead-in animation on navigation components that forces people to wait before they can access content. Look at how your pages are laid out, and ensure the eye can easily move about the page.

Users shouldn't struggle to read text, and it should be evident which elements of a page are separate. Make use of inline links to enable users to rapidly navigate to content that interests them. And if your site is large with a relatively complex hierarchy, ensure that users can access important content from the homepage, rather than having to manually drill down and search it out themselves.

Once you've streamlined the design, navigation and page structure, it's time to get more technical to speed things up. Broadly speaking, technology tips for speeding up sites sit in three areas: media content, coding and hosting. I'll cover each of these in turn.