10 What makes a great blog header? February 12, 2008 /

Photo by Martin Kingsley

A blog's header is the first thing visitors see when they visit your site. In my opinion, a good header section is one of the most important aspects of a well designed blog. It needs to make an impact on the visitor, both in terms of design and functionality, in order to make them want to see more of your site.

When I began to construct the design for Blogger Buster, I built the header section first, then designed all other elements around this. Setting the tone of a great blog design by focusing on the header first can help all other elements fall into place. So in this installment of the Blogger Template Design series, we will take a look at the elements of a great blog header, and methods we could use to create one.

Some examples of great blog headers

When you come to think of great blog designs, there are probably a few sites which first come to mind. So take a look at these sites now, and focus on the header sections of these designs.

What elements of the header section make these blog designs stand out for you?

Here are some examples of headers in blogs whose design I admire:

Adii.co.za

Skelliewag.org

Ndesignstudio

JohnCow.com

Revolution theme by Brian Gardner

In all of these themes, there are three main features which I consider are essential in the design of a great blog header:

1. The blog title/logo
2. Brand reinforcement
3. Navigation links

Additional features of a blog header may also include a search box and subscription links (indeed, the header is the first place I look for these features when browsing other blogs!).

Why are these features important?

When a new visitor finds your blog, there are three essential things your design needs to convey in a glance:

1. Something striking or unique which will catch their attention and make them want to read on!
2. General information about your blog: what is it called? What are they likely to read about in your posts? Do these messages suggest the reader will find the information they are interested in?
3. How easily readers will be able to find the information they are looking for.

A great blog header should be able to convey all three messages within the space of a few seconds.

Of the examples mentioned above, Adii's blog header is perhaps the most striking in terms of branding and information: strong colors and unusual fonts convey Addi's personality as a designer, while the visual descriptions of his site and status tell the reader exactly what to expect in the content.

John Chow's header is put to great use, illustrating his theme of "making money online" through the image of cash in the header and also the blog description. The navigation and search box quickly help visitors understand how to find the information they need.

There is no reason why Blogger headers cannot look this good too!

Those who are familiar with these blog designs may realize that these are not Blogger powered templates. So let me assure you of one thing: all of the header designs featured here can easily be recreated in Blogger templates!

Using some simple techniques, you can easily create a header section which looks as good as any of the excellent designs featured above.

In the next installment of this series, I will offer you a very easy way to create a great layout for your header section! This layout will include sections for your blog logo/title and description, a search box and easily configurable navigation links. Best of all, you will be able to simply copy and paste the code required for this layout into your blog template, including the sections for widgets which you can configure yourself.

In the meantime, why not get some inspiration for your header design/blog logo, and imagine what you could achieve with your own Blogger blog!