Serious Design Flaws – My Pet Peeves

I just wanted to make a very quick post to discuss one of my greatest pet peeves in Web design. I don’t know why it is so prevalent, but it is extremely annoying.

I’m not sure how many of you do your shopping online, but I always at least check a few stores online before attempting to make a major purchase. Something I’ve found on just about every major retailer’s Web site is that they all have drop down menus.

The problem comes, though, when the designer decides to place the search box directly in the path of the drop down menus, so that, when you trigger the “drop down” effect of the menu, it covers up the search box.


I did a quick survey of a handful of retailers while I was searching this past weekend for the new Zune (I found that Circuit City is allowing you to pre-order them already).

I found the following:

Office Depot and Office Max offer Web sites where the search box occurs above the drop down menus, so the menus do not interfere in any way with the search box.

Circuit City has drop down menus that cover up the search box when triggered. It’s not as annoying as some other Web sites, as the drop downs at Circuit City take about half a second to engage and they disengage instantaneously when you mouse out. Therefore, if you accidentally mouse over the menus, you can get out of the situation before obscuring the search box. In addition, and this may be purely accidental, but the position of the menu bars makes it fairly intuitive to still be able to place your cursor in the search box and start typing.

BestBuy has drop downs that cover up their search box, too. Theirs is slightly more annoying than CircuitCity’s, simply because they engage immediately upon mouseover. They do, however, disappear pretty quickly, too. The only real problem I have with BestBuy’s Web site versus CircuitCity’s is that it’s a little less intuitive to place your cursor in the search box while the menu is engaged.

WalMart is the worst offender in this category, though. I have been in multiple situations where I have been hard-pressed to figure out how to get rid of the drop down that appears when I accidentally mouse over the menu. I believe they are using pure javascript to create the drop down effect, and the mouseout trigger seems to misfire sometimes, leaving the drop down menu still hanging there over top of the search box.

There have been times on that Web site that I have even moved my mouse outside of the browser window altogether and started typing in the search box without being able to get rid of the drop down menu. In a lot of cases, it seems that you need to mouse over another menu bar, then mouse out and pray that the drop down will disappear this time.

Did you like this post? Get monthly summary of our new tutorials, posts and tips to your inbox!

One Response

  • It depends on how you look at it and wherever that you’re coming from on the theme really. In the long run beauty is in the eye of the beholder, but Now i am with you on this one.

Post Your Comment

Your email address will not be published.