JUser: :_load: Unable to load user with ID: 640

JUser: :_load: Unable to load user with ID: 639

Size, Contrast and Position

Size, Contrast and Position

Size, Contrast and Position are all Key elements to professional website design..

As you know, we only have about 2 seconds to draw people in once they land on your home page. With this in mind a key aspect of web design is to make sure that we get the message across as quick as possible as and highlight the elements on a page that you want them to take note of.


  • Positioning - The most important part to the use of size, contrast and position within your deign is positioning. A computer screen is very different to printed documents. On a computer screen we only have a certain amount of visible space, and although we can scroll the pages up and down we need to maximise the usage of the immediate visible space.

    Due to a number of factors such as that English speaking people read left to right and that the function of a computer screen allows people to scroll up and down; we know that there is a tendency for viewers to scan a website in a certain way.... more often than not its Left to Right and Left to Bottom, left to right. For this reason it’s important we place certain information and design elements in the flow of the eye.

    Another consideration in position is also the fact that the viewer has certain expectations as to where things will be. With over a billion internet users worldwide, it’s important to note that website users have kind of dictated usability and where they expect certain elements and functions to be. An example of this is that most people expect the Company name and Logo to be in the top left hand corner. Its the first thing they see and helps them identify the site and business. In addition to this when it come to usability, most people expect the logo to be a link back to the home page.
  • Size - The size of certain elements of your website is very important to the impact and the usability of your website. But making certain sections within a webpage larger than others, you naturally create greater emphasis and draw more attention to these sections. It’s not rocket science to realise that if you include a larger section on the webpage people will be drawn to that section and subconsciously assume that it is more important than other sections within that page. A great example of this is that most websites will have a larger “hero” images and section at the top to help visually and contextually summarise the product and service offerings.
  • Contrast - Last but definitely not least is contrast. The viewer’s eyes get drawn to elements to that contrast with other elements on the page. On cleaner and white designs the darker or more colourful sections will naturally draw more attentions, thus creating more importance in the viewer’s mind. Contrast can also be created by different shapes and colours. An example of this is by using circles, stars or buttons in a contrasting colour to draw more attention (and often to provoke an action). It’s important that contrast does not get overdone as it can cause confusion and end up having a negative effect as the viewer will have no idea where to look.

The trick to creating a professional website design that will drive the best results is by not only understanding these and many other elements, but even more importantly, being able to work them all effectively into one concept. A professional design will not get pigeon-holed by these key elements, but will creatively work within and around them.

Posted in: Website Design
On: 18 Aug 2010