Usability: Javascript alert() function Posted by Swapnil Pathare on Jan 15

Traditionally, the most convenient way for web developers to buzz the user with a message has been the javascript alert() pop-up. It is convenient to code and ensures that the user doesn’t miss the message (no way to go back to the page till the user clicks OK or whatever prompts you’ve coaxed in)

Javascript alert

Today this very pop-up is a major hassle for users, just because in multi-tabbed interfaces, the user cannot switch between tabs when an alert is displayed to him. So you have an irritated user who wants to urgently book a flight in the next page, but is stuck on your tab because you have provided some text for him to understand and press OK.

This is still ok when the alert is shown on the press of a button. There is a higher probability of the user being still focussed on your page. But alerts on page load, notifying “Successfully performed operation” are nothing but rot.

To grab user attention while user is on your page, a far more elegant way is the use of div based message boxes. This keeps the user interface consistent with the remaining website and also grants user space for some other (possibly precious) activity. The new CSS opacity attributes also let you gray-out the page background whilst displaying your error — pretty neat.

While you are proceeding towards unobtrusive interfaces like a good kid, why not also give a thought to what ought to be the messages warranting a pop-up? Oracle ADF, which we use for development, has 3 levels of messages:

  • Info, Warning: Display at the top of the page with appropriate icon
  • Error: Display as a div based pop-up to the user, gray out the remaining page, ensuring the user cannot perform any activity till he selects an option to handle or acknowledge the error.

The good part is that the behavior of messages is built into the framework. So if tomorrow a usability test suggests that warning messages better be shown as a popup so the user doesn’t miss them, there’s a 3 line change in the framework to enable this. Clean, easy, cool. That’s the way we want it.

Software Updates: Auto-chaos Posted by Swapnil Pathare on Nov 24

I got a SOS call from a relative while I was on vacation. “My Internet Explorer is not working.” No idea why. No one can resolve it. Other browsers are working properly.

Long story short, after having spent a few minutes on his PC, I found out that IE was hanging the moment it started. His PC maintenance guy had come and tried to reconfigure the Internet connection (heh), which didn’t help much. (The fact that a browser ought to hang on the OS from the same company should have seemed absurd, but somehow we are all used to it, mostly due to virus attacks and corruption.)

But why would a perfectly working IE hang all of a sudden? I got another bit of info from the user: “It asked me to upgrade to version 7. It is not working ever since I upgraded”. Sad. MS doesn’t test its upgrades enough! Useless! Thankfulle, before I could post my rant online, I googled and found a quick solution: Uninstall Yahoo! Companion and all shall be fine. And indeed it worked! Perfect answer… and boy did I get showered with praises for starting up good old IE with fewer toolbars!

For no fault of its own, IE was screwed and broken due to the upgrade. Oh, but there is a fault in it… the upgrade itself!

The sad thing here is that IE either doesn’t have any idea about what applications are plugged-in (or coaxed in) to it, or that it doesn’t care about them during the upgrade. Either ways, it is the user who suffers.

FF covers addons a lot more by checking their versions and the compatibility after each upgrade. That said, a foolproof “Go back to the previous version” ought to be present for all major upgrades which are not critical, simply because there may be a functionality dear to the user (and a don’t care for the dev) which might stop working in the new version. Edit: Even if the update is critical or security related, why not let the user choose whether he needs a secure app or a working one?

The other way out is to have a package manager like Debian’s ‘apt’ tool to handle all upgrades and report clashes to the user. But that’s a distant dream on Windows with everyone having their own installers.

I hate automatic updates & installs. (I have also written earlier about Acrobat Reader’s need to download and install “Critical Security” updates every few weeks from the Internet. There ought not to be those many security vulnerabilities in a document reader.) But all kinds of applications today are coming up with internet updates. While this does allow you to provide your latest and greatest piece of code to the user, you might just end up breaking something because of incompatibilities with other software.

Adhering to the policy of oldversion.com: “Because Newer Is Not Always Better”, I try to keep my software tuned for manual updates. Reduces the trouble, as well as the bandwidth consumption (required specially for limited-download connections). Yet, it does no harm to remember that software one develops will not be the only process running on any machine. Let’s have some consideration for others.

Unobtrusive UI 101 Posted by Swapnil Pathare on Sep 30

Perhaps the best example of converting an irritating popup into an “unobtrusive”, conveniently placed message is the “Remember Password” dialog of FireFox:

Upto Version 2.x

Firefox password prompt - old

Version 3.x

Firefox password prompt - new

It was indeed very irritating to decide whether I want to remember the password or not for some xyz website where I had just one minute of quick work to be done. Good UI always deserves applause. After all, for most users, the UI is the Application. Thanks FF!

« Previous Entries Next Entries »