Coyote Tracks

I found an interesting UI problem today, on a site that I will be kind enough not to actually link to. Instead, I’ll just reproduce the general concept and problem here:

• alpha
• beta
• gamma
• delta

The links all just link straight to the nav bar itself, so if you scroll your browser view so that the list isn’t right at the top, you’ll be able to tell when you’ve clicked one of the links. See what happens?

You roll over one of the list items, and you get an immediate visual reaction: not only does the background change color, but the mouse cursor even becomes a pointer. It’s not just suggesting that your cursor is over a clickable item; it’s flat-out asserting that to be the case.

And it’s lying.

The clickable area is nothing but the text in the very center of the nav bar item, and the only feedback you’ll get when you hover over that is the destination URL appearing in your browser’s status bar — if you have that turned on; many browsers leave the status bar off by default.

I’m fairly sure the people at Anonycorp didn’t mean to do this. I think it was just an ill-considered (and poorly QA-ed!) mistake in choosing which CSS rules to apply on which elements. But it’s a horrible, cruel UI trick to play on your visitors and users. Don’t do this.