Do You Make This Mistake With Your Blog Header?

I see this mistake being made time and time again, and it’s costing you traffic.

However, you’re not making this mistake on purpose. Rather, it’s partly the fault of wordpress, and partly the person who designed your wordpress theme.

Here’s what it is – your site’s header takes up too much space. n.b. by ‘header’, I include any and all stuff above your post’s headline.

3 reasons why the size of your header matters

1. Too many distractions

   The larger your blog’s header, the more stuff there is to distract your visitor’s eyeballs from what they want, which is to read the content you have promised them.

2. If you force a visitor to scroll, you lose them

   The larger your header, the more of your content you push below the fold of your page. Thus you have less space to convince a visitor to continue reading your post. Fact: far more visitor’s choose to click the back button than click to scroll down your page.

3. Site header blindness

   You’ve heard about how the average internet user has instinctively trained themselves to filter out ads on a web page? It’s the same with your site header. Initially, your visitor is not interested about what your blog is called, who you are, and what your blog is about. First and foremost they’ve come to your page to read the info contained in your post. So the moment they land on your site, their eyeballs are seeking out that content, and they are blind to everything else.

Follow these steps to see if your site’s header is optimal

1. Go fetch a ruler from your desk.

2. Measure (on your screen) how far your post’s title is from the top of the page.

• Up to 4cm = Ideal
• 4-6cm = Acceptable
• 6-8cm = Just about acceptable, but can be improved
• 8cm or more = Too big, consider reducing

It’s not your fault

Wordpress itself is most at fault. By default wordpress calls up your site’s name and its tagline before it calls up your post’s content. To make the problem worse, wordpress themes have evolved to make these elements the biggest and the boldest elements on your page. And the vast majority of bloggers spend far too much time tinkering with their site’s header to make it look good. It’s become the norm, but that doesn’t make it right.

Here’s what I did:

The distance of my post’s title to the top of the page is 3.1cm, which is within the ideal header height.

The best space-saving tip I have is to put your navigation menu in line with the title of your blog, and to forget about using a tagline (nobody reads it).

If you use Thesis theme like I do, then you can do this by adding the following lines of code to your custom functions file:

remove_action('thesis_hook_before_header','thesis_nav_menu');
add_action('thesis_hook_header','thesis_nav_menu');

You’ll then need to play around with the CSS to make it look cool.

Note – there is another solution. You can now download the very theme you are seeing right now, to use on your own blog. Go here for more.

It’s simple tweaks like this that can take your blog from good to great. Don’t let your blog design get in the way of your blog’s content.