Why Web Design Must Die

First, let me say what I mean by "old web design". This is "first best guess" design, where the web designer gets to submit their personal view of what will work, the client pays for it, and it’s put live.

First best guess design is guaranteed to deliver poor value. Even the best designers can only guess at what’s going to work, and that guess is not guaranteed to outperform any other guess. Even if a designer presents a few different alternatives, there’s no guarantee the one the client selects will be the best of the group.

I’ve been designing web sites for 15 years, and over that time I’ve grown more aware that my instincts about what design will work are not often right. Maybe they’re better than most, and maybe that’s been good enough – so far. But it won’t be good enough for long.

Experience is proving that anyone’s personal opinion – your best guess – will not be the best solution. In fact, it probably won’t perform 50% as well as the best alternative.

There is a far more effective approach to designing web sites – an outside-in, iterative, evolutionary process, and it’s what every successful designer will be following in a few years.

We can see the signs of the big change starting to happen. It will hit home once clients get educated and start demanding web sites that perform better.

We are often appalled to hear stories of clients who have spent many thousands on a web site design that fundamentally doesn’t work – or, even worse, a redesign that they have no reason to expect will work better than the site it replaced!

Once the new web site architecture method becomes mainstream, these stories should be rare.

The great news is, it is incredibly simple to do, and probably takes less emotional and mental energy to produce great results than the way you may have been working yesterday!

It takes a strong discipline to break away from our compulsion to go with our own personal instincts and tastes, and to trust testing to guide design, but the rewards are immense.

In this article, I’ll explain this new design discipline (what I prefer to call  "web site architecture") and show why it is poised to replace old first best guess web design as the new standard.

Make Huge Potential Gains – with Ease!

In our agency, we’re in the process of researching material for a new book on the subject of "Conversion Rate Optimisation" (CRO) for Wiley, to be published in 2010.

At the core of this project is a series of tests we’re running on clients’ sites. We’re developing a process that helps us identify the critical stumbling blocks that could lose visitors, and – crucially – the areas we should focus on to ensure as many visitors as possible achieve a site’s goal for them.

 

The very first client’s site has seen their conversion rate go up from 2% to over 10% – that’s a 400% increase in conversion rate.

Just one small change to a button almost tripled the number of products they sold.

And as this is a site that gets most of its traffic through pay-per-click advertising, this means profits have gone up massively, and the client should be in serious profit within 3 weeks of the tests.

 

The improvements that can be made over anyone’s first best guess are typically in the range of 100% up to 500%, all for way less than the cost of a site redesign.

In fact, graphic design appears to play a minor role in a site’s success (although we like to think it’s vitally important). The real keys to success are more basic, can take far less work, and are accessible to many more people who are not skilled in graphics.

The Law of Measurable Results

Let’s assume that nobody has the skills to visualise the best possible design solution for any given site.

You can’t know if Solution A is the best solution, but it may be possible to test its effectiveness, but only if…

  1. You have a goal (a clear result that signifies success), and
  2. A way to measure it

In other words, measurable results. If you can get measurable results, you can compare the effectiveness of various design solutions. That’s the first step.

Sure, any site design can result in a certain amount of success – whatever success means… Success could mean selling stuff, distributing information, or maybe gathering information.

Whatever succes is, the access to improving/optimising it starts with a simple thing – measuring it! You cannot improve something you don’t measure. Otherwise, how do you know it’s improved?

This really is the key to unlocking the secret to successful design. Measurable results open up the possibility of evolving your designs in order to make them more effective.

Why Designing Through Guesswork Sucks

The search for the best web design solution is like trying to guess the highest point on a map.

  • If I give you one (random) guess, you’re extremely unlikely to be close to the ideal solution.
  • If you have two guesses, and you know the result (height) of each point guessed, you’ll have some clue, but not much.
  • If you have three guesses, then get three more after that, then a further three, I think you’d be able to get close to finding the highest point – and you’d be almost certain to have a better result than one guess could give you.

It’s exactly the same with designing web sites! If you take the old-school "first best guess" approach, you’re sticking your pin in the map and hoping for the best.

If you try a couple of approaches and take on board client feedback, you’re only marginally more likely to end up with a better result, and extremely unlikely to be close to perfect.

But close to perfect is achieveable! And it doesn’t have to be time-consuming, expensive, or difficult.

The Good News & the Bad News

So it’s bad news that your First Best Guess isn’t good enough? Don’t worry, because there’s good news: neither is anyone else’s!

Although I said that designing through guesswork sucks, actually that’s all we have. The trick is to combine two vital techniques: Creative Inquiry, and Empirical Testing.

Nobody can come up with the perfect design solution first time. Sure, very skilled designers and copywriters are much more likely to produce a higher-performing first best guess than unskilled amateurs, but I think that’s mainly down to the experience of seeing lots more things that do and don’t work. (Even then, I’d guess that even the best in the business are only “fairly” accurate.)

If our First Best Guess isn’t enough, what do we do? There’s actually only one solution, and it’s very easy.

Traffic x Conversion = Success

It all starts and ends with numbers.

You use numbers to do two things:

  1. Establish your Goals (number of brochure downloads, number of leads, value of purchases, size of email list),
  2. and also to track your Success Rate (how quickly the numbers go up).

Like I said, as with everything in business (and science), you can’t improve what you don’t measure.

Of course, both traffic and conversion rate are essential for a successful site.

There’s no point having a brilliantly conceived and executed web site that has no traffic, as you won’t achieve any conversions (however you define conversion).

 

Zero Traffic x Great Conversion = Zero Results

 

Having an amazing site that isn’t properly supported with SEO is like designing a fantastic shop, beautifully appointed with brilliant service, excellent prices, and even nice background music, then sticking it on a back street where nobody goes.

Similarly, it’s crazy to drive lots of traffic to a web site that has a rubbish conversion rate, spurting visitors from every pipe.

 

Lots of Traffic x Zero Conversion = Zero Results

 

The Evolved Step-by-step Approach

At its most crude, evolutionary design works like this:

  1. Come up with Solution A and Solution B
  2. Test A against B
  3. If A outperforms B, don’t use B
  4. Create C
  5. Test A against C.
  6. Repeat….

To put some flesh on the bones, what we need to do is come up with multiple candidate solutions, and test those different solutions to see which is best and which elements are most important to success.

 

We use Google Website Optimizer extensively, which is a free javascript-based tool that lets us run A/B (split) tests and also multivariate tests.

 

You must not expect your first solution to be the right one. (In fact, you must set your client’s expectations, and your own expectations, that the initial designs will not persist for long.)

It’s crucial to test substantially different approaches. Using the analogy of trying to find the highest point on the map, all you can do is pick a point, and you get a numeric read-out that indicates your success rate. If you pick another point very nearby, you can expect a similar result, which is unlikely to take you any nearer your goal. While you may find yourself going uphill,

When you test different points across the domain of possibility, you might find significantly different results, which might help you zone in on the area to investigate in more detail.

Taking the results of the initial test, which should give you different results from at least 2 or 3 different approaches, you’ll then test further alternatives, again taking quite big steps but centered around your most successful initial result.

It may be that your initial result outperformed the 2nd round tests, which is great. That means the peak performance is near that result. Or, if one of the new combinations is better, that becomes our new point of reference.

The process continues in the same way, always with quick iterations but shifting the focus from the large gestures down to the more fine detail as you go.

Broad Strokes, then Detail

Aside from just testing (versus not testing at all), the most important method to apply is to start with broad strokes first.

Get something that works at a high level, has all the basics right, like proposition, market, positioning… And all without investing too much work, time, or money.

So start by testing significantly different broad approaches. Find the broad solution that is received best by your target market. If the big picture works, then you can proceed to refine and to add detail with confidence.

Leondardo cartoon, from http://commons.wikimedia.org/wiki/File:Leonardo_-_St._Anne_cartoon-alternative-downsampled.jpg

Leondardo da Vinci is acknowledged by historians as a kick-ass artist, but even he didn’t dive in and deliver his first best guess.

He’d always start with quick, cheap roughs, like this cartoon, which would help him be sure that the big picture worked.

If the big picture worked, he could proceed to block in the colour and add the detail, to end up with a great result.

Leonardo da Vinci cartoon, via Wikimedia.org
 

Because we’re talking about web design, which is not a purely aesthetic exercise, you need to know your solution works in more ways than just the visual. Again, that means being 100% clear on the purpose of your design.

Here’s a tip: The purpose of your design will invariably be Communication Resulting in Action.

Successful Flow Model & the Testing Hierarchy

What counts as broad strokes in web design? Well, it’s not graphical. It’s not colour scheme, typeface, or surface style. It’s the basic thrust of communication that gets the attention of your visitors and gives them reason to take the step you want them to take.

Here’s the model of 4 things you need to do to have a successful site:

  1. Help me find your site.

  2. Get my attention, and affirm I’m in the right place.

  3. Convince me to keep reading, watching, or listening, until I’ve had my positive needs affirmed and my doubts resolved.

  4. Ask me to take some action.

Work from the top of this list downwards. Test the top things, and make sure you’re in the right area of the map, before you move down to refine and to polish your graphics and other details.

  1. Message – what core proposition does your audience respond best to? Is it obvious when you arrive what kind of site/page you’re on?
  2. Calls to Action – if you don’t ask, how can you get? Make sure your have strong, clear calls to action that lets your audience know exactly what you want them to do next.
  3. Headings – if all the body text and small detail were removed, how would the page read? At a high level, does the page make sense and encourage me to keep reading?
  4. Affirmations and Objections – what positive content can you add, or what objections can you resolve, to make your audience comfortable enough to take the next step?
  5. Plug Leaks – are you squeezing your visitors through the door you want them to use (which achieves your goal), or are you offering them lots of alternative places to go (which don’t)?
  6. Layout – is the page simple and clear, or cluttered?

Too Much Detail

I’ve warned against going into too much detail too early, but I recommend you also consider that testing at the detailed level may never be necessary at all.

Interestingly, when you use this method, you’ll find there comes a point where you don’t need to add any more design (detail), where the broad strokes of design and content are sufficient, and where effort spent on further polishing either suffers from the thin end of the law of diminishing returns. or actually starts to take you backwards.

Many web sites are more visually detailed than they need to be. There are lots of cases of simple, plain, or downright ugly design solutions outperforming a more visually appealing design (which may have had far more work put into it).

Yet many sales or squeeze pages appear crude and amateurish, yet have been proven to convert really well.

How can this be? Why would something plain or unattractive ever beat something attractive?

I can think of a couple of cases:

  • One instance is where the brand actually suits the values of "cheap" or "quickly put together". Some sites may suffer a lack of credibility by looking too sophisticated. Remember, it’s all down to the initial "getability" and proposition to the target audience. If your site doesn’t match the visitor’s brand expectation, it may fail at the first hurdle and never grab their attention.
  • Another situation is where you just want people to move along. Underwear models are visually appealing, but that doesn’t mean you’d want one working on a school crossing! Sometimes, visual appeal is not welcome. There are times when it may be desirable to stop someone in their tracks with their mouth open, but those occasions are rare. More often than not, you want people to get the message, move forward, and complete an action as reliably as possible.

So, don’t feel you have to refine a design to the point that you think it’s up to the right quality. Work with what the results tell you. If simple, crude, plain, or brash work better, don’t force through your own (or your client’s) point of view – if you’re committed to winning conversions.

Are You Struggling to Accept This?

That’s OK. I first heard about these principles in 2005, and I dismissed it then, probably because it sounded like too much work, but really because it went against my need to believe that, as a creative, it was my job to know better than other people. (I was wrong, by the way.)

Firstly, let’s acknowledge that the only people who really care if your web site is cute are:

  1. You

  2. Your Client (until they’re educated)

  3. Other web designers (who are a dying breed anyway)

Now, it’s probable that none of these people is in your target audience.

What’s the real reason? You like designing on best guesses alone? I get that.

Web design was great fun, so was Flower Power, but the world has moved on.

FAQs

But I love web design!”

I loved 1990, but it’s gone. Move on.

Can I still design beautiful sites?”

Sure. Aston Martin and Alfa Romeo still make beautiful cars. You should make your designs cute – if cute works! That’s not always the case.

Sometimes, a plain page outperforms a cute one. Often, extra effort put into prettying up your graphics has no effect at all.

It’s not just about conversion rates, you know. What about building brands, leaving a subtle impression and that?”

Of course creating a strong brand impression is a real and valid goal. And some web sites are in fact Art. I’m not saying there’s no room for this.

It all depends on first clarifying what your goals are, and then putting measures in place to track your progress. If you’re not doing that, you’re doing voodoo.

What about Creativity?

Of course, visual style matters, but nowhere near as much as you think it does.

Creativity alone cannot be given free rein over the design process. To succeed, you have to combine two essential disciplines of creativity and analysis.

Creativity is essential, but it’s not sacred. Use it in the right place and in the right way, and it will give you a massive boost.

The right way to use creative energy is in coming up with brave new possible solutions, never assuming that your first guess is right, being willing to try alternative approaches. True creativity is saying “I love what I’ve made, but what would work even better?”

It is an abuse of creativity to say “I’m the creative, and this, my best guess, is right”. That’s not creating, that’s just being lazy.

How not to use creativity is to do just one guess!

A good creative process gives you strong alternatives to evaluate. If you’re unskilled or lazy in your creativity, you could end up testing Bad1 against Bad2, which will only give you a bad result.

That’ll be like trying to put together a world-beating soccer team by going round Sunday league games. Sure, you’ll find the best players in the Sunday league, but it’s no way to find the best players in the world, because the overall standard will be poor. The way to find world-class performers is to start with the best you can find, and then to test them against other great performers.

Same goes with design. Use all your creativity to develop several great solutions, then put them to the test.

Leaving the design of a web site to a web designer is like giving an artist’s sketch of a new house to your builder and saying “Build that”. The end result will be poor because you’ve started with just an aesthetic brief, missing out all the other critical things like structure, access, insulation, parking, drainage etc.

Say Hello to Web Architecture

From here on in, if you want to create competitive web sites, you’re going to have to apply a broad set of skills, and you’re going to have to test all your assumptions to find the ideal balance.

That role is much more like architecture, where aesthetics mingle with access, signage, light, economy, etc. Architecture is a broad and highly skilled discipline, in which everything has to be evaluated and costed, and where aesthetics and performance have to go handin hand.

So what kind of web designer are you? Are you an Architect, or a Decorator? Decide now.

You can’t hope to design competitive web sites as just a Creative now, because ideas & graphic design are only a fraction of what a web site needs to be great.

A Web Architect isn’t the same as an Information Architect. It’s nearer to the old 1990s role of “webmaster”. A Web Architect has the skills and tools to put together a complete plan for a web site that attracts the right kind of visitors, engages with them, and leads them efficiently through to completing their goals successfully. They need to understand information architecture, usability, copywriting, graphic design, SEO, and CRO (conversion rate optimization).

If right now you’re still committed to being a web creative (i.e. a Decorator), here are my helpful hints:

  • Get you head round the evolutionary, iterative design process I describe and learn how to sell it to your clients. Learn when to use conventions, when to use original thinking, and start to incorporate analytical techniques into your service.
  • Join a multidisciplinary team in which you can be part of offering a full service (which should include copywriting, SEO, CRO, graphic design, usability, and accessibility, plus prototyping and user testing on larger projects)
  • At the very least, keep yourself informed on the tests that other people are running, so that you can learn from their results and apply the learning in your own design.

Next Steps

Make Better Web Pages!

How to make your web site sell - use my secrets

Find out How

Do you love our approach to crafting simple & effective web sites that just work for people?

We'd love to hear about your web strategy.

Contact one of our team today!

2 Comments

  1. Andy says:

    This is one of the smartest articles on effective website design I’ve read. Thanks, Ben.

  2. ben says:

    Thanks for your kind words Andy!
    : )B

Leave a comment

Articles + tutorials in Blog

Me2solar E-commerce Site Designed by Scratchmedia
UK-based Web Designers Scratchmedia recently delivered this new e-commerce site for US/German Me2Solar, makers of innovative portable solar chargers
GuruShot – Scratchmedia’s Latest Web2.0 Application Design Project
Introducing GuruShot, a new Web2.0 web-based application. GuruShot is a wisdom sharing site designed and built by UK Web2.0 designers Scratchmedia.
What is the Relationship Between Graphic Design and Web Design?
Explores the difference between design, graphic design, and web design. Argues that web design is a much broader discipline than graphic design.
Ben Hunt’s Web Design Newsletter, April 2010
Ben Hunt's web design newsletter April 2010: Conversion Rate Optimization, 2 new Web2.0 projects, and a trip of a lifetime
Case Study: Increasing conversion rate using Google Website Optimizer
A case study on increasing conversion rate with split testing using Google Website Optimizer
Order Your Copy of the Blogging for Business Pre-Release DVD
Order your pre-release copy of Ben Hunt and Mark Attwood's "Blogging for Business" seminar
Conversion Rate Optimisation Case Study: Bible Timeline
How Scratchmedia's designers tripled one customer's web site's conversion rate
Ben’s New Year 2010 Newsletter
Ben Hunt's web design review of 2000-2009 and a look ahead to web design in the 2010s...
Web Design is Dead
Why the familiar creative-driven web design process fails, why combining creativity and testing works so much better, and how to do it successfully.
Ben Hunt’s Web Design Newsletter, October 2009
Web design newsletter for October 2009: Conversion Rate Optimisation, usability, and an invite to an exclusive internet marketing club.
New Book: How I’ll Maximize Your Web Site’s Conversion Rate
How I'll Maximise Your Web Site's Conversion: Process and agreements for taking advantage of Ben Hunt's new CRO book project offer.
Your Chance to Be Part of My New Book Project
Your Invitation to be part of my new book project on Conversion Rate Optimisation. I'll try to double your web site's conversion rate and track the results in detail.
Simple Tips for More Effective Web Sites
Save the Pixel is an ebook from pro web designer Ben Hunt which teaches that anyone can create great web design
10 Boring Things to Get Excited About
Some of the best things in life take some time and don't feel like much fun, but they're better than the quick fix alternatives. Ben Hunt introduces a list of ten really interesting uninteresting things we should all be doing.
Meet Ben Hunt at Ken McCarthy’s System Intensive, London September 26 + 27
Invitation to meet Ben Hunt at Ken McCarthy's System Intensive online marketing seminar in London September 26 and 27 2009
Ben Hunt’s Web Design Newsletter, August 2009
Web Design newsletter for August 2009 by Ben Hunt, various thoughts and links
Ben Hunt’s Web Design Newsletter, July 2009
White on white web design, semantic HTML, testing and measuring, and a free copywriting ebook (Ben Hunt's Web Design Newsletter, July 2009)
Ben Hunt’s June 2009 Newsletter
Ben Hunt's June 09 newsletter: Results of Google Website Optimizer experiments on Save the Pixel; Web Design from Scratch redesign
Benefits of a Simple Client Brand/Design Alignment Session
Sitting down with your clients before you start a design project to run through a few dozen web sites and identities can save hours or days of work
Argument that Investing in Evolving Your Web Site Beats Big Bang Redesign
It's more cost-effective to invest in evolving your web site, using continual cycles of change-test-measure, than to redesign wholesale.
Why Deepak Chopra’s New Navigation Fails
Deepak Chopra has a new site, but the navigation leaves you guessing. Not the place to be airy and mystical, Deepak.
Ben Hunt’s Newsletter, April 2009
Ben Hunt's newsletter for April: Tips for Surviving the Economic Winter
Introducing Clicss, Flexible and Useful Web Page Templates
When can using web page templates really work? Sneak preview of Clicss.com, a new range of simple, standards-compliant web page templates for sale.
Subscribe to Ben Hunt’s newsletter
Ben Hunt is sharing his experience in making web sites that are appealing, easy to use, and successful. Subscribe to his newsletter to get regular updates.
8 Reasons to Put Your Prices UP This Recession
Many service providers needlessly undercharge. Here are 8 Reasons why you should seriously consider putting your prices UP.
10 Top Skills for Web Design, in order of importance
My list of the top ten skills you need to be an effective web designer, in order of importance. Not what you may think!
My Vision for a Real Workable Web3.0 World
Ben Hunt's vision of Web3.0, solving the future of the web user experience, consumerism, marketing and DRM in one elegant theory. Just may be the biggest thing you read today.
When to Use Graphics in Web Design
Ben Hunt urges web designers to get really conscious about only using graphics in web design to communicate, and lists 7 specific reasons why graphics can be better than text.
Tips from Our Experience of Switching from PC/Windows to Mac
One business user's experience of switching from Windows PC to Mac, using Parallels and a temporary Windows installation to transition in a manageable step by step way.
10 Tips for Recession-Proofing Your Web Site
10 simple and powerful principles web site owners should be following now to help ensure your web site is really supporting your business through the current economic difficulties.
Announcing Scratch Web Design Forums
Scratchmedia has launched a free web design forum at http://scratchwebdesignforums.com/. Visit to learn from industry experts and share hints and tips on web design, production, SEO etc.
Introducing CMS from Scratch, the open-source lightweight AJAX CMS
We're proud to launch CMS from Scratch, now as an open-source project: the system we've developed over the last 3 years to let Scratchmedia's own clients easily manage and update their web site content.
Real Web Design versus “Design Toss”
The vital difference between true Design (crafting communication solutions with a purpose) and graphic art for the sake of other designers
My Web Design Workstation: 10 essential items of design kit
The 10 key pieces of kit that this web designer couldn't live without
The Social Future of Web2.0 / Web3.0
Ben Hunt casts an eye to the future of a more connected web, and predicts that Yahoo will be the dominant online brand for the next 5 years (LOL)
Why All Web Designers and Web Developers Should Learn to Type
Learning to touch-type is one of the most valuable skills you'll ever learn as a designer or developer
Pursuit of the Original in Web Design
The value of laziness in design, and why the pursuit of the original can be detrimental to design success.
DHTML Decision Making Tool
Tutorials on learning JavaScript to enhance web pages and applications
Review of Harvey Nichols’ 2nd web site, 2004
Review of Harvey Nichols' second web site from 2004
Review of Harvey Nichols Web Site (2001)
Review of Harvey Nichols' first web site from 2001
© Scratchmedia Limited, 2006-2010
Floor 3, 111 Buckingham Palace Road, London, SW1W 0WQ, UK
+44 (0)207 1600 989