Everyone’s starting their own site some how, blogs especially. So how big should website headers be?
Display Real Estate
Let’s start by understanding the on screen real estate.
Here’s a screenshot at 1360 x 768 resolution.
That’s what I got from my desktop but typically a notebook screen or smaller sized LCD comes at 1366 x 768 nowadays. Netbooks are always smaller in available screen.
While the screen resolution is 1366 x 768, browser display area is always much less.
Since we’re talking about the website’s header, width is usually not the issue but height is.
After considering the browser interface, in the same that I’m showing – there’s the browser interface, Firefox Extension, the Norton toolbar, the Tabs bar on top on the top and at the bottom, there’s the browser’s status bar and operating system. It’s a typical setup, this is to illustrate how much reduced the display area is.
From top to bottom of the screen, that’s 768 pixels but after accounting all the other items mentioned, there’s only 540 pixels height worth of display area left.
Right and Wrong
I guess by now some of you are guessing that I’m going to say BIG is wrong, SMALL is the way to go………… well, NO.
It’s not the size that matters, it’s how you use it. 😀 Do it with a purpose.
For me, I like small headers (or should I use the word SHORTER) simply because I don’t like to scroll and I prefer my readers view the content immediately, especially those with less endowed monitor, especially those on notebooks and netbooks (horribly small screens are they.)
Small headers, just the name of the site and perhaps and ad or a simple decorative graphic.
As for large headers, take a look at Smashpop and Rames’ 😀
It’s amazing what these artists can do to their blog headers, a prelude to their interesting content. 😀 They even change it from time to time!
What’s Your Preference?
In the end, the header is about your style and preference. Will it be an avenue of expression? Do you have concern over the amount of scrolling to be done by visitors? It’s all up to you – make good use of it.
My thought – if you can’t make a large header look good, stick to the a small header.