Constructing a website banner - a case study

The importance of the banner

When you load a web page for the first time, the page banner is immediately visible in your browser window.  It's usually the first thing any visitor sees.  And that makes it very important.  Recent research indicates that people make up their minds about a website within 50 milliseconds of it opening: that's one twentieth of a second.   A news article in Nature reports on this work: see Web users judge sites in the blink of an eye (http://www.nature.com/news/2006/060109/full/060109-13.html ).

The Nature article says in part: "The lasting effect of first impressions is known to psychologists as the 'halo effect': if you can snare people with an attractive design, they are more likely to overlook other minor faults with the site, and may rate its actual content … more favourably."

So building a good banner is a very important step in the designing of a website, and an ugly one can be a disaster.  What constitutes "ugly" can be a matter of debate, but there's no mistaking an amateurish banner.

There are a number of factors that need to be considered in designing a banner.  These include aesthetic elements such as:

• the colour scheme
• the graphic elements
• the wording and fonts

And then there are the technical aspects.  Poor graphics look ugly.  Badly blended images and jaggy text or badly chosen fonts suggest an amateurish design.  A large slow loading image file irritates everyone.

Some people like Flash for banners or complete Flash home pages.  They can be great eye-candy, but does the visitor want to sit and watch it unfold?  Probably not - it depends of the site.  As the Nature article goes on to say, "for a typical commercial website, 60% of the traffic comes from search engine results".  It's a simple matter to use the back button to get back to the list of search engine results and go off to another site.  Your client won't thank you if this happens with your design.

Personally, I don't use Flash for or in an introductory page because it's easy to irritate some visitors before they get into the site.  I also try to keep the graphic load times down as far as possible.  I want the visitor to see what they're getting as quickly as possible, and to please them with what they see.  Lofty goals, and not easy to achieve.

Obviously there's a balance to be struck between the intricacy (and beauty!) of a page design, the size of the graphics used to achieve the design, and the resultant download time.  A total of 50KB is a good rule of thumb these days for total entry page content file size - graphics, code and text.