Keep Readers Happy With a Fast-Loading Blog, Part One

There are more and more options to add widgets to your blog these days… I'll be posting reviews of some of these services soon, but first I wanted to run a little PSA on how best to use blog widgets without slowing your blog's load time to a total crawl. After all, if the page load exceeds viewers' patience threshold, they'll be closing the page and moving on without ever even seeing your blog bling… let alone actually reading your posts.

The following ideas were inspired by posts at Fred Wilson's blog, A VC. I read Fred pretty much daily, but due to his fondness for testing out new widgets, I rarely visit his blog. He's right there in my RSS reader whenever I want him but I have to be pretty darn motivated to leave a comment before I'll actually wait for all those widgets to load. 'Course, if you have the kind of blog where comments turn into heated discussion, I guess that could be a good thing?

Fred loves widgets. He's got no intention of dropping the toys he likes just because readers complain about the wait. Not that long ago he wrote:

I've heard from a lot of people that my blog sidebars are such a mess they can't deal with them.

It's true that I've got a ton of blog widgets on my sidebars and I think they are seriously impacting the page load times. I am sorry about that.

But I can't help myself. I find cool stuff and I want to play with it and my blog sidebars are my petri dishes. It's the place I get to play with new web stuff.

Fred came up with a couple ways to optimize his blog so that he could mollify his more ADHD readers while still piling on the bling. One of these solutions involved organizing the placement of widgets so the the heaviest bandwidth users load after the posts. His other solution was to create a second blog that mirrors his content, but serves it up fast and clean. Today, I'll explain in the extended entry how to optimize placement of widgets to speed up your blog. Tomorrow, I'll tackle the subject of creating a stripped down second blog.

Just click through to the full post to learn how you too, can keep your readers happy while playing with all the blog bling you love.

How to optimize page loads on your blog by organizing your widgets:

According to a different Fred who stepped up to help Fred Wilson out, the key to using widgets well is to figure out what order the browser is reading your page and move the heavier bandwidth widgets to the section requested last by the browser. I'll crib his explanation as posted on A VC because I think it explains the situation well:

The thing causing the slow page load is the amount of widgets running on both sides of your page (particularly on the left). The way things are coded in this blog layout, content is read (by the browser) first down, then to the right. This means, the browser needs to load all the widgets on the left, then your content, then the widgets on the right.

So the solution is easy. If you have a two column blog with the sidebar on the left, consider changing your layout so that the sidebar is on the right. That way, your posts load first and your widgets can load at their leasure while visitors read your posts. If you have a three column blog, then try moving the slower widgets into the right-most column.

Not sure which ones take the most time to load? The simple, but less than scientific, method is to visit your blog and see where it hangs up. Video widgets, bling that plays music, flickr photo galleries, etc. are likely to be the slowest to load because they're loading larger content.

Fred Wilson also recommends a Firefox plugin called tamperdata, which can show you the resource requests a page makes while it's loading. I have not installed and played with it, so I don't have my own opinion. I do recommend reading the warning page for the plugin, since it seems that there are a few ways it can crash your browser if you're not careful. If anyone has suggestions for similar services, plugins, etc that can help to analyze page loads, please leave a link and description in the comments.