What makes a good website design?
11th July 2013
Web Development

What makes a good website design?

Any designer knows the pain of silly briefs or non-sensical changes to a proposed design; it’s simply a fact of life to often be frustrated and angry that a good design is being turned bad and it’s not my fault! Design is such a subjective thing, so at one time or another, a customer’s opinions or preferences will clash with a designer’s artistic values and skullduggery with ensue.

It’s a thing of both parties; a client should often learn to trust a designer – it’s what they do and they know their stuff. But sometimes its not always about pandering to the designer, blind trust can be a damaging thing, so here’s a little list of design rules to let the layman understand why designers do what they do.

Rule #1: Typography is king

It may seem like the most unassuming thing, but the way letters and words are arranged on a page, their spacing, tone, colour and styles are just about everything to a designer. In some circles even, typography is essentially life, and a business card with an embossed, gold leaf, papyrus title is enough to give one of these enthusiasts an aneurism.

Apart from photography and images, typography is the number one way information is presented. If it is cramped and unreadable, lacking proper spacing, it will turn people away. Alternatively, the tone of a specific font can affect the way someone will emotionally react, and the ‘voice’ they use to read that sentence in their head.

I receive the least requests for changes to my typography; partly because I love doing it so much and dedicate a good portion of my focus on it, but that’s how it should be; typography is not to be messed with.

Rule #2: Spacing

Look at the following image:

Now look at this one:

What’s the difference? Spacing. While the typography, photography and colours all have their differences, it’s the spacing that really makes a website a good website. If things are cramped and clash, they won’t stick in the customer’s mind. In fact, most of the time the eye will simply slide off content without spacing. Notice how “Start accepting credit cards today” instantly registers in your brain, but trying to find the feature title in the former image is a trial (if there is even a feature title; I’m still looking myself).

Spacing is paramount, and it’s another thing that designers understand intimately. Unfortunately, whitespace is something not well understood outside design circles. Why is there such a gap between pictures? Why is that title so big and I have to scroll to get to some parts of the page? Perhaps think of it this way: if you were handed a plate by a master chef and it was simply piled with food, would you feel that you got what you paid for? Perhaps someone really hungry would think so, but no, at a michelin star restaurant usually puts a gourmet meal in the middle of a white plate in a very calculated way.

In the same vein, a website that has correct spacing between its elements can encourage things like scrolling or conversion more so than cramming thing right above the fold.

Rule #3: Colouring

I’ve mentioned colours a few times already, and no wonder. To the human brain, 93% of a first impression is dictated by colour. As such, colour theory is a very calculated science and has a quantifiable psychological impact. 

One of the most common things I get asked as a whole on websites is to make it ‘look professional’. Most of the time, a website with that request will come back with some form of blue colouring. Why? Because blue represents productivity, calmness, security and order. There are biological, sociological and reasons for this, and there are for every other colour.

Fortunately, for the sake of our eyes, you can’t just plaster a colour everywhere and expect it to have a hypnotic effect. Subtlety (even through stark contrast and boldness) is key in representing a brand and feeling through a website as humans also respond to aesthetics.

Rule #4: Branding

When you come to us for a website, one of the first things we ask for – when the process begins – is a logo. Why? Because despite a website being almost essential these days, the single most important thing for a business wishing to grow and maintain an identity is a logo. 

Most of the time, especially for a small business, branding hasn’t been much of a consideration. The logo is often done by a brother or a friend of a friend, or not even done at all. At this point, we would usually urge to get a logo first. 

Quick thinking time – McDonalds.

What came to your mind? A burger? Fries? Sticky floors? Or the double arches? Chances are – unless you’re starving – is the double arches. That’s what a brand identity is meant to achieve. Obviously, this is a very advanced form of branding; one that’s been around long enough that entire generations have grown up knowing it, but it had to start somewhere, and it usually started with a designer to understood the importance of such a brand.

It doesn’t have to be fancy or super-duper, it just has to do the job of being aesthetic, fitting the medium it’s going to be mainly used in and convey a message within the split second it takes the sight signal to reach someone’s brain. 

In terms of websites, the branding can easily fit in to the message, feeling and visuals in a website, complementing it perfectly (if designed in unison). The point is that the logo provides a service that complements not only your website but your whole business and is essentially a must.

Rule #5: Trust

This little word may seem out of place when building a website, but it’s essential in the same way you have to trust anyone when purchasing a service or product you don’t have a specific expertise in. 

Trust is a huge aspect of design. As designers, our job isn’t just to make things look pretty, it’s an amalgamation of aesthetic understanding, conveying information, technical web skills and understanding markets and ideals. Often times we are tasked with converting an abstract message into a solid object with little more than a few words to guide us; it’s a huge process. We have to subvert human psychology and elicit emotions with often the least amount of visuals possible.

It’s a big job and may not always make sense to the client, but almost every pixel is a calculated decision. Sometimes, it’s hard for clients to understand what we are doing with requirements. We won’t shirk at feedback, but sometimes things we do, we do for very good reasons, and you may just have to trust our reasoning. As with everything in design, it’s about balance.

Rule #6: Feedback

Every piece of art I do receives feedback, and that’s important. At complete odds with what I was saying in the previous section, emotional things like design are often about happy contradictions. In this case, not only is feedback an important factor in giving the client what they want and need, it also gives us more and more idea of the business we are designing for. Information is a key way to provide the perfect website for that client. That’s why quality feedback is important.

Sometimes it can be like drawing blood from a rock, and sometimes a client will tell me exactly want and how they want it. The latter is rarer than the former, but I must stress that good feedback is important. I’m not saying it’s all up to the client though, it’s a two way street in us communicating what we need to know in order to receive the right information, which brings me to my final point:

Rule #7: Communication

Like a final boss in a video game, the last point is often the most powerful. Communication differs from feedback in that the ability to communicate something, whether through meetings or through their design is absolutely essential for a designer. In the same vein, a client should endeavour to not only communicate a brief that can allow us designers to fulfil their requirements, but understand how to communicate with their customer also in order for the website to be an effective endeavour.

For the client, this can take the form of the aforementioned feedback, it can take the form of taking on a rebrand, or even just saying, “you know what? I reckon you know best, go crazy.” As design is essentially visual communication, this skill needs to be effectively employed throughout the whole process in order for the end result to be as effective.

“Cool, I understand now!”

Hopefully this article helps garner an understanding between client and designer about the job at hand. All designers in the field long enough will come to understand these points, but sometimes frustration can overcome the finer points. Conversely, the client often doesn’t have the knowledge or expertise in getting a website, and that’s why they hire a web designer. 

What other things do you think contribute the a good website, and a good client relationship? Obviously this is an article on something that books can be written about and I’ve barely scratched the surface. Sound off in the comments below if you have any ideas!