10 Usability Nightmares You Should Be Aware Of

Advertisement

Sometimes you just want to get the information you’re after, save it and move along. And you can’t. Usability nightmares — which are rather the daily routine than an exception — appear every now and again; usually almost every time you type your search keywords in Google. In his article “Why award-winning websites are so awful1” Gerry McGovern points out that “the shiny surface wins awards, real substance wins customers” and that is absolutely true.

Nevermind what design you have, and nevermind which functionality you have to offer — if your visitors don’t understand how they can get from point A to point B they won’t use your site. In almost every professional design (except from special design showcases such as, e.g., portfolios) you need to offer your visitors

  • a clear, self-explanatory navigation,
  • precise text-presentation,
  • search functionality and
  • visible and thought-out site structure.

And that means that you simply have to folow the basic rules of usability and common sense. You want to communicate with your visitors, don’t drive them away, right?

In this article we take a look at some of the usability nightmares you should avoid designing functional and usable web-sites. At the end of the article you’ll also find 8 usability check-points you should probably be aware of.

1. Hidden log-in link.

Backpack2, 37signal’s one of the most usable organizational and project management tools out there, explains exactly what the tool can be used for, how one can use it and which features it has to offer. However, once you’ve signed up, you might need few minutes to find out what you should do to actually start using the tool.

Backpack Login3

The “Log in”-link (hint: in the yellow box) should have a greater font-size — also icons would do the job. Every registered user has his/her own personalized page, however new registered users will need a while to find out how they can log in. As Lee in our comments said, “someone thats invested their time to sign up for a service will spend more than two seconds finding out how to log in.” Ok, but why should he/she? Why not just place the link somewhere where it’s visible? It sounds reasonable to us.

2. Pop-ups for content presentation.

Almost every modern web browser uses a popup-blocker to prevent pop-ups, ad blocks and further site content recognized as advertisement. Firefox, Safari, Opera and Internet Explorer make use of it — therefore the idea to use pop-ups to present the main content isn’t probably the most reasonable idea web-designer might come up with.

Adidas Pop-Ups4

However, Adidas developers team seem to consider pop-ups as a creative approach for their target audience. It’s not clear what ImpossibleStory.com5 is actually about — most users will never find out; even we were too lazy to deactivate our popup-blocker.

3. Dragging instead of vertical navigation.

Actually, this technique — not a real nightmare, but very unusual — might become a new trend in the future. Dragging, as used from .pdf-documents, can also be adapted to web-sites. Fichey6 offers a Flash-based solution. Interesting approach, however you can’t bookmark specific parts of the site – a typical problem for Flash-based designs.

Fichey7

An introductory info box on the start page of the site informs its visitors about the new way of navigation. The tool shows sites which are currently popular in social media. By the way, the displayed links don’t work – apparently, the tool shows the screenshots which are saved and embedded as images.

4. Invisible links.

Visitors have to know where they are, where they’ve been and where they can go next. If designers don’t present this information in an appropriate way, visitors can have serious problems with site navigation. Real Player8 had been using a bunch of invisible links9 for a while. Take a look at the picture and the labels below (originally created by Trenton Moss) — can you spot the links?

Real Player10

1, 3, 4, 6, 7 and 11 are links, and 2, 5, 8, 9 and 10 aren’t.

5. Visual noise.

Often less is more. Visual noise is probably one of the most typical problems large web-sites’ designers have to cope with. And it’s extremely easy to get it wrong. As Overstock11 does.

Overstock12

Bonus: It’s also not quite clear what is a link and what’s not. Overstock also uses a number of different link presentations and hover effects. Link or not a link? You might have a lot of fun finding out.

6. Dead end.

You can use different approaches to introduce your new web-service to your visitors. Scriblink13 welcomes its visitors with a pop-up and a Java-applet. Visitors have to provide some input to start browsing through the site.

Scriblink14

Nothing helps:

  • clicking on “cancel” doesn’t help,
  • OK doesn’t help,
  • full-screen mode doesn’t help,
  • clicking somewhere else doesn’t help,
  • closing the browser window doesn’t work,
  • clicking on the question mark for help doesn’t work.

Unfair, really. We just wanted to see what the tool does…

7. Content blocks layering upon each other.

A typical problem which always appears if large Flash-movies are used on large web-sites. The site navigation is hidden; whatever users might be willing to browse to — they have no chance.

Photoimpact15

The same problem on Yahoo.com16:

Yahoo17

8. Dynamic navigation.

What looks like a usable site navigation, shows itself soon enough from its worst side. Nevermind where you point your mouse pointer to — supporting images slide down and up and change the focus of the link you’ve clicked on. On the image below the link “history” was clicked – it moves away; and no, the sliding images aren’t linked to the page you’d like to browse to.

Brown University18

The effect appears in both left- and right-side navigation menus. Visitors might need some time to find out what is happening. However, once the idea is understood, the navigation isn’t that hard to deal with.

Kabe24319

The same idea on Kabe24320. Bonus: visual noise at its best.

9. Drop-Down Menus.

Drop-Down menus are useful for web-developers and almost always get on users’ nerves. If you — as a designer — hide navigation items in a drop-down menu you can save yourself a large amount of vertical space; however users have to focus the mouse precisely to get to the section they’d like to visit. It’s not usable.

However, it can be even worse. If the distance between different levels of navigation is too large (for instance because some navigation items have more text) users have to move the mouse horizontally. If the mouse focus changes its vertical position, users have to start from the beginning.

2Advanced21 and Brita.net22 are excellent examples for these usability nightmares.

2Advanced23

Brita24

Notice: it took us a dozen of attempts to actually make these screenshots.

10. Blinking images.

Sometimes you just want to read the content of a web-site you are visiting. And you can’t. To fight against the banner blindness advertisers make use of animated ads — usually animated .gif-images or Flash-movies. In both cases it might become extremely hard to focus on reading if such images are blinking all around the content.

Digital Web Magazine25, an excellent online magazine we read on a regular basis, has a disturbing animated ad on the left side of every article.

Digital Web26

Future Nightmare?
Pointing the mouse instead of clicking.

Dontclick.it2927, an interesting experiment in interaction design, explores a clickfree environment. It wants to explore how and what changes for the user and the interface once you can’t rely on the habit of clicking.

Dontclickit28

Within this interface you won’t find any buttons. Instead you navigate the contents in a different way — by pointing the mouse to the areas of the site you are interested in. What sounds like an interesting approach might soon become a usability nightmare – just imagine web-users trying to open external links in a new browser window; besides it’s interesting to know how exactly users will be able to, let’s say, open a list of links in new browser tabs (updated to clarify why we’ve put Dontclick.it2927 in this post).

8 Usability Check-Points You Should Be Aware Of

  1. You don’t use pop-ups.
    Pop-ups interrupt the browsing session of the visitors and require an instant feedback. Respect your visitors.
  2. You don’t change users’ window size.
    The same argument as the one against pop-ups holds. Some browsers, e.g. Internet Explorer, saves the browser dimensions and uses them for further browser sessions. As Ben Bodien commented, “it’s just plain inconsiderate to assume that you know better than the user how their software environment should be configured?”
  3. You don’t use too small font sizes.
    Long passages are harder to read, and to read brief sentences readers need more time. It holds also for links, buttons, forms, search boxes and other elements. Good news — in Web 2.0 the opposite is the case.
  4. You don’t have unclear link text.
    Links have to be precise and lead to the destination they describe. Ambiguous link descriptions should be avoided.
  5. You don’t have dead links.
    There are too many of them anyway; why would you want to point your visitors to a dead end?
  6. You have at most one animation per page.
    If blinking images are wide-spread through the site, it’s extremely hard to focus on one single site element. Give your visitors an opportunity to perceive your content. Using animated ads, don’t place them right along your articles.
  7. You make it easy to contact you.
    Maybe because you just don’t want to be contacted, but If visitors do want to get in touch with you, but can’t find any contact information, you lose their interest and trust. Disastrous for online-shopping, a missed opportunity for the rest.
  8. Your links open in the same window.
    Visitors want to have control over everything what happens in their browser. If they’d like to open a link in a new window they will. If they don’t want to, they won’t. If your links open in a new window you make the decision which is not your decision to make.

↑ Back to topShare on Twitter

Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine. He runs responsive Web design workshops and loves solving complex problems in large companies. Get in touch.

  1. 1

    Yeah. IMHO first place belong to hiden links.

    -6
  2. 4

    Another great article from Smashing! You guys rock, keep up the good work.

    1
  3. 5

    Great list, and they’re all really important. If designers avoid these basic problems, and can still deliver a good usable site, they’re off to a good start creating a good user experience.

    I love the “no holds barred” approach in terms of the examples you’re giving… Oftentimes, folks won’t mention the “popular” or well know sites –even when they have clear usability issues.

    Great post, very helpful reminders.

    2
  4. 6

    If only I could forward this article to every single person with decision-making power at my office without getting repremanded…

    1
  5. 7

    7. Content blocks layering upon each other.

    Ironic, we were just looking to a solution to this problem on a new site we are working on… Anyone have any useful links?

    0
  6. 8

    Good article! I agree with everything in this article, except for “Your links open in the same window”.

    I agree that you should be very, very careful with opening links in a new window. The problem is that unexperienced users don’t know how to open a link in a new window. In some cases you want to help these unexperienced users, e.g. when you link to a downloadable file, a printable version or a background process.

    5
    • 9

      Muhammad El-Nabawy

      July 19, 2010 11:06 am

      Agree

      0
    • 10

      I’ve recently switched hats from Quality Assurance Tester to Usability Analyst. I’m pouring over tons of web design blogs, books etc.. I also agree with all the content here, except opening those links on the same page. As a tester, I’ve always asked for those links to open in a new tab. I think inexperienced users get confused when the content changes from what they were looking at… and I’m fairly certain they are annoyed at how to get it back.
      This is interesting. The article is dated for sure, but all points remain, except this one. For me anyway.

      Thanks for the good reading!

      0
  7. 11

    Is there a usable version of any of these techniques?

    Google Maps, for example, uses dragging and you can bookmark/get a direct link to anywhere on a map found by dragging. It also feels quite natural.

    0
  8. 12

    I’m with you on that. Having an external link open in a new window can be very useul for some users. Especially those who use tabs.

    0
  9. 13

    Opening links in a new window is usually a bad idea; however, I think it is standard and accepted practice to open external links in a new window. This helps stickiness since the user won’t have to go “back” several layers to return to the site.

    1
  10. 14

    Top quality article that raises excellent points. Keep it up.

    0
  11. 15

    Really good write up about some of the bigger ones out there for usability issues. The “dontclickit.com” site is really neat to play around on, I couldn’t help but clicking on things at first…hard habit to break!

    0
  12. 16

    Nice new design and great article again :)

    -1
  13. 17

    Chris Papadopoulos

    September 27, 2007 3:46 am

    The drop-down menus are a particularly lazy way of designing. If you can’t fit all of your important links on the main page you’re likely organizing your site in a horrible manner and throwing way too much unnecessary content at users.

    Also the idea you presented about removing clutter is very important. John Maeda’s first of 10 rules to attain simplicity can be summarized as “thoughtful reduction”. Simply removing useless elements can go a long way towards making a site fun and easy to use.

    As always, very good article that mirrors a few of my own thoughts.

    -2
  14. 18

    You may be missing the point with #11 (even though this is supposed to be a 10 item list ). Dontclick.it is just an experiment with a non-clicking environment to show that you can intuitively pick up what you are supposed to do even without the “click” of the mouse and that it doesn’t take a long time to get used to it. It’s the only site I’ve ever seen do something like this so I would hardly call it a “nightmare.” Otherwise, great content as usual.

    0
  15. 19

    For once, I really have to applaud. To my thinking, some of these offenses are reason to be banned from the Internet. To combat anything intrusive, I use full pop-up and ad-block, and when all else fails I use lynx in a console, but really I’ll just go somewhere else.

    Just one thing to add: I never see this addressed anywhere else, but to what purpose do all the blog comment forms collect email addresses? I removed the email-required part from my blog’s comment form, because I have no use for the addresses and because that’s just like asking too much from a user before letting them participate.

    Come to think of it, has anybody ever received email from a blog comment? And God forbid they should.

    0
  16. 20

    I agree with Chris – 11 will never become a nightmare. It’s completely experimental. Either it will catch on or it won’t I haven’t seen gestures catch on with casual users for anything at all, and that is a similar approach to user interface. I’d also like to point out that video that circulated of an infant using an iPhone. The dontclickit.it concept is similar in someways. If an infant can get the hang of it, so could adults. I still doubt that it would ever catch on as one of these so called usability nightmares.

    0
  17. 21

    Very useful list, and even better with the impressive examples you give. It raises some points that give me a quite a headache every now and then. (I’d add not supporting Opera (like google does with their reader), but maybe that’s just me…)

    0
  18. 22

    8 and 11 are great. Maybe the eventhandling could be better for “kabe243″, but you donnot need 10 seconds to understand how it works. Even you say so! Why are those examples a nightmare? You donnot really explain!

    0
  19. 23

    And “speaking” of problem websites — trying to read this article on an 800×600 monitor makes the actual article (column) shrink to just slightly UNDER 50% of the viewport — and the graphics demonstrating your points are half (or more) hidden! Oops!

    0
  20. 24

    Me again. the email address thing was nothing compared to what happened after I clicked ‘submit’. I got taken to a CAPTCHA on a different page – why not put it by the comment box like everybody else? Then it doesn’t surprise you like a jack-in-the-box.

    Then after that, it goes to a page which is completely blank except to tell me the comment’s been submitted. No link back to the home page, nothing, just a dead end. Some users will be afraid to click the ‘back’ button for fear they will ‘undo’ their comment (not everybody understands how POST methods work).

    By the way, now that I’m done nitpicking, you have a fantastic site and I come here and refer readers here often!

    0
  21. 25

    As for Basecamp, users who have signed up are supposed to use the login URL they decided during the sign-up process, like copmanyname.seework.com. And the pop-up described in number 2, isn’t a pop-up, but a layer which will not be blocked by pop-up ads. That’s how far I got until I disregarded the article and stopped reading.

    1
  22. 26

    Great list, though I think you’re missing a bigger picture.

    0
  23. 27

    ummmm…. using 37 signals as an example of bad usability was a horrible decision. It lost you all credibility.

    As someone has already pointed out, if you’ve got an account you know how to log in, but more to the point, if someone has gone to the effort of signing up, then they will go to the effort of figuring out how to log in. But people won’t necessarily go searching for the signup form.

    Put another way, someone thats invested their time to sign up for a service will spend more than two seconds finding out how to log in. On the other hand, someone who has just found your service probably wont spend more than two seconds finding out how to sign up.

    If you want to build a user base, the signup form MUST be more obvious than the login, and 37 builds probably the most usable, sensible, logical web apps on the planet.

    But now I’m thinking you just picked on them to create some controversy, and you’ve baited me too.

    0
  24. 28

    Pretty good article. I love the examples shown. Finally someone else who agrees that 2advanced design makes some of the most horrible usability websites.

    0
  25. 29

    GREAT stuff. a lot of it should be common sense, but people ignore it for some reason. thanks for a great post. one of the most useful aspects of these kinds of articles is that you can bring it into a meeting, or even pre-emptively send it around to your co-workers who you know go in for crappy/facncy/useless UI features.

    0
  26. 30

    Another major usability nightmare – main navigation that changes from page to page. I’ve come across several sites that exhibit this behavior, and it drives me nuts!

    0
  27. 31

    Vitaly Friedman & Sven Lennartz

    September 27, 2007 6:26 am

    @Bjorn, Lee: you make an interesting point. Of course, you are right. However, as Lee said, “someone thats invested their time to sign up for a service will spend more than two seconds finding out how to log in.” Ok, but why should he? Why not just place the link somewhere where it’s visible? It sounds reasonable to us.

    0
  28. 32

    9. Drop-Down Menus – “it took a long time actually getting these screenshots”.

    My tip: Use HyperSnapDX (or any other program being able…) to use a timed Snapshot. Set the timer to 3 seconds, hit Full Screen Snapshot and do your Drop-Down-Menu-Magic.

    No hassle at all ;-)

    0
  29. 33

    Oh 1. Hidden log-in link. makes me mad every time I forget the link to our basecamp :(

    I mean seriously, hello? there SHOULD be a login button on the homepage.

    0
  30. 34

    Vitaly Friedman & Sven Lennartz

    September 27, 2007 6:33 am

    @Dennis: we do use special tools for screenshots, thank you. :) However, it was really hard to focus the mouse on the navigation section we wanted to highlight – even with a Snapshot timer. Really.

    0
  31. 35

    Wah, the example with hidden links is unbelievable !

    0
  32. 36

    I have to agree with everything you and Smashing Mag said. 37signals are an example example of an online company doing the right things and providing a great set of online tools, I have used Basecamp regularly for nearly 2 years now at work. I saw Ryan Singer in London at the Future Of Web Design conference this year and he talked a lot of sense.

    But.

    As soon as I read Smashing’s comment, I had to agree, a couple of times I had to login to their site and I did struggle to locate the small login text amongst all the other imagery and wording on the page. You are right about it being a secondary issue, as I’m sold on their products and will persevere to find the login, but it does seem odd that such an advanced usability-driven company have chosen to make it such a small text link in the middle of more eye-catching page content. I would have added it to the top line of links, out of the way, but a more visible and a more regularly used position (in my experience) for login links.

    0
  33. 37

    nice article. and the redesign smashed me :-).

    0
  34. 38

    I add one more example for #2: IBM Lotus Symphony. I tried to watch the tour when the news of this office suite came out. However, it didn’t allow me to see the tour unless I accepted its pop-up windows. After I add the site to the list in my Firefox, I still couldn’t watch the presentation. What a stupid web design it is!

    0
  35. 39

    @Bryan, the word is using SWFObject will fix the issues with flash sitting on top of everything. And lightboxes can go on top, too. Check this link: http://blog.deconcept.com/swfobject/forum/discussion/84/
    It’s also a good idea to use SWFobject for your flash for a multitude of other reasons, but you can see the site for that: http://blog.deconcept.com/swfobject/

    @Vitaly. great article. you guys pointed out some usability concerns that arent the standard fare.

    @Lee. 37signals are very smart and talented, but they aren’t the gods of usability. I forget my custom login URL for backpack and basecamp ALL THE TIME. Why would a user think to log into their basecamp account at some updatelog.com subdomain???

    0
  36. 40

    Photoshop Tutorials

    September 27, 2007 9:39 am

    Great article, it points out those mistakes which are made by even expert designers. I like the point about Drop Down Menu especially.

    -1
  37. 41

    @ Lee

    I think you fail to see the point here and going overboard with comments like “using 37 signals as an example of bad usability was a horrible decision. It lost you all credibility.” is a bit ‘dramatic’ don’t you think. 37 Signals is not the ‘be-all and end-all’ of usability, far from it.

    Fact of the matter is they did get it wrong in this case and putting a simple “Login here” link on their homepage is far from a unreasonable request.
    Just think of someone that after a while of not using Backpack, Basecamp & Co. comes back to the site and can’t remember what the login link for their company/group is.

    A simple information page reminding the user that their login is their company/group name, maybe even with a “reminder” mail function, is definitely not too much to ask for.

    0
  38. 42

    i am truely agree on point #7

    0
  39. 43

    visitors are king..webmaster are servants. =p

    0
  40. 44

    Not Vitaly Friedman or Sven Lennartz

    September 27, 2007 10:58 am

    Another common usability problem is not being able to find the information you are looking for.. such as the name of the author of the “10 Usability Nightmares You Should Be Aware Of” article.

    Introductions aside, I wanted to point out a few things:

    Issue #1 – The issue you cited on Backpack isn’t an issue with the UI (yah it would be nice if there was a login there but is it really needed?), it is an issue with the person writing this article going to the wrong location. For example, I use Basecamp on a regular basis (another 37Signals product) but never in my life would I ever go the main Basecamp product site to login to my Basecamp. I would, however, go to my Basecamp URL directly and see that the first thing it asks me to do is to login. The context here is missing, the reason people go to the site is to learn about the product, not to use it.. to use it they go directly to their version of the product.

    Issue #5 – In the issue you cited overstock.com and defined it as visual noise. The actual problem here is not visual noise but the lack of white space. If you look at how the text flows under each product you will see less white space under some items than others. This is what makes the page busy. If the designer had added proper white space the page wouldn’t be so so visually noisy, as you put it. If you are going to show a problem like this, show us what it would look like if you fixed it and explain how to fix it. Don’t just show us problems.

    Issue #9 – In the issue you cited with drop down menus is actually nothing to do with drop down menus themselves but rather with how some people implement them. Even more specifically it is to do with the on-mouse-out time-out function. The sites you listed have a short or no time out function for the user to react in the event their mouse moves outside of the navigation hot spot. Good drop down menus have a reasonable delay before the entire menu collapse back down or in some cases you can only get the menu to collapse back down if you click on a parent item.

    Issue #10 – The issue you cited on Digital Web Magazine is actually not an issue with the design but a issue with the design of an ad that an advertiser created. You’d be pretty hard struck to be able to offer up ads on a site a never see an animated GIF or worse, a flash animation.

    I think this article is quick to dismiss things as incompetence on the designer’s part yet fails to acknowledge how things work in the real world with real clients and real business needs.

    - Not Vitaly Friedman or Sven Lennartz

    0
  41. 45

    The Google Ads served before this article is also annoying. In print it’s not there, but on monitors, it’s annoying to have to see those before actually reading the content.

    0
  42. 46

    Very good article…I’m designing a website right now and I’m taking in this information…so now i want to change a bit of stuff, especially the “less is better” bit….

    ps….dont the current aol.com site looks just like yahoo.com?

    0
  43. 47

    Phil said:

    Google Maps, for example, uses dragging and you can bookmark/get a direct link to anywhere on a map found by dragging. It also feels quite natural.

    But that isn’t the only option for using Google Maps. You can work their maps just fine without ever having to drag. A simple click centers the map. Offering more than one way to achieve goals is done brilliantly there.

    0
  44. 48

    Resizing the browser window would be my number one pet peeve.

    0
  45. 49

    Only a heavyweight object can block another heavyweight object. Hence what a lot of developers will do is place a transparent iFrame underneath the object they want on top (ie the menu)

    0
  46. 50

    One incredibly annoying point is missing from this list…

    Web developers, please don’t commandeer my speakers for your purposes. Ask first. This will give me a moment to make sure it is at a reasonable volume. Or, I can pause my music.

    Might not agree with me that it is a “usability” issue, but I kinda think it is. It is my #1 annoyance at any rate (2advanced included).

    1
  47. 51

    Vitaly Friedman & Sven Lennartz

    September 27, 2007 2:55 pm

    @Not Vitaly Friedman and Sven Lennartz: thank you for your detailed comment! All articles are written by Vitaly Friedman and Sven Lennartz as written on our About page.

    0
  48. 52

    Sometimes opening new links in a new page is actually what visitors feel that “should” happen. As long as they’re links of your own website they should open in the same window, but as soon as it’s an external link, it should open in an external browserwindow imho.

    As a visitor, I would feel irritated if I want to take a quick look at a couple of links to external websites that the site I’m currently browsing through has, and find that I have to keep clicking the “back”-button in order to reload the site I intended to stay. ;)

    -1
  49. 53

    In reply to (1): you get your very own Backpack address which you should bookmark, the site you are reffering to is a promotional site for new users.

    Think context based design, not out of a strict ruleset.

    -1
  50. 54

    Good Post Smashing Magazine..

    Please post something on Proper Google Adsense Ad location on website also..

    -1
  51. 55

    Some great points (I like the point about drop down menus especially) but most of them are obvious.

    Like your new design :).

    -1
  52. 56

    I love Basecamp and most of the 37signals’ products. The features are great, the applications are really awesome. I must admit I have become quite a fan..

    Until I viewed the source of their pages. Layout tables, anyone?

    -1
  53. 57

    @ Layering Flash and HTML:

    The problem with flash obscuring for instance menus is easily fixed: Set wmode param/attr to opaque og transparent and the problem disappears.

    Without wmode set to something other than default objects are rendered in their own ‘layer’ on top of the rest of the HTML (to save resources). Set wmode and the flash object is rendered in the same layers as the rest of the site, and obeys standard rules for stacking.

    See: http://www.communitymx.com/content/article.cfm?cid=e5141

    Jesper

    -1
  54. 58

    Number 7 is just bad coding rather than a useability issue. Setting the drop-down to a higher index than the flash is simple fix.

    -1
  55. 59

    Nice article. I hate the pages with drop-down menus and flash animations on top.

    -1
  56. 60

    You can fix that issue in 7 pretty easily with a bit of research…. especially seeing as it depends on which browser and element your overlapping… its well documented too, i love the web.

    Also, dontclick.it is probably one of the most well-built flash sites around, please admire its smoothness…

    Thanks for the post!

    -1
  57. 61

    *) IFRAME src attribute will trigger “Unsecured Items” message in https pages!

    Btw, great article and thank you for sharing this with us.

    -1
  58. 62

    Since a normal user mostly is just scanning a website, the hidden links will make to loose the visitor.

    Imho the overlapping content blocks are only bad web layout – not truly tested with different browsers and
    resolutions.

    I would suggest the use of pure flash w/o an alternative way to view the site to apperar in the list

    my 2 cents – the polarizer

    -1
  59. 63

    Vitaly Friedman & Sven Lennartz

    September 27, 2007 6:53 pm

    @Sachin Jain: Google AdSense? We already did! Google AdSense: Facts, FAQs and Tools.

    0
  60. 64

    I like this article: practical tips that don’t refer to web standards and validation are an absolute must, in my opinion. It’s the simple choices relating to clutter, position, contrast etc. that are more important. Web Pages That Suck has been looking at these ideas for years; it also has a good dos and don’ts list.

    The first usability rule is don’t add things just because you can, or because you think a web site should look clever in some way. Don’t be scared to keep it really basic.

    What about a list of sites that get it right? Off the top of my head, I’d suggest todoist and tumblr.

    0
  61. 65

    May I ironically suggest : don’t have too much add at the beginning of your page, such that you can see only a little of the article if you don’t scroll down. Exemple : Smashing magazine :-)

    0
  62. 66

    That Overstock screenshot looks like scores of other sites. I’d like to see you present your suggestions for improvement besides something so vague as decreasing visual noise. Perhaps a case study?

    0
  63. 67

    A quick blurb to all the comments regarding 37 signals, if you never login from the main page then why have the login link? Basically if something is on you site it should be usable….

    0
  64. 68

    Great list!, Checkout my Yahoo! Flickr Usability study at:

    http://i5bala.blogspot.com/2006/11/hello-yahoo-simple-features-or-changes.html

    0
  65. 69

    Or when you are playing music on a website. If you are going to play something, warn me first.

    0
  66. 70

    I may add that “Visual Noise” can be explained by Tufte’s “1 + 1 = 3″. The effect is yet more visible when using many prominent borders or other types of “chartjunk”, and yet you already showed a great example with the Kabe243 screenshot.

    0
  67. 71

    to the author of this post: the screen is clickable to the right of the pictures illustrating your article. I’m on a 1920×1200 screen, so that makes pretty much half the screen clickable. That’s my 11th usability nightmare…

    0
  68. 72

    Great article. The first point hits the nail on the head with “hidden” login text. Too many site try to work the login link into some part of the site copy – which is very dangerous.

    Another big UI problem I’ve seen lately is changing menus. Google is a prime example of this. If you use say iGoogle, then go to your account page, then login to any google service – you can’t usually get back to your account page, and usually can’t even get back to your iGoogle (or regular google) homepage. Without having to re-type in the URL.

    If interested, I’ll send over some screen shots of the UI.

    0
  69. 73

    Do you really think that dontclick.it is a future usability nightmare? I think it already is one now. I don’t move my mouse too fast because I’m just a bit tired, and so ich just try to hover the second link from the top in a subnavigation (what was it about drop-downs, aren’t they bad anyway?) and before I reach the second link the contents of the firs link pops up between the two links, multiplying the distance I have to move the mouse by at least 20. Not a nightmare? A drop-down menu nearly is a usability dream compared to that approach…

    But speaking of usability… why can’t I focus your “Submit Comment” button with a tab from the comment field?

    0
  70. 74

    “#6 You have at most one animation per page.”

    Is this rule based on user comments, or on the opinions of someone who relies on ads for $$? 1 animation is 1 too many. The first request I get from clients when setting up their computers (after the pop-up blocker) is ad-blocking. I usually throw in Flashblock too, and haven’t had any complaints.

    0
  71. 75

    2. You don’t change users’ window size.

    Dang straight! If you do, and I find you, I will drag you out in the back lot, beat you senseless, take your lunch money, IM your mom to come get you and then give her a wedgie when she shows up.

    One of my biggest peeves. Is it obvious?

    0
  72. 76

    The best mail client has just one small usabilty issue that I wish they would address…

    Hey Gmail…I can’t EVER seem to find your REPLY LINK!!
    Is it at the bottom of the page…along the far right side???
    How about placing it right above the message, or along LEFT side??

    Just LOOOVE everything else about ya though!!

    0
  73. 77

    @indigo: you don’t have to hit the “reply” button, you just start typing your message in the reply box at the bottom of your message. How much easier can it get?

    0
  74. 78

    first, i had to chuckle at the headline, as that type of grammar is oh so common these days, and becoming less a speedbump.
    Do people really find “10 usability nightmares of which you should be aware” all that stodgy?

    :)

    but with regard to one nightmare in particular, consider this the following please.

    worse yet, the dreaded “we don’t serve your kind here” alert:
    “On Mac Computers, Scriblink is only compatible with the Safari browser.”

    0
  75. 79

    Very nice, even though most designers should know this stuff already.

    HellYeahDude.com approves!

    0
  76. 80

    Nice list. Many of the things mentioned should be obvious.
    I find it very hard to find designers that focus on site navigation and usability.

    0
  77. 81

    Smashing redesign!!!!
    And useful article ;)
    Keep up the good job!
    And keep showering with more GREAT articles!!!

    0
  78. 82

    @effisk: Yes! This page itself s a great example of a usability nightmare. Not realizing that all that whitespace next to the site images was a link, and being one who middle-clicks to scroll down, when I middle-clicked on the whitespace next to the scribble site image it opened in a new tab (without my noticing) and brought up that annoying Java popup which wouldn’t go away when I clicked cancel. How annoying!

    0
  79. 83

    Oh, and another usability nightmare: Only the first 80 comments are shown on this page although it reports that there are 117. How do I get to the next ones? I dunno, I still haven’t figured it out, maybe you can’t, maybe this will never be seen by anybody…

    0
  80. 84

    Those google ads are positioned really annoying… Please, can you re-consider their placement? Or maybe add “Make a donation” button instead? I’m sure many of us would like to support your great work!

    0
  81. 85

    nice post

    but i have to say that the very most of your ‘featured’ wordpress templates do crash if the font size is changed.

    0
  82. 86

    Vitaly Friedman & Sven Lennartz

    September 28, 2007 5:57 pm

    @effisk, Adam: fair enough. We fixed it. Thank you.

    0
  83. 87

    Vitaly Friedman & Sven Lennartz

    September 28, 2007 6:00 pm

    @Adam: the number of comments is a sum of the actual comments plus the number of trackbacks. You can switch to trackbacks right under the articles.

    0
  84. 88

    (11) Over-use of AJAX and other hyper-interactive features. How many times have we as designers and developers been made to use interactive elements, be they Flash or some form of fancy JavaScript, and they just aren’t necessary and actually do nothing but distract the user from the actual content?

    Don’t get me wrong, I love add little bits of interactivity into my work and I love making my sites extra pretty so the user enjoys coming to them to look at the content, but in the end it’s about presenting the content, not about making a website that you, the designer, gets turned on over.

    0
  85. 89

    1) I don’t think the criticism of the Overstock page is valid. Every item is a block with 5 identical vertical modules: Picture of the watch, linked description of the watch (with rollover color change), price, retail price, and review (if available).

    I would find this really very helpful if I was shopping them for a watch. Really, I think this is actually an excellent page, giving me exactly the information I would want, assuming I was just browsing for a new watch. (And I promise, I have no connection to Overstock.com and actually don’t really like it that much.) I’d be much more irritated if one of the information items was omitted and I had to click through to find out the rating or the retail price.

    You may be right that they have a large and confusing variety of hover effects when this example is compared to other pages, but within the context of the example, there isn’t any confusion at all.

    2) You got my favorite pet peeve on #7. It drive me nuts when navigation or content I want to see is obscured by a second layer of content I don’t want to see. the Major League Baseball site(s) is a horrible offender. If you want to see the home team schedule and order a ticket, they run up a video over top of the schedule and ticket-ordering links. It’s very hard to turn it off.

    Brown University apparently has some idiot who keeps at it. They revamped the page after they were featured in a “worst web pages” site, and I thought they had caught on.

    Great article. I hope a lot of the “more is better” movement gets a clue.

    0
  86. 90

    I agree with everything here… except for number 8. In the land of tabbed browsing, opening links in a new window is king. I ALWAYS open links in a new window. That’s because very rarely do I want to leave a webpage I’m currently reading to go to where the link points me. Usually these links are located in a text block I’m reading; clicking the link breaks into reading and requires me to change my focus to investigate the link, after which I have to return (and so help me if that link doesn’t lead me somewhere else…). My only option is to perform a multistep process to open the link in a new window (right click, OINW or shift-click) or I have to try to middle click, which more often than not misses the mark and results in the scroll-page function coming up. PITA. What I want to do is open these related links in a background tab so that I can finish reading the current page, then go check out related content.

    Here’s the facts: Navigation links that lead to other pages of the current website (on the current domain) should open in the same window. Related content links, or links to other webpages not on the current domain, should always open in a new window.

    0
  87. 91

    Great list. I would consider many of these major mistakes in design.

    0
  88. 92

    I would hardly call a drop down menu a serious usability nightmare. Most of the time it’s a poorly designed drop down that creates a problem.

    Clearly the fact that they’re used on every program, including any browser you work with, underline the fact that they “always get on peoples nerves.” What have we been doing for the past twenty years or so…

    0
  89. 93

    I don’t agree with this:
    8. Your links open in the same window.

    I think only external links should be opened in new window.

    Otherwise great article! Thanks

    0
  90. 94

    I really don’t see an issue with overstock, besides not having a “call to action” button.

    0
  91. 95

    This is probably the best post you’ve made after the WordPress themes. Simply Smashing!

    0
  92. 96

    “Your links open in the same window” – no good, except where the link points a page on the same website. I really hate if I read articles with inline text links, click to them, and the new page (from another site) opens in the same window or the same tab. Then I think I leave this new page in the background to read it a little later, and searching for the original article but it was in the same window. Or I start to read the other article immediately but I decide that I’m not interested in it and close it. Or what worst, open another new link from this second page, and so on. Then I close these pages (when I think these are _these_), and the whole thing disappears, all closed, I have to open a blank page and start browsing again. Or I should click back-back-back-back-back or use the back-history to land the original article again, etc, etc… So awful.

    OK, I have the chance to right-click and select “Open in new tab”, but it’s a one more click, and I don’t want more clicks, don’t want use right-click menus or CTRL buttons. I just want simple clicks for open and for close. And many websites has javascript links or other tricks which make impossible to use “Open in new tab”, or they use it in a bad way.

    So my opinion is that outer links that point to another website should always get opened in a new tab or a new window — this is more reasonable now with the new browsers having the tabbed browsing function.

    1
  93. 97

    Or when you are playing music on a website. If you are going to play something, warn me first.

    0
  94. 98

    Hello… I ´ve traslated this great article to spanish.. Take a look: http://www.estandaresyaccesibilidad.com/2007/09/las-10-pesadillas-de-la-usabilidad-que.html
    Thanks!!!

    0
  95. 99

    Ok Ok, tip #eleven.

    Please do not build a blog orwebsite thart can’t use my window space. And for so get my scrollbar ABUSED. Users don’t like and don’t have to scroll too long for visualize ALL the page content.

    Look at this page man, its sucks!

    0
  96. 100

    This is awesome stuff! Very very useful for web designers. The best thing to teach is to tell what is wrong. Awesome stuff guys! Cheers!

    0
  97. 101

    quite afraid to click into the dontclick.it site, hehehe.

    for me, i really hate those ads where they accidentally expand whenever your pointer hovers over(gr?) them. you just have to do the closing bit over and over again.

    anyway, erm, yeah, alvaro is right. although i would’ve put it in a gentler way :) but i must say, you guys always give good content :)

    0
  98. 102

    Lovingly written, truthful, and, now, bookmarked.

    0
  99. 103

    I was JUST looking for a log-in tonite on Backpack’s HighRiseHQ website (I have an account already) and could not find it to save my soul. And then I found your website a little later. Thanks for letting me know Im not crazy… and a good chuckle.

    0
  100. 104

    Your links open in the same window.
    Visitors want to have control over everything what happens in their browser. If they’d like to open a link in a new window they will. If they don’t want to, they won’t. If your links open in a new window you make the decision which is not your decision to make.

    I don´t agree at all to this point, if you are moving away from your own webpage, the target must be set to blank. There are users that don´t know how to open a new page, so if they would like to see another page, and at the same time don´t loose the page they first was visiting, target blank i the right thing.

    1
  101. 105

    Opening in another window by default has it’s own problems. The back button disappears. This is really obvious odd when the browser is set to full screen and the user is running ie6 (which lots still do). They can’t find their original window. Also, _blank is not part of the w3c standard.

    0
  102. 106

    Drop-Down Menus…
    Well, I don’t have power to make site structure and flow chart at my work place. I only do design and development. I almost alway get 2nd to 3rd level navigation, and it contains more than 10 sub menu. I think Drop-Down Menu is the good solution, do you have any better idea?

    0
  103. 107

    Nice list. One of the things I hate most is a new window of a set size – grr – thats my choice!!
    In the desktop world I still find the concept of a tiny fixed dialog window size… move on! We don’t have 800×600 monitors any more… OK – rant over ;-)
    In general especially with web sites it’s best not to go against the norm – such as unobvious links etc… Thanks again.

    0
  104. 108

    Website Consultant

    October 2, 2007 10:39 am

    Ah, very basic, very true, and very much common mistakes. Dropdowns that you have slide over to are a particular pain, and the hidden links particularly when you have a deep site with a lot of content to study, this can be a huge no-no. We need visual feedback of where we’ve been and what we’ve just reviewed.

    Totally agree, too much some clients just don’t want to spend the time/$ to do things right.

    0
  105. 109

    Website Consultant in Washington DC

    October 2, 2007 10:40 am

    Ah, very basic, very true, and very much common mistakes. Dropdowns that you have slide over to are a particular pain, and the hidden links particularly when you have a deep site with a lot of content to study, this can be a huge no-no. We need visual feedback of where we’ve been and what we’ve just reviewed.

    Totally agree. It’s expensive to design site right, unfortunately, and some clients just value the web quiet the same, at least not enough to understand why their bounce rates may be so high.

    0
  106. 110

    “Opening in another window by default has it’s own problems. The back button disappears. This is really obvious odd when the browser is set to full screen and the user is running ie6 (which lots still do). They can’t find their original window. Also, _blank is not part of the w3c standard”

    What the back button is used for when the actual page is the first page in that very window or tab? LOL! This thing is all about that you don’t have to push back buttons, but you simple close the window / tab you don’t need anymore, and the earlier windows / tabs still remain in place where you’ve left them.

    Fullscreen is a silly use of a web browser, it’s actually a user’s idiocy when he uses the browser in fullscreen and he doesn’t find buttons and interface elements.

    Target=_blank is part of standard HTML DOM. If the W3C finally and completely takes it out from new standards like XHTML it will be a serious mistake, if they won’t replace it with an equivalent parameter or solution. W3C are not gods — they do the good, but they do mistakes too.

    1
  107. 111

    @ahelg You talk in your first post about opening in a new window by default because most users don’t know how to open in a new window by using the right-click options. A lack of user knowledge. It’s the same issue with users having the browser in full-screen mode. Whether it’s good practice or not, many inexperienced users do it, so you need to be aware of it.

    Also, the w3c WCAG standards for accessibility warn against opening windows using _blank. Whether you like their standards or not, their standards are what contracts are won and lost on. “Can you provide level AAA accessibility?” If you open a new window using _blank you can’t.

    I do sympathise though with the idea that external sites ought to be opened in a new window, but I wonder whether trying to educate users into using ‘Open in New Tab’ might be a better plan.

    0
  108. 112

    Apologies for the first comment in the last post – it was Idar C Quist not Ahelg who said users might not know how to open in a new tab/window.

    0
  109. 113

    I agree on the hidden “log in” links. Maybe backpack isn’t the best example, but there sure are sites that take some time to find the login link (like imdb). I think it’s best to make a big “sign up now” text next to a form where you can enter the login and password.

    0
  110. 114

    I know flash is all the rage, and any one who is any one HAS to use it in abundance, but seriously…. my year old laptop nearly has a coronary every time there’s more then 1 on a screen. (the don’tclickit site was a horror)

    The thing that bugs me most are web designers who are out of touch with their users. I see businesses that rely on lower income users who design web pages that require high-speed internet access. You ever try flash on dial-up? (And yes, there are users who are still forced to use that.) There used to be a comprimise for this… but it seems as if web designers have adopted a myopic view of who will use their website.

    0
  111. 115

    Maybe it’s my browser, but the article is crammed into the left 1/4 of the screen and the rest of the screen is blog lists and white space. I would consider that a major useability flaw.

    0
  112. 116

    I second that complaint. Many of the example screen shots were cut off due to the fact that the site is only using 1/3 of the screen width.

    0
  113. 117

    Okay, for those of you you think that opening all or external links in a new window is okay: the only way to see if it is actually usable for your site demographic is to test and see. It has been shown in studies that some users don’t realize that they have a new window open and it disables your back button.

    It is wrongheaded to blame the user for being too stupid to learn how to open links in new windows. It is wrong to blame users for browsing full screen (which I do all the time on my laptop) and it is wrong to assume that all rules apply for all websites.

    If you can prove that a design that breaks standards or breaks commonly thought usabilitiy guidlines will measurably increase user response and you have the numbers to prove it, then do it. If you don’t test and aren’t going to then you may as well follow convention so that the user has a fighting chance at getting the solution they are looking for.

    On opening in a new window: for those who like to do it. In Windows, FireFox, IE7, Opera and Safari all allow you to control the opening of links in a new tab by clicking on the scroll button. No Extra Clicks. No CTRL+click. No Right Click context menu click. Just find your scroll wheel and click.

    On Stickyness and target=”_blank” and opening links in new windows: This is unproven. If you need to trick people into staying on your site then either write more compelling content, omit the link or place a list of link references at the bottom of the article. Iniline links should be true hyper links. There is no reason to place a link about something that is within the document if you feel that people aren’t going to get to the whole message of the article. If you have to use target=”_blank” or some javascript workaround, reassess if you actually need the link or a contextual explanation of the thing linked to. Remember here in many cases the text on a page is to acheive some type of goal for the site owner as well if you place links that detract from the goal or distract the user from their interaction then the link should never have been there in the first place.

    I have on occasion used external links that open in a new window but in all cases I indicate both visually and in the title attribute with a note that the link opens in a new window.

    On the flash and overlapping content blocks: this is bad design all the way not because they have broken two rules (inlcluding tremendous dropdownlists) but because they don’t know how to properly include flash using the object element and proper transparency and z-index of the surrounding elements (i.e. the dropdown–its container must have a z-index higher than the flash object and its container or you get this type of overlapping. Part of this is the Flash implementation in the Dreamweaver/Flash suite where they are placed using the old proprietary Netscape embed element and not using the object element. There are many ways to include flash that can be unaffecting of the other elements. The examples used just show laziness or ignorance on the part of the designer.

    Test, measure, prove your are right.

    0
  114. 118

    I agree with your ten points, good article! I do find myself migrating away from websites with UI irritations such as these. What I really find amazing is some really big-name sites do employ these tactics. It’s more than sad, it’s actually quite pitiful that highly paid teams of “experts” produce such utter crap. I find it really inexcusable when the user is left hanging with un-usability because the developers need to make cool stuff. (IMHO a lot of un-usability is directly attributable to creators forgetting the user)

    0
  115. 119

    Great Article, but did anyone else notice that the Title of this Article is one of those annoying “Invisible links”. When you click it the adverts reload.

    0
  116. 120

    Good article. I think there are several more I’ve run into as of late. Many dealing with Flash and auto plays. Very similar to #7. Thanks for the post.

    Ryan
    http://www.mofata.com

    0
  117. 121

    What the back button is used for when the actual page is the first page in that very window or tab?

    The back button is used to get back to the previous page you were looking at, by forcing the user to open a new window or tab, you’ve broken that functionality. There was some research done (by Jakob Neilsen IIRC) which showed the back button was the second most used navigation function (after following hyperlinks).

    LOL! This thing is all about that you don’t have to push back buttons, but you simple close the window / tab you don’t need anymore, and the earlier windows / tabs still remain in place where you’ve left them.

    The point is, by forcing links to open in new windows you are forcing them to use their browser in this way, rather than giving them a choice of how to use their browser.

    Then I think I leave this new page in the background to read it a little later, and searching for the original article but it was in the same window. Or I start to read the other article immediately but I decide that I’m not interested in it and close it. Or what worst, open another new link from this second page, and so on. Then I close these pages (when I think these are _these_), and the whole thing disappears, all closed, I have to open a blank page and start browsing again.

    Fullscreen is a silly use of a web browser, it’s actually a user’s idiocy when he uses the browser in fullscreen and he doesn’t find buttons and interface elements.

    I don’t see how not being aware of interface elements is idiotic while not being aware of how many browser windows are open, apparently, isn’t?

    OK, I have the chance to right-click and select “Open in new tab”, but it’s a one more click

    Or you could just use the middle mouse button, which is just one click and, in every tabbed browser I’ve ever used, opens links in a new tab.

    0
  118. 122

    back button can be used to view previously visited page. if current page is the first page then no need to give back button, its against the standards of creating a website.

    0
  119. 123

    Great article! I absolutely enjoyed it. I agree with pop-ups being so annoying 100%! I absolutely hate them and my eyes hurt when viewing blinking images.

    0
  120. 124

    Re #8:
    Links to PDF files that open in the >same

    0
  121. 125

    Um, how about #11 – Don’t put annoying text ads right before your article! Example – smashingmagazine.com. Otherwise, with you 100%

    0
  122. 126

    How come ‘this’ web page design is so bad, all squeezed over to the left? 127 (and counting ) comments with no paging – yuk!
    Do as you say and not as you do perhaps.
    FTR – I dislike flyovers, esp when you (attempt to) click a link beneath and the flyover pops up getting in the way. What’s wrong w/ clicking anyway – it works fine in windows apps. Is it so hard to click the mouse?

    0
  123. 127
  124. 128

    The point is, by forcing links to open in new windows you are forcing them to use their browser in this way, rather than giving them a choice of how to use their browser

    It’s okay, I see. And I agree.
    But on the other hand I think most of the users (I mean about 95-97%) doesn’t know too much about browser settings, using links properly, right-click menus, middle buttons or fullscreen. When someone complains about he uses the browser in fullscreen (by his own decision) and then can’t find the back button or other interface elements… I don’t know what to say, funny or sad?
    How many users I have seen click on a link that navigates to a new domain, then close the whole window, start a new browser window, retype the original URL, and start to read the original article again. It’s silly. I say that users are dumb, if they aren’t then there wasn’t so much virus infections, attacks and cheating with personal data. They will use links however we make links to be used. They don’t need this kind of freedom to decide what to and how to click. The smart users are a minority.

    Anyway, for me as a user it’s still more comfortable opening links from an outer domain in new tabs or new windows, but I see that many are against it. Now I can accept it and agreed the quotation above.

    Or you could just use the middle mouse button, which is just one click and, in every tabbed browser I’ve ever used, opens links in a new tab

    Except when it doesn’t. Or if you use the middle button for an other function. For example, I have a simple 2+1 button mouse, the middle is the scroller and was set to double-click when pressed. Nor in IE7 neither in FF it doesn’t open any links in a new tab.

    0
  125. 129

    the example with hidden links is really unbelievable

    0
  126. 130

    I’ve seen worse than browser resizing. I’ve seen where pushed plugin settings are forced. This can cause failures where other apps rely on default settings and break “applications”.
    Yeah, I know PDF is not an application platform, or should never -ever- be more than an “alternate format”, but we’re Gov’t,. We drink a lot of koolaid.

    0
  127. 131

    I agress that external links are often opened in a new window. I understand why people say they should be, but it is always a pain as a user. I also like pdf’s to open in a separate window.

    Not sure I totally agee with the drop down menus point either. If done badly, yes it is a pain in the proverbial, but if you have 3 levels of navigation it is very difficult to make that clear to a user. You would need top nav and 2 side nav bars, making it very confusing for a user. I have just been using site tracking and have seen just that in one of our sites. The only way I seem to be able to make this clearer is drop down windows.

    0
  128. 132

    The points seem a little traditional, all the new approaches are denied.

    0
  129. 133

    I generally agree with the points. The examples range from annoying to amusing to bizarre. The one most likely to make me leave a web site is: #7 “Content blocks layering upon each other.”

    #10 “Blinking images” is easy to fix. The example contains an animated GIF. Just press ESC to stop them.

    0
  130. 134

    Thanks for the detailed list. I read it carefully and it made me thinking of it some hours ;-)
    But Your Point “Your links open in the same window.” I can’t completely agree. You are right – we as users wants to know what happens by clicking on a link/symbol/image. But I guess: to open links in an external window is not the same like i.e. open images as popups which are blocked.
    IMHO the use of opening links in an external window is such as useful as the link really is an external link (referreres, sources etc.).

    If we sign the link to say “hey its an external link” – so I guess its usable and legal. For me the conclusion is the use of a couple of favicons for links.

    I spend much time to think about this and wrote a small entry on my blog (german!). The source can be found at Ask the CSS Guy.

    So long,
    Gerald

    0
  131. 135

    @bryan: to get your html content on top of your swf, try setting flash’s wmode param.

    0
  132. 136

    Nice article. I don’t quite agree with the ‘links in same window’ suggestion, though. I prefer to use new windows for links to sites that may require the user to go back to my site for any reason (saves using the back button). For other links, then I’ll keep them in the same window. To each their own.

    0
  133. 137

    You should add adsense blocks below the post title to the list of navigation nightmares.

    0
  134. 138

    aii guys can anyone explain to me about unclear step sequences for common usability problems??

    0
  135. 139

    has the author not heard of Jakob Nielsen’s usability heuristics? Why bother making up your own petty “checkpoints” when there’s a master list that can inform even the dull to make great websites?

    0
  136. 140

    9. Drop-Down Menus
    if really “it took [you] a dozen of attempts to actually make these screenshots.” you maybe suffer from the Parkinson’s disease..?
    It’s easy to navigate in both of your examples. The distance between different levels of navigation is large in both cases – but NOT too large, since the active area is expanded from left to right, the “users DON’T have to focus the mouse precisely to get to the section they’d like to visit.”. As seen in your screenshot.
    Selecting a bookmark in Firefox is harder to handle.

    0
  137. 141

    Great article, definitely covers everything EXCEPT GOOGLE ADSENSE ADS. I think someone has already covered this but seriously, how many users actually click on these ad links within web sites? Lately, respectable information sites with excellent content have started to add the largest Google blocks right after the title of the article. I wonder if these guys understand that they are making perhaps $0.001 for the aggravation and annoyance they are causing users. Remember google is a billion $$$ enterprise becuse of this very stupidity on the part or otherwise intelligent web masters.

    0
  138. 142

    Can I translate this great article and post it into my blog in blogger.com? I will place a source space and credit. Thanks

    0
  139. 143

    Interesting, I am very green and need to understand all this stuff, because frankly, there are such a lot of very bad websites, KISS seems to be a good rule, I am going to do my own site, and thanks to you all for your wisdom on this subject,

    0
  140. 144

    You are a drug. You know this right. Drug. Class A. Naughty.

    (p.s. another brilliant article)

    0
  141. 145

    thank you, thank you for pointing out drop down menus. They never work right, and it’s something that can easily be handled by a subnavigation on whatever internal page the user goes to

    0
  142. 146

    Girish Dhulekar

    May 1, 2008 9:27 pm

    Nice article again. No website can be 100% perfect no matter how experienced the designer is and I do agree with almost all points except a few.
    Pop-ups: Like when we talk of pop-ups, in my opinion one should ideally use new window instead (wherever possible) and an icon depicting New Window should be used adjusent to the link.
    Navigation: I quite like the draggable menu since it gives me the liberty of using the layout my way. I have implemented this a few times and received appreciations from the actual users (I couldn’t give out the links since these are account management applications). Infact some users who I gave options, insisted on using draggable one.

    The most important point what most designers and business people forget while making designing their websites and even while writing content for the same – they show what they want to show! While a smart business would show- how users can use their products! And believe me there’s a big difference between the two.

    0
  143. 147

    Another great article. We’re having a discussion about small body text. How low can you go without affecting usability? Anyone care to weigh in their opinion regarding font size for, say, a three sentence paragraph?

    0
  144. 148

    Joseph Maguire

    May 5, 2008 1:49 pm

    My god, that dontclickit.it is the most horrible piece of interaction design on the planet. That will honestly cause someone to have a seizure lol. So messed up and useless.

    Best of luck dontclickit.it, the rest is really good info. Smashing as always!

    0
  145. 149

    I disagreed on almost every statement you made and therefore did not finish the article. I mean, how cool is the http://www.brown.edu/ navigation!

    0
  146. 150

    Another usability nightmare: having almost 150 comment on one page, a generous amount of space given for each – the scrollbar is tiny (which is annoying) and the page is super long. I almost clicked off the article because it took so long to load

    0
  147. 151

    I haven’t read anywhere the use of Helvetica font on websites, which is rendered very poorly on Firefox browser and is virtually unreadable. I haven’t seen much discussion of that… is it a Firefox issue?

    I agree with comments about opening links in new tabs being a good thing. Although IE will open them in new windows, which is annoying.

    :)

    0
  148. 152

    I’m a bit surprised that you see links which open in a new window/tab to be a usability problem. I think the opposite, links should ALWAYS open in a new tab (unless they are internal links). All modern browsers suppport tabs now so there’s no reason why we should still be using the same window for browsing.

    There’s nothing more frustrating than reading a blog post, clicking a link in the copy, and the new page opens in the same window. You will need to use the back button (sometimes several times) to get back to the original page. What usually happens though, is you spend time reading the content of that page and when you’ve finished you close the tab and you end up losing the original blog post. Highly highly annoying.

    0
  149. 153

    I found articles 1 & 8 difficult to understand; 6,7 and 10 I couldn’t agree more; and 4 and 5 are total crap. All in all, I think you were on the right track with most of this but seemed like the writing was a rush job at times. I would like to agree with you completely, but 4 and 5 did it for me. Also, there are thousands of other websites I would have used as an example of a bad website, before I would have chosen 37 Signals. This the first post I have read on this site, but I want to give you guys a fair chance, so I look forward to reading some of your other topics. I hope they are more complete and better thought out than this one.

    L8R

    0
  150. 154

    Another great article!
    Thanks guys!

    I would also like to add in the “8 usability check point list”, that you should always inform the user where he is and how he can go back, for example by using breadcrumbs.

    0
  151. 155

    What a great article. Smashing Magazine always on top of this stuff. Love it.

    0
  152. 156

    I read somewhere else that it has to do with people that has unconventional browsers, like to help with some disability. It also said that you should make all links open in the same window and if you want, you can put a small icon next to the link that opens it in a new tab or window.
    Can’t remember where i read it, but its an option.

    0
  153. 157

    Õàé, áûëî î÷åíüèòåðåñíî òåáÿ ïî÷èòàòü. òîëüêî âîò îäíîïëîõî Ñïàìåðû äîñòàëè, ó ìåíÿ ó ñàìîãî åñòü áëîã òàê è íà ïðåìîäåðàöèþ ñòàâèòü âñå ñîîáùåíèÿíå äåëî, à âîò êàïò÷ó íèêàê íå ìîãó óñòàíîâèòü, íå ïîëó÷àåòñÿ…

    0
  154. 158

    I have to agree with you, but not all of them are “nightmares” … i mean … some of them like you said, era going to become a trend in web.

    0
  155. 159

    You have misspelled the word “follow” on this page. What ever happened to spell check?

    0
  156. 160

    I don´t agree with the checkpoint 8 in case that it’s external link. You should provide a external link icon. If you are open a site external, it’s intuitive that open in new window.

    0
  157. 161

    I agree with Alexandre Magno, I think using new windows/tabs for external link is a good thing. When you proved as icon or textual indicator for a link being external you improve the navigation through your website. This in the case of resources of referrals. If you you have to go elsewhere for an other reason (When the user is looking for something you your website doesn’t provide) the link should open in the current window, but those situation are rare.

    0
  158. 162

    IMO, one of the worst usability error is this one:
    (example)
    http://www.poggenpohl.de/de/index2.php
    (“sprache” button)
    to change site language, you must speak deutsch first.
    It’s an old error but I still find it very often.

    0
  159. 163

    Missing number 0: stuffing your page with externally-loaded, slow, crashy banners.

    0
  160. 164

    As a general rule of thumb, always keep your navigation simple. I know it sounds easy, and dumb to say, however you would be surprised at how many people seem to go out of their way to make navigation confusing! Also make sure that each page has good navigation to allow visitors to get to other parts of your website. Remember, a browsers back button should not be considered part of your site navigation!
    -Brian
    LINK

    0
  161. 165

    I am glad to post my views and points in this blog, Blogs are becoming the main source of knowing about things certainty,its importance,idolizing,either in a marketing way that one can differentiate. I enjoyed to be at here because one of my point has been cleared here.

    0
  162. 166

    You are so right on #9. I don’t know how many times I’ve wanted to toss my laptop out the window trying to navigate to the lower levels of DHTML navigation drop-downs.

    0
  163. 167

    I must be in the minority of people who’d rather links opened up in new windows, rather than in the same window. Sometimes when I’m browsing, if I click a link, I have no way of getting back to the page I was on without some serious clicking. If the content I want to see opens up in a new window, I haven’t lost the main page I was browsing; one click to close as opposed to several clicks to get back to where I was.

    0
  164. 168

    I don’t think drop down menus are a usability problem, more of a developers problem. If they don’t work, it’s only because they weren’t made properly.
    However, I can see how just clicking through a site using calls to action is much friendlier.

    0
  165. 169

    I am not sure that I agree that 5 is relevant to Overstock.com…at least in that example. I hate clutter but that seems relatively utalitarian to me…am I missing something?

    0
  166. 170

    i am looking on yahoo, came to your post, i read couple of your post very nice.
    hoping to read more such post in future.

    0
  167. 171

    One of these you should add to the list is Blogs that don’t prominently display the date the blog/article was posted. Lists like these are great if the information is timely, but there are a few comments on here that are completely inaccurate now… such as not being able to bookmark areas of Flash-based applications and sites. Deep-linking is standard practice now.

    Also, a drop down menu is far from a nightmare if implemented the right way. I would like to see the New Media community post lists like this that describe alternatives or tips and tricks that help turn nightmares into daydreams.

    ;)

    rp

    0
  168. 172

    Muhammad El-Nabawy

    July 19, 2010 11:23 am

    Great Article.

    No 9 is very much true

    0
  169. 173

    I simply wished to let you understand that your blog doesn’t present up properly on the BB browser, I added it to my bookmarks and have simply checked from the desktop

    -1
  170. 174

    Please be aware of the very young, very innocent and extremely vulnerable MISSING – BRITISH – CHILD; who’s name is Madeleine McCann, now seven years old. Madeleine disappeared from Praia da Luz, on Thursday evening, May 3rd 2007, in Portugal. Please think about keeping a lookout for Madeleine, as nobody, as far as I am aware knows where young Madeleine might be in our world. With everyones help we can bring young Madeleine back to her loving family in the United Kingdom, thankyou. For more information please visit w dot findmadeleine dot com GOD PROTECT YOU MADELEINE

    -1
  171. 175

    A BIG THANKYOU – AGAIN A BIG THANKYOU.

    -2
  172. 176

    Thanks a lot

    -2
  173. 177

    Another usability nightmare: having nomore to 100 comment on one page, the page is too long and is difficult read all comments and is so long to load the page for the browser. (daniel from filtri brita)

    -1
  174. 178

    Hiya, I am really glad I have found this info. Nowadays bloggers publish just about gossip and web stuff and this is actually annoying. A good website with exciting content, that’s what I need. Thank you for making this website, and I will be visiting again. Do you do newsletters? I Can not find it.

    0
  175. 179

    Fashion Gadgets

    May 15, 2011 7:38 pm

    Usefull collection.

    0
  176. 180

    Great site very informative article thank you…cheers Peter

    -1
  177. 181

    Have you regarded putting extra video clips for your blog posts to help keep your readers a lot more entertained? I mean I just read during the entire article of yours and it was very excellent but since I’m really a visual learner,I discovered that to generally be more useful. Just my my idea, Good luck

    2
  178. 182

    uxdesign.smashingmagazine.com is wonderful. There’s always all of the ideal info in the ideas of my fingers. Thanks and keep up the excellent work!

    1
  179. 183

    Good Post. You do a good job. I appreciate it.

    1
  180. 184

    Interesting point about drop-downs getting on users’ nerves.

    -1

↑ Back to top