Web Designers: Learn These Essential Web Usability Principles

1. Users don’t read webpages, they scan them

When was the last time you’ve read an entire article? Can’t remember? In his column for web usability, Jakob Nielsen found that only 16% of people read word-by-word. What about the rest? Yes, they SCAN and Scan and scan…

Key takeaways:

  • Design the website so it’s easy for people to scan it. Take a look at adobe.com or apple.com. Very understandable and to the point.
  • If you need to write text, make it readable by adding bullet points, sub-headings, bolding important words and so on. You can take a look at this list of free people search engines that I made a while ago as an example.

2. Understand scent

Let’s say you receive an email newsletter from a company selling language software, with the title “Learn German now”! You click to learn more and once you arrive on the page, you don’t see the keyword “learn German” anywhere! The “scent” is gone.

Online media is all about relevance. If we don’t find what we’re looking for on a page, we’re gone. And one of the best ways to find something relevant is to look for keywords. Let’s say you’re looking for “cheap airplance tickets”. You land on a website and immediately look around for these words. If you don’t find them, you usually leave the page. The ‘scent’ is gone.

This concept is called “scent of information” and is a well-known concept in the usability community. GrokDotCom has the best description for it I’ve found so far.

Key takeaways:

  • Learn what the visitors are looking for on the page you’re designing so you can use the words THEY use
  • Use simple words users understand. If you’re making a website for a musical instruments company, you’ll probably want to add words like “Piano”, “Guitars” and so on in the navigation menu (assuming most of them go to the website to buy a particular type of instruments.) Don’t write “Piano instruments” or “Beautiful guitars” or any other word they don’t use. This leads me to my next point which is…

3. Web users HATE to think

Writing “Guitar instruments” instead of simply “Guitars” will add a few more seconds of cognitive thinking on user’s part. Your job is to eliminate that. The harder something is, the more likely people will give up. Same with navigating a website. A great book on this topic is “Don’t make me Think” by Steve Krug:

Key takeaways:

  • Let’s say I’m looking for a job at a particular company and go and visit their website. As I navigate the website, I find a button called “Jobs”. Great! That’s what I’m looking for. But what if instead of “Jobs”, it said “Employment opportunities” or “Career solutions”? That would make me think whether I should click these buttons. I’ll think: Hey, “employment opportunities” means “jobs”, right?
  • Eliminate politically correct language. That doesn’t work in the online world. If people don’t use these words, eliminate them. Remember scent?

3. The best way to avoid users thinking is to fulfill expectations.

We all have an expectation of how a button should look. Designers love to get creative and make buttons that don’t look like buttons at all! Well, guess what! That confuses users and yes, makes them think. There are certain universal principles (you know most of them) for designing websites that you need to respect if you want to design usable websites.

Another big mistake is to make ordinary pictures look like banners. There’s one thing called “banner blindness”. Put in simple words, people hate banners.

Hope this helped!

5 Comments on "Web Designers: Learn These Essential Web Usability Principles"

  1. giographix says:

    Nice post and I really like your take on usability.

  2. Your points are nice and simple explained. Also very true. However, You seem to have fallen for Point 3.
    Pick one. Point 3. Web users HATE to think – or Point 3. The best way to avoid users thinking is to fulfill expectations.
    (typo there ;) )

  3. Carlos says:

    I enjoy that your point about people hating banner ads is immediately followed by a banner ad.

  4. Michael says:

    Continually dumbing things down for the “average” idiot just makes for even lazier idiots. This was cutting-edge information 13 years ago it has resulted in nothing but cookie-cutter link-bait websites like this one. Try standing out a little.

  5. Outsourcing says:

    If you are looking for some applications to detect altered images, maybe you can try PSKiller. It’s free, easy and straight forward. The result is some icons, red one indicates Photoshopped image, yellow one indicates probably Photoshopped image and white one means OK. The site is http://www.pskiller.com/.

Got something to say? Go for it!