I've come to the inescapable conclusion that multiselect list boxes are not an intuitive UI element and are actually quite frustrating to use for most users. A set of two-state checkboxes is much more intuitive. In fact, I've found that anywhere that multiselect list boxes can be used, two-state checkboxes can easily replace them for a much more intuitive solution.
Here's an example of a multiselect list box:
Set the average user in front of a computer screen and ask him to deselect all selected items. The secret is to hold the 'Ctrl' key while clicking, but how often do people actually execute a 'Ctrl + click'? Not very often. Most users, in fact, aren't even aware of special key + click combos. These things are put into applications for power users AFTER the basic functionality is implemented. All functionality of a UI element should be available through a left click or a right click. This is User Interface Design 101. The multiselect list box violates this principle.
As a result, I constantly hear "How do I deselect all items...?" and "How do I select multiple items...?" in regards to AdminPack implementations and multiselect list boxes. For this reason, my next release of AdminPack will do away with multiselect list boxes and just output checkboxes. The net result will be the same and headaches will be reduced for both the end-user and myself. I also was just generally annoyed with the visual look as well. This particular UI element is just ugly with a vertical scrollbar that tends to show up more often than not.
I was kind of curious to see if anyone else had also made a similar decision about this UI element. So I started scouring Google and there is general consensus that this is a lousy UI element. However, using checkboxes can apparently add clutter if there are many options. I can see how that could be a problem but it is less irritating than a multiselect list box. During my searches, I ran into the jQuery UI Multiselect Widget which is a pretty impressive solution for the lazy since checkboxes can be rather annoying to implement. My only major gripe with the widget is that, while it is closed, it only displays "2 items selected" or something similar by default, so it is hard to see, at a glance, what exactly is selected. But that, like most jQuery solutions, can be configured (selectedList option). But, frankly, that's a rather small price to pay if someone needs to display 100 items. There's also a plugin for the widget that makes it easy to find the item you are looking for. That widget will probably find its way into AdminPack Extras.
Since some pretty good alternatives exist to plain multiselect list boxes, it becomes possible to simply never use them. And your users will thank you for it.
Here's an example of a multiselect list box:
Set the average user in front of a computer screen and ask him to deselect all selected items. The secret is to hold the 'Ctrl' key while clicking, but how often do people actually execute a 'Ctrl + click'? Not very often. Most users, in fact, aren't even aware of special key + click combos. These things are put into applications for power users AFTER the basic functionality is implemented. All functionality of a UI element should be available through a left click or a right click. This is User Interface Design 101. The multiselect list box violates this principle.
As a result, I constantly hear "How do I deselect all items...?" and "How do I select multiple items...?" in regards to AdminPack implementations and multiselect list boxes. For this reason, my next release of AdminPack will do away with multiselect list boxes and just output checkboxes. The net result will be the same and headaches will be reduced for both the end-user and myself. I also was just generally annoyed with the visual look as well. This particular UI element is just ugly with a vertical scrollbar that tends to show up more often than not.
I was kind of curious to see if anyone else had also made a similar decision about this UI element. So I started scouring Google and there is general consensus that this is a lousy UI element. However, using checkboxes can apparently add clutter if there are many options. I can see how that could be a problem but it is less irritating than a multiselect list box. During my searches, I ran into the jQuery UI Multiselect Widget which is a pretty impressive solution for the lazy since checkboxes can be rather annoying to implement. My only major gripe with the widget is that, while it is closed, it only displays "2 items selected" or something similar by default, so it is hard to see, at a glance, what exactly is selected. But that, like most jQuery solutions, can be configured (selectedList option). But, frankly, that's a rather small price to pay if someone needs to display 100 items. There's also a plugin for the widget that makes it easy to find the item you are looking for. That widget will probably find its way into AdminPack Extras.
Since some pretty good alternatives exist to plain multiselect list boxes, it becomes possible to simply never use them. And your users will thank you for it.
Comments
Post a Comment