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

I love the way that widgets have started to really extend the capabilities of what can be done with a blog. I especially like the fact that most of them make it really easy for even the most non-technical bloggers to add content. But many widgets are pretty heavy on the bandwidth… Add more than a few of these and you may find that your readership goes down as people get frustrated by waiting for the page to load.

Yesterday I posted some advice on how to organize the widgets on your blog to improve load speed. The idea was inspired by a post at Fred Wilson's blog, A VC. Today, we'll look at another way to serve up speedy posts to your hungry readers.

The simplest solution is to encourage your readers to subscribe to your blog's feed and read your posts in RSS… But of course, when they do that, they don't see your nifty widgets at all, nor any of the rest of the site design you've worked so hard on. Also, not everyone understands RSS (for a truly brilliant explanation, you might want to put a link to How to explain RSS the Oprah way below your subscribe button). Additionally, not everyone who wants to read one post is going to want to read them all… So offering a subscription is not the solution to all ills. I get quite a bit of traffic from people who are searching google for very specific information and they probably just want to see what they came for, like, now.

This is where it might come in handy to create a second blog with all of your recent posts but none of the bling. The hacks described in the extended entry of this post will show you how to create a fast-loading blog that matches the overall design of your blog while stripping out the slow bits. As an additional benefit, I would guess that creating a blog-lite version will probably help your search engine placement, so long as you don't abuse the idea.

Just click through to the full post to learn how you too, can keep new readers happy with quick loading posts.

Technorati Tags: blog, blogtools, typepadhacks, web design, web2.0, weblogs, widget

How to create a fast-loading secondary blog:

Fred's second solution for slow page loads is a little more work to set up, but is a really great idea: He created a second blog that mirrored his content. FastAVC has all the posts with none of the bling. Smart. When I surfed over to check it out, I noticed right away that the URL for FastAVC shows that it's actually a FeedBurner feed dressed up to look like a blog.

It's not just the standard BrowserFriendly feed, because it has styles applied to it to make it look like Fred's regular blog. I took a quick look at the source code and couldn't figure out how he was pulling this off, so I headed over to the FeedBurner Forum to find out. Rick answered my question with the following:

We have a commercial publisher front-end to FeedBurner-hosted feeds called FeedFoundry, and one of the features of FeedFoundry is the ability to create custom XSLT pages that will style a feed. This isn't something available to feedburner.com users at this time.

Now, if you have a huge blog empire and you're making some serious cash, I suspect you can easily afford to sign up for FeedFoundry… Follow the link and go get your blog(s) hooked up. But if you're on a budget, you still have options for sending your readers to a lighter version of your blog. At least two come immediately to mind.

Option one is the easy one and requires no coding or template hacks. Just point your readers to the BrowserFriendly version of your feed (assuming you are using FeedBurner to serve your feeds). You won't be able to display your blog with custom styles or colors, but readers will be able to read all your recent posts (including embedded media). Just put a link at the top of your left column where it will be the first thing to load, and impatient readers can head straight to it.

Option two is pretty easy also, but requires you to have a TypePad Pro account so that you can use advanced templates. What you'll want to do is create a copy of the index page and sidebar templates for your blog based on your current design, and edit out the items that slow down load speeds. There are good instructions that explain how to create additional index pages in the TypePad Knowledge Base, but I'll walk you through the specifics here as well. Note: It's a little easier to do this by keeping a few tabs open in Firefox as you work.

1. Go to the Design tab for your blog. Click on the link for your sidebar and copy the code.

2. Click on Create new index template as shown in the image below. When the new template page comes up, there will be three fields for you to work with. The Template Body field is where you will put your code. The Template Name is a meaningful name for you to remember which template it is. The Output File is the name of the file that will be created. The output file name is used in the URL for the page, as http://example.typepad.com/weblog/mypage...

3. Paste the code you just copied into the Template Body field. You'll need to know which Typelists or code snippets are the slower ones, but that shouldn't be too hard to figure out. Remove those items from the code, but go ahead and leave in things that you really want to keep such as your contact info, subscriptions options, etc. Name the template something like "fastsidebar." In the field for Output File, type fastsidebar.inc. Click save. Click Publish.

3. Navigate back to your Design Tab. Copy the code for your Main Index Template. Click on Create new index template again. Paste the code you just copied into the Template Body field. This time, you'll want to make a few more changes to the code.

1. Change the Title tag from Blogname to Fast Blogname (or however you'd like to distinguish the page).
2. Scroll down until you see the line that brings in the sidebar . Replace the name of the original sidebar (sidebar.inc) with the name of the new speedy sidebar (fastsidebar.inc)
3. Optional: Right above the tag that brings in your posts, , you might want to include a little message explaining that this is the fast version of your blog. I used the following message:

   Hi! This is the widget-free version of TypePad Hacks for those who like a faster-loading blog!

Name the template something like "fastblog." In the field for Output File, type fastblog.html. Click save. Click Publish.

Now all you need to do is link to this page somewhere near the top left of your regular blog. To see an example of how it would look, check out FastTypePadHacks.