Simple Elements to Great Blog Design

Posted on March 5th, 2008. 5 Comments so far. You next?

elephant.jpg

The saying goes, “you must eat an Elephant one bite a time.” I may not have any hands on experience in the matter, but it sure does apply to designing websites. More specifically, weblogs. Designing for a blog specifically usually pins you into some certain aspects that are more or less expected of you. They key is to identify these aspects and make them work together.

You know, like a team or something.

In the Left Corner, The Elements

So, lets get on with this supposed revelation. Team sports may not be your forté, but you can be sure your new blog designs will be picked first for dodgeball this time around. In order of importance:

  • The header. Usually at the top, but who knows. Conditionally will contain important information that must be seen immediately. Logos, site name, a subscription box perhaps, maybe some form of navigation.
  • The content area. This is where you’re going to make your sales. You’ll want this to be some sort of focal point.
  • The sidebar. No one’s saying this aspect is mandatory, but you’ll definitely be the “different kid”. This vertical melting pot for virtually useless information can make or break the design… kind of like any other part.
  • The footer. You may be jumping on the extended footer bandwagon, or just sporting a simple notice to terminate your pages.In any case, you’ll want to at least have one.

Hey, but you knew that. Now to prove the worth of you actually reading this (you’ve gotten this far, right?) I’ll share my designer’s perspective full of generalizations.

Making a Good First Impression

Being a predominantly top left to bottom right reading society, it only makes sense that the first place we’re looking upon arrival is… the top left. Which is convenient, because that’s where your logo is.

This isn’t to say you’re wrong for having it in the center or the right, but you’re not getting 110% out of your first impression if you don’t.

The main thing in the back of my mind when designing this first part of any site is balance. I know there is likely going to be logo or title in the left side, so then I have to come to terms with it’s counterpart.

Assuming you’ve got your logo to the left, you could use the empty space for an advert (for maximum uglification), a search box, navigation links, some design aspect, some important information (your picture, some text, subscription info) or even some sort of quote. The only way to know it’s balanced, is when it looks… balanced. Think teeter-totter.

Making the Sale

This is the personality of your site. Where people can see you, for who you really are. Whether or not that’s a good thing, you want people to want to go right to the main content area right after having a looking around the header. This usually goes on the left. Just because it leads the eye properly, and a lot of people like that. If you say a two column blog with a left sidebar, no doubt it wouldn’t look “right”.

I like the setup the content so that it will sit on a flat colour and the actual posts and their details will do the talking. You can set up all the formatting options you’d like to try and make it look good on a day to day basis with new content, but it’s always a good idea to put some time and effort into the buns of your post.

Buns? 

Think of your core content like a hamburger (or any other sandwiched delight). You have the top bun, which will hold the title and any information you’d like. You have the meat (or 100% no meat processed meat food for vegetarians) which is your post, and finally you conclude with the final bun, containing summary information.

The buns are likely referred to as “post meta” more commonly. Make them work for you.

A Side Order of Fries

While beating the dead horse that is my fast food metaphor, it makes sense that your sidebar would be just that - a side order. Something to compliment, but not steal the show.

Let me put it this way: You want a backup dancer on the side of your page. Looks good, but not that good. People won’t be thinking about the sidebar. You want all the attention for your star - the content.

Make sense? Just blend in, while subtly adding something unique. No one cares about your stupid blog categories anyway. They don’t need to jump of the page.

Beginning of the End

Some people decide that they want a seriously big footer nowadays. This is a bad idea. If something is significant enough to put it on the site, why put it where no one will see it. Maybe that’s what you want. If so, very well played, sir. If not, think about another column.

A simple notice will do. Though cliche, throw in a © and the current year. Nothing special. The footer notice is usually also a credits of sorts.

But, the one thing that drives me mad is imagery in an extended footer, John Chow style. You learned the feather tool and opacity control, good job. Best leave that out of your website. Not to mention these images are almost always off topic and out of context. I digress…

What’s it all About?

For those non-lemmings, this is quite simply about one thing, and one thing only:

Use the elements of a site to your creative advantage.

You’ll notice the best blog designs out there don’t break the mold. They set out to put their mark on the world in their own way, restricted by their market. This is why John Chow doesn’t have an artsy portfolio design (or a… Hmm, better not say that) and why Flash developers don’t host forums on their front pages.

Just imagine you’re a gambler: “Know your limits, play within them“.

4 comments

  • Interesting post, although you mixed in a lot of metaphors in one post which was a bit annoying. You cover the basic elements, although you could have gone into more detail about the sidebar. It’s often used as a dumping ground for things that just distract rather than add to the site. Also what about different layouts for the main page and the individual article? This could mix you elements up a little, although consistency is still important.

  • I purposely filled this post with metaphors, but there wasn’t really a response. I guess I’ll lay off a little in the future ;)

    Different main pages can work, although it’s not usually something used in a personal or smaller site. If you’re putting out a lot of content everyday, a portal style front page can really help organize that. Otherwise, it’s best to stay consistent.

  • It is a good refrence for weblog design.

  • That is some great advice. Great article.

Leave a Reply

1 Trackback