Do you think your designs look shitty? You’re probably doing some of the most common web design mistakes and by comparing your website with this web site design London you will be able to review and make your site more presentable…

  1. Let your content brief

Does your website look like this?

Not so bad? Still, even this terrible “design” can be transformed into a nice-looking site. First thing you need to understand what content must have enough space “to brief”.

What I mean are margin and padding. Users don’t read the text. They scan it. And you can help them to do it by separating different content areas with white space. Also, don’t make text lines too long and increase line-height. I recommend using at least 1.4em or 130% of standard line-height. This is easily achievable with CSS:

p {line-height:1.4em}

  1. Divide content into blocks

You must understand, that information has to be separated into “blocks” and not mixed up. One nice example is Smashing magazine’s website:

They have clear areas:

  • Top navigation
  • Content block
  • Advertisements block on the right and last but not least Footer area

This principle helps you to attract the viewer’s eyes where you want them to look and helps to scan websites as I’ve already mentioned above.

  1. Color theory

Various colors call different feelings. And remember: What looks beautiful to you, doesn’t necessarily have to look the same to the majority of your viewers.

Color in design is very subjective. What evokes one reaction in one person may evoke a very different reaction in someone else. Sometimes this is due to personal preference, and other times due to cultural background. Color theory is a science in itself.

When designing your next project, try to use colors that fit your goals best. Do not use more than 3-4 colors in one design. Otherwise, this might end as in our first example…

Some sources to read:

  1. Keep it simple

Just give users some big shiny buttons to click on… Users do not want to search for links or forms/content on your page. It has to be clearly visible. And don’t ever make it too complex.

You need users to fill in some forms? Make them short then. If you have to get some additional information, split your forms into tabs. And don’t force them to fill unnecessary input fields as well. Simplicity is the answer – less is always better.

In this example, a massive form has been divided into 6 tabs. And the form does not look so terrifying anymore.

  1. Do not ignore CSS3 and HTML5

More and more browsers are now compatible with these new thingies. Rounding it all up is much faster (on page load time) with CSS3 compared to images. Rounded borders, text and box-shadows, gradients, multiple background images, and so on… This is the power of CSS3.

HTML5 through is a bit more confusing. It’s in fact (in my opinion) the revolution in web-development. You can view its benefits and live demonstrations on html5demos.com. Just go out of your comfort zone. This is the way to stay on-date and improve your knowledge as well as never getting bored with doing the same things all the time.

We are all bad web-designers. There is always plenty of space to improve. Just keep trying, making mistakes, and fixing them up. Good luck with your next (better) web design. Keep tuned via RSS feed and always get informed when a new tutorial comes out on WDT.