I sometimes find myself in the position of having to answer a question like “what is the main thing to remember about designing commercial websites?” It’s a great question. A business mentor I once had used to say that he always tried to take one thing away from every interaction he had; with people, with media, on the sportsfield, whatever. He figured that so long as he could focus on learning one thing every time he had the opportunity to, it wouldn’t be long before he knew a whole BUNCH of stuff (and anyway, he said his memory was terrible and he figured it was better to end up knowing something than trying fruitlessly to remember everything and ending up with a head full of nothing). So in honor of his memory, here is the one thing you MUST know about website interface design:
“DON’T MAKE ME THINK.”
Now that’s not going to be hard to remember, is it? But just before you pack up, put away your browser, and go home all smug and self-satisfied, cheerfully sated by that delicious morsel of information, allow me to elaborate a little.
“Don’t Make Me Think” can make a strong case for being the ultimate principle of website design, indeed for being the ultimate principle of design with regard to the creation of just about anything you actually want people to use. But what exactly does it mean?
Well, what it means is that when you look at something its purpose should be obvious. Clear. Unmistakably self-evident. You should be able to just “grok it” without having to consciously expend energy thinking.
And just how obvious? Well, obvious enough that your elderly grandmother who doesn’t know a mouse from a small furry mammal that eats cheese and hates cats can point to it and say “Oh, it’s a *WHATEVER THE THING IS*. Peachy.”
Now, seeing as we’re talking about website design, let’s look at some of the concrete, specific ways in which designers often fail to prevent us from thinking. And let’s try to profit from their mistakes.
Webpage is too busy.
Your webpage is lit up like a christmas tree in December, and your surfer has no idea where to start. A good strategy for dealing with this all-too-common visual clutter is to bury non-essential links a level or two down.
We don’t know what we can click on.
Important links that don’t look like links, buttons that don’t look like buttons, underlined text that isn’t linked, non-underlined text that is linked, linked images that don’t look link-y, the list is endless. You might say “So what? I put the mouse over it and BOOM it turns to a hand – it’s a link!”
The thing is, every time someone encounters something on your site that puts a question mark over their head they are being distracted from the task at hand–namely buying your product/service and making you money. Underlining link text is a very popular web convention, and it’s worth adhering to for that reason alone, for all that CSS makes it easy to not do.
We’re not sure what the navigation is.
A common mistake is to make multiple links on a page that look like navigation, but are actually links to other sites, or non-navigational links within the site itself, or to duplicate navigation along the top and sides of the page. Don’t do it.
Things have clever/cute/technical/marketing-induced names.
Sometimes you can’t avoid these, but where you can’t avoid them it can’t hurt to use subtitles to make their meaning clear. On a related note, if there are article or post-type features on your website, try to use headlines that are clear and explanatory guides to the content in the articles, rather than trying to be clever and cute. Not only will you save your readers from having to think, it’s a good move for Search Engine Optimization reasons as well.
Confusing search options.
Most websites have a search feature. If your site has one, try not to force your user to make a lot of choices before being able to use it. I’m talking about things like “search type’ dropdowns, category selection, radio boxes, etc. If you want to have those kinds of search options available to your readers it’s a better idea to farm them out to an “advanced search” form. Just let Joe Average punch in a search term and click GO. Make some sensible (possibly contextual) assumptions about how he wants the query to be processed .
Having given you a few examples of what not to do, I’m now going to take a little time to make the case for why you shouldn’t do them.
- The competition is always just a single click away. Frustrate your users and they’ll head somewhere else.
- Using a site that doesn’t force you to think about unimportant things feels effortless. Puzzling over things that don’t matter saps your energy, enthusiasm, and time.
- People tend not to read web pages, they skim them. For them to work, they have to do their thing with minimal eye-time. The best way to do this is to create pages that are self-evident.
And one final point. Sometimes you aren’t going to be able to make something obvious, for any number of reasons which lie outside your control. If you really can’t make something obvious or self evident, make it self-explanatory. A self-explanatory page will require your surfer to think a little–but only a little. Make sure the appearance of your web page elements, their carefully-chosen labels/names, your page layout and all associated text works together to make recognition swift and easy.
Well, that’s it for today. My next post will be on how to use your website to capture email addresses. See you later!
March 21st, 2009 at 8:50 am
I love this book “Don’t Make Me Think”. I recommend that anyone who has anything to do with Web sites, read it. I just recommended it to my class on Thursday.
One of the biggest mistakes people make is that what they want people isn’t obvious. It’s called “affordance”. If your button doesn’t look like a button, how are they going to figure it out? Lead them by the hand and make it easy for them to figure it out.
Clever is fun, but if no one can figure it out, you’re losing money.
Thanks for the article.
March 24th, 2009 at 5:18 am
When I used to make sites I would follow the guidelines from webpagesthatsuck.com..lol which are very similar to these, what people don’t realize is that easily agitating a reader can cause a swift click of the right corner “x” box at a moments notice..
March 25th, 2009 at 6:56 pm
Yeah Melody. With the web, the reader is always in charge. You should always have it in the back of your mind when designing that the reader is probably going to leave as soon as you stop giving her what she wants.
May 15th, 2009 at 2:04 pm
Hey thanks for the useful post. I read the book “Don’t Make Me Think” and I enjoyed it immensely! I love it when people post based on books I have read, it refreshes my memory and gets me psyched about it all over again!
One of the things webmasters just don’t think about is making a user-friendly site, for us it’s always been how nice or clever it looks. How wrong we are sometimes!
Hey thanks for a great post today admin, someone tweeted about the post on twitter and I will do the same
Michael’s last blog post..Almost New Design | FBI
May 24th, 2009 at 5:23 am
Great post, just wanted to know if you have any more information on this topic?
May 25th, 2009 at 9:03 am
good post
May 28th, 2009 at 6:12 am
Nice post….thanks for sharing
May 28th, 2009 at 9:39 pm
I enjoyed reading your blog.
Very good information.
Nice post.
May 30th, 2009 at 12:20 am
I would love to write and say what a great job you did on this, as you have put a lot of work into it.
June 1st, 2009 at 9:46 pm
LOVE your site, will visit again
Submitted this post to Google News Reader.
June 2nd, 2009 at 12:14 am
Great post! Just wanted to let you know you have a new subscriber- me!
June 8th, 2009 at 1:13 pm
Finally someone who can write a good blog ! . This is the kind of information that is useful to those want to increase their SERP’s. I loved your post and will be telling others about it. Subscribing to your RSS feed now. Thanks
June 9th, 2009 at 10:53 pm
Great entry here. The “Don’t let me think” simply says it all when designing web interface. Your posts are all taken. Great job man!
June 11th, 2009 at 9:40 pm
I get used to explaining to my clients that thay don’t need to put all of their company’s info on their website. This has been a very good informative input.
June 29th, 2009 at 8:10 pm
Too much info gets site cluttered. So include necessary info only.
June 18th, 2009 at 6:36 am
Very interesting… thanks.
July 2nd, 2009 at 9:45 pm
Your webpage is lit up like a christmas tree in December, and your surfer has no idea where to start. A good strategy for dealing with this all-too-common visual clutter is to bury non-essential links a level or two down.
Love this! Haha! Avoid non-essential designs.
July 8th, 2009 at 1:01 am
I find it too hard to visit websites with so much inputs on it. It lacks my interest.
July 15th, 2009 at 10:29 pm
I agree with Dell. I leave right away once I found out website is busy.
July 21st, 2009 at 10:08 pm
Very useful post. I definitely agree with everything posted.
July 26th, 2009 at 10:09 pm
The don’t make me think statement says it all already! Get your design all in order and clean, from the design to coding. Make sure that it also works in all browsers.
August 2nd, 2009 at 9:34 pm
Get it clean and user friendly. Fancy designs are considered plus points!
August 16th, 2009 at 11:13 pm
Very well shared rules and I have to agree with most of them. As I always believed that first impression counts. To step in a site that’s easy to navigate and less complicated will be a big help. Sometimes simple is more. Stumbled!
@wchingya
Social/Blogging Tracker
Ching Ya´s last blog ..WCHINGYA.COM Is Now A Do Follow Blog (Free Images)!
September 15th, 2009 at 4:53 am
believe me I am trying my best to follow your tips everyday to develop my website
We are currently working on new interface (new menu mainly), hope it will help. it is exciting to put yourself in users and make it as simple as possible!
thanks for your post anyway! it is always good to remind it!
September 21st, 2009 at 8:15 pm
When website is too busy, I close it right away. It’s important for me to surf sites that are cluterred free.
December 30th, 2009 at 3:46 am
“Don’t Make Me Think”
This is a great way to summarized on how to make a user friendly web design interface. Great article!
More power.
James
James – Web Designer Philippines´s last blog ..Adobe Security Advisory for Illustrator CS4 and CS3
January 3rd, 2010 at 12:34 pm
I got the book “Don’t Make Me Think” for one of my classes. It really shows how simplicity is the key. The book is easy to read and has great pictures and examples.
March 5th, 2009 at 5:36 am
How exciting for you.