October 1st, 2007

Selects, JavaScript, and Usability: Please help.

By no means to I consider myself to be a usability professional. On the other hand, I do have an interest in the subject and try to read as much as possible from the true professionals in the field. That doesn’t go to say that I’m not allowed to have an opinion on certain things I run into every day on the Web. Everyone using the Web is more than entitled to their opinion regarding what is usable and what just doesn’t seem right.

There has been an implementation driving me nuts for years. More often than not, it comes hand in hand with a certain type of download, but the implementation I’m speaking of can be summed up with the following image:

Anyone who has been a Windows user at any point is probably familiar with this example; driver download interface. This particular screenshot is from the Logitech Driver Downloads as of the time of this writing, but the faults in the example sprawl the Internet; general confusion and JavaScript dependency. The same issue can be seen on the Okidata Driver Downloads page as well:

Both implementations are completely destroyed when using a browser without JavaScript capabilities. The Logitech page appears the same, but the selects aren’t populated properly, and the Okidata page not only ceases to function, it renders completely different as well:

The lack of graceful degradation is bothersome enough for me personally, but what’s more is that I get annoyed by both of these examples when they’re working as intended. In my opinion, attaching a JavaScript function to a select is just plain wrong (save validation of some sort, perhaps). I use the Internet every single day, and it still surprises me when I see a page location changing just because I chose an option from a drop-down.

A bit of a side note and rant; using a select for site navigation is just plain wrong. Providing a ‘Go’ button next to the select used for site navigation, but instead redirecting instantly after the option is chosen is even worse. I understand that many implementations which act in such a way do so on the principle of progressive enhancement, but if you’re truly trying to progressively enhance, why not remove the button after adding the functionality? I can answer that in saying you would be back at square one using a select for page navigation, which is annoying.

The most important part: alternatives

One of my favorite parts of being annoyed with something like this, is trying to think about how I could have tried to do things better. I also like to read the thoughts of others regarding what they would have done, as well as checking out examples of superior implementation. When it comes to driver downloads, I would simply rather see a search field allowing you to search for your product if you feel so inclined, as well as a simple anchor structure which allows me to find the page on which my driver download is available. Something I can bookmark for later because I know with Windows, I’ll need to find the page again in a few months when I reformat.

More importantly, have you seen any impressive implementations of driver download pages? Does the issue I’ve described bother you? How would you rather see things implemented? Please, take a minute and leave your thoughts.