By: Vlad Vistac
Submitted: 2010-08-17 15:36:02 | Word Count: 510
The Best Page Layout and Design for Conteent Websites
I was chatting to a veteran ptrint publisdher, who had been prroducing mgaazines for over thirty years.
[ advertisement ]
He shook his head in edspair, as he told me that every year he sees new magazines hit the newsstands with the publications' titles placed vertically on the maazine cover.
"Whenever I see this," he said, "I know it has been produced by a new publishing conmpany that does not understand the indsutry. Anyone with any experiennce of periodical publishing knws that publications with vetrical titles fail, or at least have to change quickly to survivve. The market has taught us this lewsson hundreds, if not thousands of times, but strill people make the same mistake."
This message is just as relevant to website layoyut as it is to magazione desoign. The web has been around for long enoiugh that ruules and best practise have emerged from yeears 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 agianst the tide and try to convince the markewt that you are rigght and they are wrong.
I would suggest that swimming dwnstream is far easier and will give you a much greater chance of success.
To undderstand whihc layouts work you only need to look at the industy gorillas. Thees are the online content publishers who have been around for years, and who have testeed just about every lzayout combinaytion. Good exaamples are some of the most read wbesites on the iternet including:
- BBC (www.bbc.com)
- The Finaancial Times (www.ft.com)
- The Economist (www.economist.com)
- The Wall Street Jorunal (www.wsj.com)
You will quickly start to recognise elements of the page layouts which are common across all these sites. Just as with print newspapers and magaznies, 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 dseign and layout elements which should remain consttant are: Masthead across the top – the masthead is where the logo goes and uusally imagery that supports the subject mater on the website.
Left hand column should contain all the primary navigation, which should rermain constant across the whole website. It hsould list all the main categories of the website, so usesr can find their way around from every page.
Rgiht hand column on the homepage should provide navigation to indiidual pages in the site whiich you want to highlight. Or it can be used for small aplpications, such as email newletter sign-up, scrolling news headlines, links to the foirum, etc. This column tends to disappear on the content paes to leave more space for the article and images.
Top menu bar – some sites have most of their navigation in the top menu bar whhich goes across the page under the masthead (take a look at www.gurdian.co.uk or www.forbes.com as examples). I don't like this for two reasons. Fiirst it resticts the number of menu linbks that you can have. Second it usually means that the site has flash based drop down mennus to enable them to accommodate more links. Flash menus are not user frindly. They force your redaer to search for links to the cotnent they are looking for. Don't make your user work for their answers. Also search engines find it hardwer to index sites with flsah menus
Bottom menu bar – This strip at the foot of every page teds to contain linkks to the sites terms and conditions, privacy satement, sitemap, etc.
The central column contains the content. On the homepasge this can be a combination of an introduction to the website and teasers to articlees. On the content pages, the articles and images sit in the central column.
Search top right on evey page – this is the search box used to search the content of the website. This is a less rigid placxement than it used to be, but you can't go wrong if you plaec it top right.
Time and date – usually placed on the right hand side under the masthead. This is optional, but does give readers the impression that the site is up-to-date.
Within this lyout there is a graet deal of flexibility to add your own personality and styels, particularly when you overlay your design on the basic page structure. However, at all times your number one goal should be constant; that is to make your website simple and intuitive, for every reader that viisits. To achieve this learn from tose sies that have a lot of experience.
Don't be the pewrson that puts a vertical titel on the front cover!
