Pages

Thursday 30 September 2010

Website Structure Conventions

All professional websites will follow the same basic conventions. At their purest form it boils down to:
  • A Logo / Header section
  • Well defined navigation
  • Content, using a mix of text and multimedia
  • A footer section
It's important to note that these are not part of good User Interface design, you can have all these elements and still have a very bad user interface. These are the core structures that any website needs to have in order to function fully as a website.

You can see these conventions in place on the BBC news website:

Header Section:
Typically the logo will be situated on the left, in this case BBC News. There may also be a graphic, as you can see on the right in the form of the signifier of the red atlas with the white circles. I feel this works well, as all the most important information and links are placed at the top, along with a Search Form. It makes it easily accessible.

Navigation: 
There are 2 typical types of website navigation. In this case, they have gone for a horizontal format as opposed to a vertical list style element. Horizontal can be used on websites where horizontal space is available, as depending on how many links are required, it can appear cramped if there are too many elements.

Content:
As this is a News website I am using as an example, the content will differ compared to a TV Channel based site. However the principles are the same: Text, graphics and other multimedia must be used in balance with one another. Too much text is daunting and hard to read, especially on a screen, whereas too many images can mean either long load times, poor search engine optimisation and makes it difficult for the ever expanding mobile browsing market. Too many graphics can also mean that explanatory text and meaning is lost in a sensory overload, leaving the user confused or frustrated. 


You can see more intricate conventions on this website here: http://netaccountant.net/website-design-for-accountants/web-design-conventions/ as well as further deconstructions.

No comments:

Post a Comment