Understanding Website Design Part 1.

website design and layout is a complicated business, isn’t it?

Well, that’s what most of us believe. The thing is it doesn’t necessarily have to be that way: there are certain principles that even you or I could grasp. Admittedly, some of the more complicated elements of the layout are probably best left in the hands of the experts, like the use of cascading style sheets (CSS) and XHTML language: the rest though isn’t really as difficult to fathom as you may have imagined. There are 10 basic rules to website layout: these are generally used by all successful websites. In part one of this article, we’ll look at the first 5 key areas – basic website elements, branding and logos, design, the use of information and the use of colour. In part 2 we’ll examine the other 5 remaining elements: the essential elements of a home page, focal points, line heights, font sizes and the use of white space.

Website design, to use the old cliché, isn’t rocket science:  nearly all successful websites use the same basic elements in their design. These are, if you’d like, the skeletal structure on which the rest of the site is built.

Basic shared website elements

  • Headers

    : these always contain the logo, the tag line and occasionally the navigation.

  • Navigation

    : this is an essential part of any website and gives the user clear instructions on how to move through the site. Sometimes this is contained within the header itself, but can also be horizontally above or below it. By and large the standard convention is to align it towards the left hand side of the page.

  • Content and body

    : this is the most crucial part of every website. It’s why users come to visit the site and contains all the pieces of information that make your website what it is. Content is definitely king.

  • Footer

    : this final element usually contains all the copyright information, links to the main pages on the site and external links to other websites that are part of a company’s network.

Logos and branding

Logos and brands play a crucial role in website design. They are a key element in making your website stand out from the competition. They need to be unique and memorable. Logos can either be graphic marks/symbols, or emblems that aid and promote public recognition. They can be purely graphic, like the Red Cross emblem, or may include the company name or initials –like IBM.

Branding helps websites to market specific products or services. It is important because it not only establishes he identity of a product, but also conveys the personality behind the product and how this relates to its customers and stakeholders. All branding is designed to reflect a certain set of values, whether that be on a local or global scale.


They say that beauty is only skin deep, and what really matters is what’s underneath. Well, that may be true, but website users can be a fickle bunch. Personality might be more important than looks in life, but it doesn’t apply for websites. Looks are everything. Website design needs to be both compelling and visually attractive otherwise users will switch to another site. Any company wanting to establish any sort of professional credibility needs to have a visually appealing and dynamic website. Poor design can convey unprofessionalism.

The use of information

Is it ever possible to have too much information? The answer on a website is definitely yes. There’s absolutely no point cramming every available fact and figure on a webpage, let alone adverts and images. Too much information only leads to distraction, and that in turn leads to user alienation. This is precisely what websites want to avoid. Websites and web pages should convey just the essential information and content that is relevant. All other unnecessary distractions should be kept to a minimum. That shouldn’t be taken as a cue to put scant content on a website though. Users seek information; therefore websites need to provide it. The trick is in getting the balance right.

Colour schemes

Colour schemes are vital elements of successful website design. Get them wrong and you’ll put visitors off: get them right and you’re on to a winner. So what makes one colour scheme better than another? Unfortunately, there isn’t a simple answer to that. There’s a myriad of colours out there to choose from, and each person responds differently to colour. If the choice of colour ways is too daunting, you can always pay for a colour scheme application like Colour Schemer Studio:  the beauty of such an application is that it will do all the work for you and either build a colour scheme based around just the single colour, or build monochromatic, complement, split complement or analogous harmonies based on the colour of your choice. If you prefer not to pay for the privilege, there are a number of free applications that can be downloaded to make your life that little bit easier.

View our portfolio


Speak to us