User Interface (UI) and User Experience (UX) are two important topics for web developers. There are plenty of recommended books on these subjects, such as Steve Krug’s “Don’t Make Me Think“, and very thoughtful work being done by the good people at A List Apart and User Interface Engineering, among many others. But even if you don’t have the time and inclination to spend hours mastering these subjects (and, sometimes, the underlying psychology involved), a decent amount of UI/UX should come down to common sense. I’ve grabbed a couple of snapshots of recent issues I’ve seen at a couple of different web sites.
First up, there’s this snippet, taken from a feedback survey:
As a tip, once you’ve marked half the words in bold, emphasis no longer has any meaning. Along with the fact that it’s visually jarring to look at. Bold should be used sparingly, and only for emphasis (underline should never be used for emphasis at all, so as to not conflict with links).
Then there’s this result I saw when making a purchase:
I’m not a mathematician, but I’ve run the numbers through a calculator a couple of times, and 20 + 1.20 = 21.20, not 22.20! I don’t know exactly how someone developed this code so that there’s a one dollar difference between the displayed amounts and the calculated amounts, but this should have been pretty easy not to do badly. Or put another way, the developer must have put in extra effort to display and calculate two different results (i.e., when I program something like this, both the displayed amounts and the calculated total use the same numbers). Or, if you want another argument, clearly this wasn’t tested with any kind of thoughtful eye.
Third, my favorite, from an all-together TERRIBLE site:
This was from a site that only worked (marginally) properly on Windows. On my Mac, one couldn’t even see any of the navigation menus, including the link to logout! I also couldn’t see the “Affidavits/Certificates” link referenced in this alert. But that’s not the issue here. The issue is: why are there “previous” and “next” buttons when there’s only one alert? Not only are those not necessary, I would argue that there’s no need to display “Alert 1 of 1”, either.
This should have been immediately apparent, because, you know, it’s common sense.
Fourth and finally, I don’t have an image for this, but I was changing my password at a banking site over the weekend. I’d enter a randomly-generated password like kBw)1Y)70″iMBF only to then be told I can’t use “. Then I’d randomly-generate another, like mQ#Q11{1p*TKoi, to be told I can’t use {. I was never once told what all characters I could or could not use. Putting aside the fact that there’s really no reason to deny any characters in a password (or restrict its length), how hard would it have been to indicate the restrictions? (And ideally when asking for me to enter a password, not upon submission.)
You’ll notice that I’m not talking about psychology or in-depth studies of human behavior here, just plain common sense. The next time you’re developing, or testing, a site, add an extra dash of common sense to the interface and experience. Those of us using the site will appreciate it!