Common Usability Mistakes In Web Design (includes Hacker News & Posterous)

http://www.smashingmagazine.com/2009/02/18/9-common-usability-blunders/

by jmorin007 • 17 years ago

60 24 17 years ago

mattmaroon• 17 years ago

They must not know about how the code formatting messes up the entire page.

yan2• 17 years ago

I'd be hesitant to call it a "mistake." I, for one, like the small comment-number areas because it lets the front page be information-dense. If I did have to pick a gripe with it, it'd be nice if posts with no comments were visually distinct from those that do have them.

I end up using the single-quote shortcut in Firefox and just type the number of comments in the article. For instance, the first post in the screen shot has 18 comments; typing: '18<enter> is usually enough to get me to that page.

Even if I used the mouse to click, is it really that hard to land it on that link? I never saw it as an issue.

darkhorse• 17 years ago

have you ever tried to click the tiny comments link from an iphone? it's pretty hard, without zooming in.

yan2• 17 years ago

Ok I'll give you that. I've been trying to transition to icombinator.net when browsing HN on my iPhone.

mechanical_fish• 17 years ago

What's even more fun is trying to upmod something without accidentally downmodding it.

I've also had the thrill of typing in a comment using the iPhone keyboard and then accidentally tapping "delete". Thank god there's a confirmation page! I usually blow that confirmation page up to gigantic proportions before clicking on the "cancel" button, to prevent further mistakes.

jay_kyburz• 17 years ago

I agree, I could care less about the comments. Nothing but drivel in here anyhow. I'm here for the articles. :)

wmf2• 17 years ago

If a link is surrounded by whitespace, it makes sense for that space to be clickable (this is a common mistake). But that isn't the case on HN; the only way to make the comment link targets bigger (at least vertically) would be to add whitespace around them, thus reducing density and requiring more scrolling. This case does not seem clear-cut to me.

Daniel_Newby2• 17 years ago

" the only way to make the comment link targets bigger ... would be to add whitespace around them"

ORLY?

    a.big-click-zone {
        position: relative;
        left: -1em;
        padding: 1em;
        margin-right: -2em;
    }

wmf2• 17 years ago

Wouldn't this start to overlap with other links?

nx• 17 years ago

Okay, the "correct" example for the clicking area mistake has an icon on the left of the link, and it makes sense to expand the clickable area because it stays rectangular, adding clickable space for the comments link on HN would feel rather counter-intuitive.

Edit: Is the ridiculously extended apple link an example of excessively big clickable areas? :P

oldgregg• 17 years ago

#10: Add dubious content to your articles that use examples specifically designed to provoke and linkbait users of Hackernews, 37Signals, Posterous, and Tumblr.

patio112• 17 years ago

The sense of loyalty to/ownership of software you use is commendable in at least one respect. However, clearly it isn't without flaws, right? Work of human hands & etc. And clearly you're more interested in hearing about its flaws than the flaws of a site you've never seen or, worse, a strawman site created for the purpose of the article.

I mean, sure, they could have said "Imagine a social news site where the key value was in the comments and the comments were only accessible if you hit a target which was 62 pixels wide and 10 pixels tall".

People would say "Eh, like anyone would do that. That would be a clear error."

I bet I just sent a bunch of people to the homepage with a ruler, right? Good.

Now would you have rather heard about that issue, or not heard about that issue? Personally, I'm in favor of being a cautiously humble absolute dictator when doing web design. Absolute dictator because ultimately I have the only say that matters, cautiously humble because if the data says that my cart is costing me $30,000 I will follow the data. (I wish Smashing Magazine would give me free usability advice.)

critic• 17 years ago

But it's not a mistake. It's brilliant.

marbletiles2• 17 years ago

Most of these things I can live with, but the Get Satisfaction one drives me nuts: there's hardly any indication that you need to log in for certain features until you're mid-process, and then bang! "Create an account, please".

Yes, making accounts is a pain that drives users away. But you get round by being clever with sign-ups; not by pretending you don't have a registration page until the user is deeper into the process. We'll just leave all the same.

patio112• 17 years ago

We'll just leave all the same.

This hypothesis is testable and, from personal experience that I regrettably can't show you, the data do not support it. There is no reason you should take my word for this -- try it for a week or two on a site you control.

Increasing user investment in the interaction is one way to cut down on abandonment -- for example, if you're doing comments, asking for a name/email address BEFORE they write the comment will decrease the number of comments you receive markedly, but asking it afterwards will decrease it very little, because people have emotional investment in seeing those two paragraphs they just wrote actually show up.

moe• 17 years ago

Increasing user investment in the interaction is one way to cut down on abandonment

I'd say it's also a way to stack up on churn. Treat me like that and I may go through your damned procedure to at least not have wasted my last 5 minutes for nothing. But at the same time you have just lost all my sympathy which might influence buying decisions and definately influences loyality.

Always look at the "lifetime value" of your customers, a simple conversion split-test is only half of the story.

marbletiles2• 17 years ago

Yep, I agree with moe on this one: you just get more churn. In Get Satisfaction's case, I signed up because I wanted the comment to get there, but I deliberately used a low-grade address, and have forgotten my details already. I won't be going back there.

tokenadult• 17 years ago

"But there is another way that pagination is used on the Web today. Content pages, like blog articles, are sometimes split into several pages. Why is this done? What’s the gain? It’s unlikely that the article is so long that it requires pagination; in most cases, it is used to increase page views."

Hear. Hear. Gratuitously going to an extra page encourages me to STOP reading the blog, not to read it more.

dimitar• 17 years ago

Yep, me too. The other reason for having lots of pages is to make room for annoying flash ads.

I usually click the "print article" or equivalent link - there usually is no pagination there.

anatoli• 17 years ago

The "usability" mistake of HN is the freaking ginormous line-widths. :( I would consider custom stylesheet, but there's no good hook in HN html to grab on to without screwing up other sites. (Seriously, more sites should start adding their domain name as id on html tag. Such as [html id="news-ycombinator-com"].)

(I use Safari.)

gdee• 17 years ago

A local transparent proxy could add that for you then your custom stylesheet could do what you want. Good OLD Proxomitron comes to mind :) for win boxes.

RK• 17 years ago

They sure are good at violating their own rule #4, having way too much crap on the top of the page.

jsteele• 17 years ago

I'm not going to agree with SM but I have to agree with their general point: Hacker News isn't the best design, aesthetically or for usability.

Common Usability Mistakes In Web Design (includes Hacker News & Posterous)

Related Stories