I was chatting to a veteran print publisher, who had been producing magazines for over thirty years.
He shook his head in despair, as he told me that every year he sees new magazines hit the newsstands with the publications' titles placed vertically on the magazine cover.
"Whenever I see this," he said, "I know it has been produced by a new publishing company that does not understand the industry. quickly to survive. The market has taught us this lesson hundreds, if not thousands of times, but still people make the same mistake. "
This message is just as relevant to website layout as it is to magazine design. The web has been around for long enough that rules and best practice have emerged from years of trial error by thousands of website owners. You can either go with the flow and be grateful that you can learn from the experience of others, or you can swim against the tide and try to convince the market that you are right and they are wrong.
I would suggest that swimming downstream is far easier and will give you a much greater chance of success.
To understand which layouts work you only need to look at the industry gorillas. These are the online content publishers who have been around for years, and who have tested just about every layout combination. Good examples are some of the most read websites on the internet including:
– BBC (www.bbc.com)
– The Financial Times (www.ft.com)
– The Economist (www.economist.com)
– The Wall Street Journal (www.wsj.com)
You will quickly start to recognize elements of the page layouts which are common across all these sites. Just as with print publications and magazines, these are the layouts that have proven to sit most comfortably with the reader and with the way online users want to consume content.
The key design and layout elements which should remain constant are: Masthead across the top – the masthead is where the logo goes and usually imagery that supports the subject matter on the website.
Left hand column should contain all the primary navigation, which should remain constant across the whole website. It should list all the main categories of the website, so users can find their way around from every page.
Right hand column on the homepage should provide navigation to individual pages in the site which you want to highlight. Or it can be used for small applications, such as email newsletter sign-up, scrolling news headlines, links to the forum, etc. This column tends to disappear on the content pages to leave more space for the article and images.
Top menu bar – some sites have most of their navigation in the top menu bar which goes across the page under the masthead (take a look at http://www.guardian.co.uk or http://www.forbes.com as examples). I do not like this for two reasons. First it restricts the number of menu links that you can have. Second it usually means that the site has flash …