Jump to content

Cre8asiteforums Internet Marketing
and Conversion Web Design


Photo

Your 10 Rules To Follow To Ensure Usability


  • Please log in to reply
24 replies to this topic

#1 tommy

tommy

    Unlurked Energy

  • Members
  • 4 posts

Posted 24 July 2007 - 08:03 AM

Hi there,

Im new to the forum and a big usability fan.

I was wondering members views on what their 10 definite rules would be to ensure, or atleast strive for, good usability. I'm not talking about Nielsens heuristics etc, I mean 10 (current and relevant) easy to follow, actionable points that the general developer could follow.

Hopefully this will make an interesting thread.

Thanks!

#2 bwelford

bwelford

    Peacekeeper Administrator

  • Admin - Top Level
  • 8995 posts

Posted 24 July 2007 - 08:26 AM

Welcome to the Forums, tommy. :wave:

There may be other threads here that could be cited, but I think it's always good to check what the current situation is. Things happen so fast on the Internet that you can never be sure what is the best now.

I'll just vote for one rule for the moment. That would be to try whatever it is, web page or coffee pot, on real live users. Also do this early in the development process so you don't get locked into something that has a fatal flaw. You should make sure the Users in the tests are average members of your targeted market place. That probably rules out most people in your office. :)

#3 A.N.Onym

A.N.Onym

    Honored One Who Served Moderator Alumni

  • Invited Users For Labs
  • 4003 posts

Posted 24 July 2007 - 09:25 AM

What I like about usability is that the rules to follow are pretty old and won't change. It is the techniques applied to websites change with technologies. For example, a good idea would be to:
- know the customers
- focus on the people
- write about what people want, how they want and using the words they can understand
- provide the easiest way for them to get what they want
- keep it simple (less is more)

I have written about improving usability almost a year ago and I still think most, if not all, holds true.

#4 Respree

Respree

    Honored One Who Served Moderator Alumni

  • Hall Of Fame
  • 5901 posts

Posted 24 July 2007 - 12:03 PM

Welcome to Cre8asite, tommy.

Great subject. I think each of the points mentioned in this thread would serve as a great separate discussion, but a high-level 'to-do' list is a great starting point.

Do not disappoint. At the heart of Usability is the degree of effectiveness that users can accomplish their goals and how satisfied they are with that process. When we create navigation, search functionality, a shopping cart and other functionality within a site, there is an expectation created in the users' mind that the site will successfully fulfill that expectation. If the site falls short of those implied expectation, the user is ultimately disappointed. Repeat the process more than a few times and you will, undoubtedly, lose the lion's share of your visitors. All the time, money and energy you've just put into your SEO/SEO/Marketing efforts have just been wasted.

Common examples of disappointment

- Broken links and forms
- Links that don't take you where the linkname implies
- Inaccurate, meaningless or excessive search results
- Excessive page load times
- Hijacking browser controls
- Incoherent, disorganized or poorly writing
- Many, many more (just think about the last time 'you' were disappointed)

Make navigation easy. If you can't easily get around a site, what good is it? Place navigation where users expect to find it, either on the left or top (for shorter menu choices). Make your linknames short and descriptive. Avoid the temptation of overly complicating the choices a user has, using subcategories to drill down on major categories. Make your navigation visually different from the rest of the site by employing the use of colors, borders, lines, tabs (or similar), so that the eyes can quickly locate it.

Once within the site, let the user know where they are by using breadcrumb trails, so they easily go up (back) to where they came or deeper within the site (subcategory).

Make it legible, readable and digestible Your eyesight may be good (now), but that isn't necessarily true for all your visitors. I've been on far too many sites which use a tiny font. Without thinking of their users, in their infinite wisdom, the designer has hijacked my browser controls by making it impossible to make their text larger. I'd also venture to guess that many notice surfers do not even know how to resize the text on a site, but not giving them the choice is the equivalent of a good hard slap in the face. If you're not going to allow me to read it, then at least put up some audio so I can hear what you have to say <sarcasm>.

Readability. Back when 800x600 screen resolutions and 15 inch monitors were about the only affordable choice, utilizing the full width of the screen 'might' have been acceptable. Those days are long gone. The eyes can comfortably read only a certain amount of characters per line. Ever wonder why newspapers are laid out the way they are and why you'll never read a single line of tiny text that measures 24 inches wide?

Digestibility. You could theoretically publish an article the length of War and Piece on a single web page. The amount of information would obviously be overwhelming, resulting in 9 out 9 users to quickly abandon it. I like the idea of presenting information in short, digestible 'chunks' similar to the concept of breaking a book into chapters. It's just easier to digest.

Use emphasis sparingly. You've got a precious few seconds to capture your readers' interest. It's a well know fact that people do not read on the web, they skim. Imagine yourself in a sporting event, surrounded by thousands of screaming fans. Can you hear any one non-digitally enhanced voice that stands out above the crowd? Far too many people desperately want 'every' page element to scream for their visitors' attention. You can scream as loud as you want, but it's not going to happen. Be discriminating about what you emphasize.

Emphasis can be created simply by making a page element (most often, text) visually different from 'everything' else. Most often, bolding is used, but that's not to say that it can't be done with using a different color, italics, capital letters, different sized font or something similar. If you really want to shout it loud and clear, maybe a combination of two or more techniques might do the trick, but once again, do it sparingly.

You don't want to present your visitors with the online version of wearing checkered pants, a striped shirt and polka dotted. It'll only make people roll their eyes.

Make it intuitive. A user should be to effectively use and navigate your site without any further instructions. I see many sites that instruct the user. Instructions on your site such as "Click the images below to view a larger picture, click on this link, go to the search box and type in XYZ" are tell-tale signs that it is not cyrstal clear to the user how your site operates.

Well thought out icons can help in this regard. An images of a speaker, right next to a video, for example, seems like it would widely understood to mean 'adjust the volume', whereas an icon of the knob of a radio may not make the same connection.

Similarly, when creating navigational linknames, try to utilize widely understood words that most people will understand. Usually, it will be the obvious one that best describes where you're about to lead your visitor to. Avoid the temptation of being cute or creative. A link called "Garrick's Lightbox" will leave many scratching their head wondering "What the heck does that mean?" Chances are they won't bother to find out.

Place important elements above the fold. This one is pretty basic. Important page elements should be placed toward the top of the page. The invisible line (i.e. "fold") being the point where the reader is forced to scroll downward. Remember, you only have a few precious seconds to catch their attention, so they don't get to all the elements on your page, at least they will have seen the important ones.

This obviously creates a temptation to cram as much as possible above the fold. Avoid this temptation, if you can. White space (aka 'negative space') is a common design technique that visually separates page components and has the advantage of making the page seem overwhelming, confusing and cluttered. It just makes it easier on the eyes, increasing your chances that they'll stay on that page a little longer.

Don't assume your site is usable. It's not an exact science. Everybody is different. After all is said and done, you may think your site is usable and may find out you're the minority. Get as many people as you can to jump on your site and give you an honest assessment of how easy or difficult it was to use. Testing, feedback and continual refinements are the keys to reducing the frustration factor to a minimum.

Make sure your website actually works. There's nothing more frustrating than being on a site with broken links, forms that don't work, search engines which return inaccurate or overwhelming results, downloads that don't download, and so forth. The last thing you want to do is waste your visitor good time by making a promise (or implied promise) and not fulfilling that promise. If you do they'll likely never revisit your site or quickly click off.

Edited by Respree, 25 July 2007 - 06:40 PM.


#5 cre8pc

cre8pc

    Dream Catcher Forums Founder

  • Admin - Top Level
  • 13365 posts

Posted 24 July 2007 - 01:22 PM

Easy.

..for

a developer.

..okay )

1. Ignore everything everybody ever told you about what you SHOULD do.

2. Start all over and work out the top business requirement for building it. Hold onto it for dear life. Make every function, every link, every sentence and every breath a page takes traceable back to the original business requirements. This will support you when stakeholders start begging and flirting with you about the cool things they hope you slip in there for them. Just Say No.

3. Decide who it is for and design it for them. Don't pick the least common denominator. Understand your users and build it for them.

4. Show the mockups to everybody before you begin to code. Walk up to strangers. Ask them for feedback. They may not be your target visitor but they may use the web.

5. Test during the code phase. Regression test every time you add something new. That also means testing designs and functionality on browsers and mobile devices.

6. When you get to Alpha or Beta stage, run it through validation tests for standards and accessibility. Do this now, not later. Keep checking after every code freeze or "I think this page is done" moment.

7. Never ever put up moving things that cover up anything or keep moving without a way to stop it.

8. Put a way to contact you on the site, so you know what's not working.

9. Do something with it. If you can't finish a task, neither can anyone else. Accept that everybody will conduct that task differently than you do and how you coded it to function. Have a swig of beer, swallow your pride and polish it up.

10. Usability begins while the site is still in the womb, not after its born. Code as if you're in labor. You are.

The same list can be used by designers too of course.

#6 Ruud

Ruud

    Hall of Fame

  • Hall Of Fame
  • 4887 posts

Posted 24 July 2007 - 08:39 PM

After Kim's reply it is hard to step in :)

Unless specifically directed otherwise I develop with the goal to have 100% functionality without having to rely on:
  • CSS
  • client-side scripting (JavaScript etc)
  • plugins
When you design a plain HTML interface which gets its logic from plain links and document flow and then get to add layers of extra's (CSS, JS, etc.) you work from a functioning whole to something even better. Do it the other way around and you find yourself having to do a step back all the time.

Seen this way it is a bit like designing. You design for standard browsers first, then add hacks to make it work in others :)

#7 A.N.Onym

A.N.Onym

    Honored One Who Served Moderator Alumni

  • Invited Users For Labs
  • 4003 posts

Posted 24 July 2007 - 09:31 PM

Good point, Ruud.

Doing the site in plain text and HTML will help you to think out the site/page layout better, so you'll only need to style it up, not to format/structure it a lot using CSS/JS. It not only saves lots of time and efforts, but makes the whole process easier.

#8 DCrx

DCrx

    Hall of Fame

  • 1000 Post Club
  • 1270 posts

Posted 25 July 2007 - 06:11 AM

I think the reason some people ask for ten simple rules is to replace user testing. That's why they don't ask for guidelines. I suspect the average rule seeker wants, at heart, a validator.

Something easy, free, and without humans (user testing) involved.

Usability doesn't exist in a vacuum. It's not just your site's usability. Users are comparing your site against the easiest sites they've used ...even if they are not in your industry or developed by a much bigger company. A validator that parses code isn't going to give you the kind of feedback user testing will.

I think, with any list of rules, an accompanying list of top misconceptions would be handy. A post in another forum (in a section about Usability) talked about setting up a usability testbed. They talked about, in essence, setting up a bunch of browsers like web developers do, for basic minimum accessibility. Just because Browsercam shows your site comes up in no way means it's even minimally usable, and it is not a "usability testbed."

Yet, to many people, that's the conception. And most of the posts in that forum section -- and this is a big high-traffic forum -- confuse usability and even accessibility with code validation. They don't see why you can't just parse the site (apply some rules against the code) and get "the real" answer.

In this conceptualization computers are real, and users are an abstract notion with an accompanying alien "logic." They've never set up Jaws for an actual user. They've never watched a disabled user navigate the computer using a "Puff Control," and yet they opine on accessibility and the import of alt tags.

Edited by DCrx, 25 July 2007 - 06:29 AM.


#9 cre8pc

cre8pc

    Dream Catcher Forums Founder

  • Admin - Top Level
  • 13365 posts

Posted 25 July 2007 - 06:52 AM

It's not just your site's usability. Users are comparing your site against the easiest sites they've used .


Right on!

Which is why optimizing for engines and people is a no brainer. :cheers:

#10 bwelford

bwelford

    Peacekeeper Administrator

  • Admin - Top Level
  • 8995 posts

Posted 25 July 2007 - 06:55 AM

Good points, DCrx.

Perhaps the simplest explanation is that human beings don't like to lose control. If you put your fate in the hands of others, who knows what they'll say. Perhaps they'll tear it all to pieces. They may certainly imply they're superior to whoever put this together. .. and all this is happening in public. Oh, the shame! :(

Just compare that with the pleasure of doing validation tests. Even if they're bad, no one else sees them until you've had the opportunity to tweak the results. Even though the process may be very flaky, at least you stay in charge. :)

Afterthought afterthought.. and of course once the website goes live, people in general don't make negative comments unless it's really, really bad. So you'll rarely get feedback that makes you uncomfortable. Who cares if they all clicked away somewhere else. You probably didn't check for that either.

Edited by bwelford, 25 July 2007 - 06:59 AM.


#11 yannis

yannis

    Sonic Boom Member

  • 1000 Post Club
  • 1634 posts

Posted 25 July 2007 - 07:11 AM

Just to add a small point on the list, cater for older browsers!

Yannis

PS Personality I almost always fail on this as it is such a dreadful and boring job, but it has to be done!

#12 rynert

rynert

    Light Speed Member

  • Members
  • 858 posts

Posted 25 July 2007 - 08:16 AM

Off Topic offtopic

A whole topic on it's own really.. but should I really spend valuable time to cater for 6% of my visitors to the detriment of the other 94% ...

What if it was 4% and 96%... what about 1% and 99%... what about .01% and 99.9%... you get the picture :P


#13 DCrx

DCrx

    Hall of Fame

  • 1000 Post Club
  • 1270 posts

Posted 25 July 2007 - 09:25 AM

Good points. There isn't a golden ratio that 94%/6% or better equals usable. And there are a lot of assumptions behind the numbers.

For example, the Flash plugin may be on a certain percentage of browsers, like 99%. However, if your developer is developing for version nine of the player. Linux users have been stuck on version seven for 3 years because Macromedia hasn't issued (had not issued) an update.

I've actually run into Flash developers who didn't know that. Or that 99% only applies to some version of the Flash player -- not necessarily the latest one.

The Flash guy is going to look at the 99%. The Linux user is stuck with the practical reality of not being able to see this Flash. And this situation may range from being a critical problem to not making any difference whatsoever, depending on who your market is.

Edited by DCrx, 26 July 2007 - 06:16 AM.


#14 TheManBehindTheCurtain

TheManBehindTheCurtain

    Time Traveler Member

  • 1000 Post Club
  • 1035 posts

Posted 25 July 2007 - 10:06 AM

How do you do that nifty off topic thing?

Anyway, very off topic, but since it came up. The Linux Flash player is now on version 9:

Adobe Flash Player Download Center

And here ...

Adobe Flash Player home page

... you see they've delivered a player for Solaris SPARC.

As client-side delivery mechanisms go, Flash is the most pervasive, even more so than Java, since there is a mobile version (supporting, at his moment, a back-level of the scripting engine).

#15 Ruud

Ruud

    Hall of Fame

  • Hall Of Fame
  • 4887 posts

Posted 25 July 2007 - 10:32 AM

How do you do that nifty off topic thing?


(offtopic) blah blah (/offtopic) ... but then with square brackets

Off Topic offtopiclike this


On the left, beneath the smilies, are two links, one of which is this one for BB code help (but then in a popup). You can do some cool things here :P

Afterthought afterthoughtlike this even...


#16 Ron Carnell

Ron Carnell

    Honored One Who Served Moderator Alumni

  • Invited Users For Labs
  • 2062 posts

Posted 25 July 2007 - 01:09 PM

(offtopic) blah blah (/offtopic) ... but then with square brackets


LOL. There's even a BB Code to demonstrate BBCodes, Ruud ...

Off Topic offtopicblah blah


:P

#17 Ruud

Ruud

    Hall of Fame

  • Hall Of Fame
  • 4887 posts

Posted 25 July 2007 - 04:23 PM

Wow, this thing is amazing :P Learn something new every day. Thanks for the tip!

#18 Kal

Kal

    Whirl Wind Member

  • Members
  • 94 posts

Posted 26 July 2007 - 12:55 AM

Code as if you're in labor. You are.

I LOVE this quote Kim! It's so true :disco2:

#19 cre8pc

cre8pc

    Dream Catcher Forums Founder

  • Admin - Top Level
  • 13365 posts

Posted 26 July 2007 - 08:12 AM

Heh

I guess being a woman who has walked in programmer's moccasins and also had kids gives me a certain edge there... :naughty:

#20 EGOL

EGOL

    Professor

  • Hall Of Fame
  • 5185 posts

Posted 26 July 2007 - 09:06 PM

Great list, Kim. Thanks!

Where / How would you put web analytics into this development sequence?

Edited by EGOL, 26 July 2007 - 09:06 PM.


#21 Ruud

Ruud

    Hall of Fame

  • Hall Of Fame
  • 4887 posts

Posted 26 July 2007 - 09:33 PM

Where / How would you put web analytics into this development sequence?


After the initial delivery/start of a site I would suggest a continuous feedback loop from analytics through 1-4 and back again. Small, incremental steps with an eye on your stats can give you a hint of what works and what doesn't, what is liked and what isn't.

#22 cre8pc

cre8pc

    Dream Catcher Forums Founder

  • Admin - Top Level
  • 13365 posts

Posted 26 July 2007 - 09:40 PM

What Ruud said but also consider a rebuild situation, which needs the data to help determine step one (determining requirements).

Granted, small projects don't need to be so fanatical about laying a foundation. But the more in-depth and complicated the development stage is expected to produce means the more discipline, research and planning are needed at the very start.

The analysis comes in handy throughout the process because it measures and helps gauge progress. Checks and balances :)

#23 EGOL

EGOL

    Professor

  • Hall Of Fame
  • 5185 posts

Posted 26 July 2007 - 10:43 PM

Thanks Kim and Ruud! I appreciate the info.

#24 Jaimi2

Jaimi2

    New To Community

  • Members
  • 1 posts

Posted 02 August 2007 - 03:01 PM

I'm doing a major site right now and while this is certainly an open question depending on content I am generally using the following and a lot of it was learned after 10 years of interactive CD design. Much of the thinking travels.

1. 3 clicks to call-to-action

2. Copy should be structured to

a. inform
b. build expectation about service (what do THEY get?)
c. Call-to-action. (phone us, e-mail us, go to our store etc...)
d. that's it

3. Speak from the customer viewpoint - not your own. What will they get - what will you do for them. What problems do they have that you can solve etc. Avoid talking about yourself "it all started in garage in Cleveland" - who cares?

4. Never build a nav with more than 2 levels deep.

5. Keep the housekeeping stuff in the footer - navigate around what's important - the products and services.

6. If someone tells you nice graphics don't matter - they're lying.

7. Avoid dated UI elements - the button metaphor went out 15 years ago. Keep the bevels and drop shadows to yourself. Be selective about what you make the sexy focal points - it should be focused on the products.

8. Don't put links in that risk directing the viewer away from where you really want them to go. Every door out of the site is potentially lost business.

9. Can't think of any more right now....

Steve

#25 Black_Knight

Black_Knight

    Honored One Who Served Moderator Alumni

  • Hall Of Fame
  • 9339 posts

Posted 02 August 2007 - 03:39 PM

Hi Jaimi2, welcome to Cre8asite :wave:

I see a couple of the more widespread 'common denominator' rules in a couple of your points.

1. 3 clicks to call-to-action
[...]
4. Never build a nav with more than 2 levels deep.

It is those exact kind of rules that I believe Kim addressed in her first point: Forget everything you've been told you should do. Certainly, rules like these are so generic that I don't consider them usability, and for obvious reasons.

If you spend any time designing your site with precisely 3 clicks to call to action, you miss out on all those people who know exactly what they want from prior experience and want that call to action, such as the buy or contact link, right away in click one.

The real basic and fundamental rule of Usability is simply this: Never impose any rule upon te user that is avoidable through better design. Usability is the art and science of designing for people to be able to use a thing their way, even if their way does not meet your approval and is sub-optimal to your thinking.

The customer will do things their own way anyway, no matter what you do. If you don't allow them to do it their way on your site, they'll go elsewhere to do it the wrong-but-comfortable-way that they prefer. A less judgemental provider will get their custom, and so they should.

Hey, for all you know, there's an Obsessive Compulsive user out there about to make the biggest purchase ever, and he needs to click precisely 8 links before ordering. :D Let him. That's the secret of usability in a nutshell.


On another point, I was actually rather conerned when I read:

6. If someone tells you nice graphics don't matter - they're lying.

This is usability. If someone tells you that nice graphics don't matter then they don't to them. They are not lying. But they may be blind. They may be using a WAP phone with a screen smaller than your images, and with images disabled. There are all sorts of reasons why images will not matter to various people. To them, whatever time you spent on your images, and whatever great things you think those images will do, well, they won't.

The one thing to accept is that these people are not lying. No designer is so much smarter than their users to be able to decide that their ways or decisons are stupid and that they should be treated as children, ignored or made to do or feel about things some other way because 'you know better'.

I know what you mean there. You mean that for a broad range of customers, good, attractive images are a very great plus. That's absolutely true, but that is not usability. That's marketing. Usability is knowing that the marketing guys deal in common denominators, and the job of the usability person/team is to ensure fail-safes for the uncommon, the individual. That's because none of us as individuals actually have 2.4 children, no matter how many marketers make pitches for such couples. ;)



RSS Feed

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users