Preloading images is a web optimization technique that has been around for years. Predominately this has been used to load images that aren’t visible when a web page is initially loaded, but become visible after some sort of visitor interaction, such as hovering over a menu.

Preloading the right content under the right circumstances, can have a positive impact on your web sites user experience. In this article I’ll provide examples where preloading content will have tangible benefits, and link you to resources that make preloading simple.

Example Usage #1: Predicting Visitor Navigation

When it is possible to “predict”, the next web page a visitor will most likely navigate to next, you can asynchronously load and cache that page and it’s images behind the scenes. When the visitor follows a link to this page, there is zero wait time. On the NYTimes Home Page there are thumbnails and excerpts for it’s most current articles. It places these articles strategically based on their importance. They could also preload these articles in order based on there respective importance. This was when users wants to “read more” than the excerpt, the full article is already loaded and cached, and there is absolutely no waiting.

Example Usage #2: Preloading Secure Content

Let’s analyze a web visit to Hotels.com. A potential customer is interested in taking a vacation to Hawaii. They search Hoteles.com, filtering through pages of hotels, reading reviews, until they finally find the hotel that is in the right place, is the right price, and has availability. They click the checkout button which now takes that visitor to a secure checkout page. This is a very expensive and slow process because of:

  • Overhead from the initial SSL handshake
  • All Images, JavaScript and CSS must be re-fetched from a secure location
  • All content is delivered encrypted adding additional bandwidth overhead

What do you think this visitor is thinking about while they are waiting for the web page to load? If they are anything like me, they might think “Can I get a better deal”, and then jump back to Google and see if their intuition was right. Worse yet, if this was about to be an impulse buy, they might just close their browser and go to bed. The bottom line is if Hotels.com preloaded all their secure content, they would increase their conversion rate.

JavaScript Library

Coming Very Soon!