Simplicity

"Use as few features as are necessary to achieve what you need to achieve"

Web design is simpler than ever, and that's a good thing.

2.0 design means focused, clean and simple.

That does not essentially mean minimalist, which I will explain to you later.

I really believe in simplicity. That's not to say that all web sites should be minimal, but that we should use as few features as are necessary to achieve what you need to achieve.

I've written elsewhere about Occam's Razor, which is a principle I use all the time. A way to interpret it is: If there are any two possible solutions to a problem then the simpler one is always the better one.

Here you will find few examples. Just observe how the needless elements have been stripped out from each. You could fill more on every page but the question is: Will this make them stronger?

The answer is that you need to check out the content. Here you will realize that you are interacting with precisely those screen features which the designer wants you to interact with.

Why simplicity is good

• Web sites have goals and all web pages have purposes.
• Users' attention is a finite resource.
• It is the work of the designer job to assist the users to locate what they are looking for (or to see what the site wants them to observe)
• Stuff on the screen attracts the eye. If there is more stuff then you will have to check out different things. As a result, you may not be able to check out the significant things.
• So we need to enable certain communication, and we also need to minimise noise. That means we need to find a solution that's does its stuff with as little as possible. That's economy, or simplicity.

When & how to make your designs simple

When?

All the time!

How?

There are 2 significant features of obtaining achievement with simplicity:

1. Get rid of unwanted elements, without compromising on effectiveness.
2. Try out alternative solutions that achieve the same result more simply.

Whenever you're designing, take it as a discipline consciously to remove all unnecessary visual elements.

Focus mainly on those regions of the layout that are not so significant to the purpose of a web page as visual activity in such regions would sidetrack attention from the main content and navigation.

Here's an example of a design that suffers from not enough simplicity.

Yaxay's interface uses a lot of pixels, but the vast majority of them are decorative, part of the page background. Relatively few pixels are used to user to find or understand information or interact with the site.

See how much "stuff" there is to look at, and notice how few of the pixels are used to clarify actual navigation, actual content, or actual interactive features.

Edward Tufte is the boss when it comes to the design of information. He uses the terms "data ink" (i.e. detail that enables information transfer) and "non-data ink" (i.e. detail that's just detail) to describe this phenomenon.

A way in which Tufte particularly measures the usefulness of information design (graphs, charts, presentations etc.) is through the use of the ratio of data-ink to non-data-ink. The higher the proportion of data-ink used, the more likely it is that a design is effective.

Taking the Yaxay detail above, there's a lot of what I call "busyness", i.e. a lot of edges, tonal changes, colour variations, shapes, lines... a lot of stuff to look at. But, in this detail, the only useful features are:

1. The site logo, and
2. the label on the nav button (which reads "art gallery")

The other "busyness": the slanting lines in the interface panel, gradients, shapes in the background, the grid... all this is noise, its all "non-data ink", because it's not enabling communication.

I'm not against richness, complexity or beauty in web design

Simplicity means:

Use as many pixels as you need, in whatever way you need, to facilitate the communication that needs to happen.

Of course, often what you're communicating isn't hard data, but soft information.

Hard data

means facts, like news, stock prices, train times, or how much money is in your bank account...

Soft information

covers the qualitative aspects of communication, like the first impression about the quality of a company, the sense of how approachable a service provider is, and whether you feel a product will be right for you. It may be turn out to be just as significant.

Whether what you're communicating is hard or soft, your pixels count, so use them consciously and with care.

Take the example below:

Alex Dukal's site is rich, interesting and appealing. It uses a range of visual techniques to draw your attention, make you interested and to give you a warm feeling about the quality of Alex's work.

On the other hand, it's also simple, because it uses its pixels/ink/busyness with care and sensitivity. It's not gratuitous, it's economical and rich.

Whatever you believe, decide sensibly when you use your ink/pixels. Use it to communicate, first and foremost, and then ask whether you can communicate just as effectively with less. If you can, do it.