Many web developers ask ‘what is usability?’. This is one of those topics that I can explain, but it may be easier to demonstrate. My this experiences have led to some principles; one of them is that if I’m going to build it, it must be usable. Unfortunately, many sites that I like, that tout usability, screw up one important concept that annoys me greatly.
I ask myself, “when using a menu, why do I have to drag my mouse from one button to the next, and fear losing the menu if I cross it’s border anywhere?” Some menus are just annoying because they disappear mid mouse move, some are extremely hard to use because of several layers of menus, some I have resorted to using
tabs to get to the correct menu item. It’s unfortunate that people can’t get this right.
I have a simple fix that hopefully sharing it will help others. It’s basically a menu that buffers the time you are hovering, that way if you mistakenly move your mouse into the wrong area, you have a brief period of time to correct yourself.
This list by itself isn’t much, in fact it’s not even a menu. CSS will be needed to really make it work correctly.
The final product is quite a nice and simple dynamic menu that adds just the right touch of usability. Now, typically, I would never say that a menu with sub menus popping up everywhere is something of a usability menu system, it’s not. But sometimes, a nice menu like this is needed, especially if there is a lot of information and ‘drill downs’ that need to be accessed quickly. In any case, you can see my demo here. Leave some comments if you have any questions, and enjoy! You can also see a fully implemented version at Xcessorries Squared.