A cure for the common user who does not read warning prompts

The warning prompt; the last ditch effort to make a user aware of an action they are about to take. Yet over the years we, as developers, have thrown up so many warnings, cautions, and advisories, that users really do not take notice. So how do you secure an application button from inadvertent clicking? Make them work for it.

update: Thanks to Joe Litton for pointing out my lack of comprehensive testing; the demo now works in IE7

The idea is simple; if you have a button that users need to have, but only rarely, place a guard over the button and make the user move the guard out of the way. Just like a switch guard on a toggle switch (image on right), let’s place a semi-transparent DIV over a button and make the user drag the div out of the way to click the button.

Here is a basic sample using the YUI drag drop libraries. The button is un-clickable while the protector div is there, but all that is needed is to drag and drop to get access. I think the next thing to do is to design the “protector” div so that it must be dragged completely out of the way before the button is available.

4 Responses to “A cure for the common user who does not read warning prompts”

  1. Joe Litton Says:

    I like this solution. A lot. I need to take a deeper look and do more testing, but it appears at first blush that the semi-transparent DIV works beautifully in Firefox …but when I try with IE 7, the DIV does not appear, and so the button is immediately available. Now my hard drive is erased (ok, maybe not :)

    Gosh, I *much* prefer Firefox to IE. But every company at which I’ve worked for the past many years has used IE as the browser standard.

    VERY cool idea, and this also has me thinking that I need to carve out some time for a closer look at the many fantastic libraries from Yahoo, Google, Moo, etc.

  2. Jeff Crossett Says:

    Glad you like it Joe, I felt it certainly addressed a few issues we have with users who get “OK-click” happy. Stupid me, I only did a Firefox test, and not an IE7 test. I am sure I can work out that kink in a jiffy.

  3. Lairton Ballin Says:

    I like the idea, but would use a check-box, like:

    [ ] I’m aware of what this action will cause…

    When clicked on, it’ll enable the button.

    End users, in my humble opinion, need more verbosity, because for many of them, drag and drop is not intuitive at all. Some aren’t even aware you can drag files around in Windows Explorer.

  4. Glen Rohrer Says:

    I always liked how the client based financial application “Quicken” system prompted you when deleting accounts. It presented an dialog box and asked if “you were sure that you wanted to delete the selected account”, and then asked you to type the word “yes” in the input box in order to proceed.