Monday, February 27, 2006

Speeding Up Your Blog

BlogTipsBasilYou ever have a problem with your blog taking forever to load?

Of course you have. And so has everyone else.

And I wish I could tell you a secret to make your blog always load fast, but there is no such secret.

But there are some things you can do ... or avoid ... to help your blog load faster.

First of all, let's look at some of the most common reasons that sometimes a blog might take a long time to load.

It could be that you have too many or too large images loading. Also, third-party content can slow you down. One other thing is that you may have your code loading in a bad order.

Slow All The Time

If your blog is always taking a long time (remember, "always" means "always" not "sometimes"), it could be that you are on a slow server. And if that's the case, you need to change servers. Sorry.

But, it might not be your server. Probably isn't, in fact. It might be that you have some large files on your home page. Do you have a really large graphic? Or a multimedia file like a Flash or QuickTime or other such? If so, that might be your problem.

Check the filesize of the images or media files. Lots of people are using PNG files for graphics today. And while they are fine, they can be larger than GIF or JPG files. And the larger the graphics ... and the greater number of graphics ... the longer it takes for a Web page ... including blogs ... to load.

If you have lots of files ... or large image/media files ... re-examine if you want or need them. If you do, you do. And you have a slow-loading blog. End of story.

There's another common problem that can slow things down, but it's related to the the occasional slowdown more often that the all-the-time slowdown.

Slow Some Of The Time

If your blog loads fine most of the time, but sometimes is slow, the problem is likely off-site (or third-party) content.

What's that you ask? No, really. Go ahead and ask.

I'm glad you asked.

Third-party content can be things like, say, Site Meter code. Or Blogrolling.com's blogroll code. Or TTLB Ecosystem code. Or "who links here" kind of code. It can also be HaloScan code. It could be BlogAds, or Google AdSense code. It could be Day By Day cartoons.

Bottom line is third-party content can be any code you've added (or used a wizard to add) that gets stuff from another site. Now, Site Meter isn't usually the culprit, although it can be. HaloScan is rarely at fault, either, though it can be. But Blogrolling.com, while quite useful, is more likely than those to slow you down. And TTLB Ecosystem code will hang you up on occasion. In truth, any third-party code can.

And, when a browser goes to display the page, if it encounters a slow section of code (such as third-party code), it doesn't show the next part until that part has finished loading and displaying.

So, What To Do About It?

The only way to be certain that third-party code doesn't slow you down is to not use it. I'm not recommending that. Lots of that third-party code is very, very useful. If you can do without it, that will help. But there's one other thing you can do.

And you might want to sit down for this. And grab a note pad. And some aspirin.

New Blog Order

How your code is ordered can make a difference.

Okay, some of you are saying "What the...?"

But here's the deal.

Web pages (including blogs) are delivered to your browser (Internet Explorer, Firefox, Netscape, Opera, Safari, etc.) when your browser requests a page.

The server running the blog fulfills the request by sending out the code that causes the Web page to show on the browser. When the browser gets the code, it puts it pieces of the code it gets together and displays the page in the order the code appears.

Now, the order of the code might not be the order of the items on the page.

Think about that for a minute.

Traditionally, items appear on the page in the order they are in the code, but that's not as true as it used to be. And it doesn't have to be true.

Of course, it's always easier for the code to be that way. Easier as in it doesn't take as much time to code.

But, sometimes, it's better to code it differently.

If you're relying on others to write the code for you, they should know this and should be taking it into consideration.

If you're using pre-defined templates, they should take this into consideration, but don't always.

If you're writing your own code, or using code someone else wrote, keep this in mind.

What's It All Mean?

The most important part of your blog is your most recent post, followed by the rest of your posts, followed by the stuff in the sidebars and footer.

And that's the order your code needs to appear, whether or not it appears in that order on the page.

For instance, if you have a sidebar on the left, then your posts, then maybe a sidebar on the right, your code doesn't have to be in that same order. In fact, it shouldn't be.

Your code should have your main content, usually in a DIV tag with the ID of "CONTENT" (or something similar), in the code first, whether or not it's on the left side of the blog page.

That's one of the most important things you can do: have your main content in the code ahead of the rest of the stuff. In the BODY section, of course.

As for the third-party code that's usually in the sidebar, put it as far down as you can and still get use of it. But the most important part is done, if you have your main content DIV appear ahead of the sidebar DIVs.

But That Doesn't Speed Things Up!

Now, while this won't actually speed up the loading of your Website (or blog), it will keep the main content from being delayed.

In other words, the most important part, your most recent post and posts, will display quickly, because it's coded to display first. Any slow third-party code in the sidebar (either on the left or the right) will still take long to load, but the delay happens after your main content has already displayed.

The page still might take a long time to load, but the damage is minimized.

So, What Do I Need To Do?

Well, this very situation arose at a friend's blog. Over at aTypical Joe, Joe rearranged the look of his blog. But he ran into a problem with his blog taking a long time to load.

Joe's old blog layout had a sidebar on the left, then the main content, then a sidebar on the right. And his code was in the same order.

Joe's new blog layout has his main content on the left, then two sidebars on the right. But he didn't reorder his code. He simply modified his stylesheet to change the display positions of the columns.

But when he moved the sidebars positions, he added some new code to the left sidebar that caused things to slow down. Remember, he didn't reorder the code behind the scenes. He just repositioned the columns from Right-Sidebar, Main, Left-Sidebar to the new order of Main, Right-Sidebar, Left-Sidebar.

Since the behind the scenes had the Right-Sidebar in the code first, it held up everything afterward, including the main content. And that was the problem.

So, what Joe did was to move the code for the Main section to the top of the code. Then, he moved the Left-Sidebar code to the end, after the Right-Sidebar.

So, his blog now displays the Main content first, then the Right-Sidebar, then the Left-Sidebar. If the code in the Left-Sidebar slows things down, his main content still displays before the slowdown affects things.

Joe's moving of his DIVs around helped his situation tremendously. Perhaps you can benefit from that experience too.

8 comments:

  1. Thanks buddy! Just what I needed. It's the TLB code mostly I've noticed, and my sidebar is loading first before content, so I will be fixing that tonight.

    ReplyDelete
  2. Thanks Basil! I put a bunch of ads in that center sidebar (and made a whole 37¢ so far!) so I have them load last. The site loads much better now. Jo, I've had the same experience with the TLB code.

    These tips are a great feature Basil! If the mood ever moves you, I'd find one on advertising helpful.

    ReplyDelete
  3. [...] Basil has some great advice about problems with slow loading blogs. [...]

    ReplyDelete
  4. That's awesome! I was wondering if there was some way to do that... Thanks!

    ReplyDelete
  5. TTLB is the second to last item on my right sidebar. All blogrolling.com code precedes that. My page loads superfast - until it tries to load TTLB script. Great suggestion. I was thinking just along those lines when I decided to make those items last.

    ReplyDelete
  6. A little late to the party, Sir, as usual, but let me be the 5th, or 6th to thank you for this post. VERY informative as are all of your "how to" posts. Appreciate it very much :-)

    Blog ON!

    ReplyDelete
  7. I tried to move the code around to get the side bar to load last and oops, messed the whole thing up ... but at least moving TLB toward the bottom of the sidebar had sped things up a bit.

    ReplyDelete
  8. This topic is the reason for the change in template to this little blog. The template I was using didn't support a feature I wanted, so I went with a simpler template, and rearranged things to follow my own advise. The dropping of the blogrolls to the bottom of the sidebar has given an appearance of faster loading. Using a different TTLB code has caused faster loading.

    ReplyDelete

Please choose a Profile in "Comment as" or sign your name to Anonymous comments. Comment policy