Blog
My thoughts on modal dialogs
There's not many things I don't like in Firefox, but there's at least one UI behavior that could to be improved.
When you type an invalid protocol in the URL bar, you get a message prompt identical to the infamous JavaScript alert.
I think alerts have without a doubt their raison d'etre, but they should be treated with special care because they tend to break the user's work flow.
Consider what's happening in Firefox: For some reason, I type htp://google.com in the URL bar. An alert dialog with a rather long message prevent me to correct the error until I click "OK".
I just made a typo, that's no reason to lock the whole application pal.
A user confronted with this dialog have to options, either he grab the mouse and click on the OK button (the only one actually) or to hit enter/space.
That could be tolerable if at least it would bring back the focus on the URL bar, so the user can correct his error while, hopefully, not leaving his hands from the keyboard.
So here's my suggestion to improve greatly the user experience in this situation: just a tooltip please.
I made a mockup to illustrate what I mean.
Notice that I've also rephrased the message. I think the original was not very helpful for a non-tech savvy user.. It probably could be better, but I think it illustrate my point.
In conclusion, I think modal dialogs should only be used when the application (or web page) absolutely needs to prevent the user from performing further action(s) before grabbing a user's input. The perfect example would be an item deletion confirmation dialog.
If it does not contain a OK and a Cancel button, you probably should not be using a modal dialog.
Note: Tooltip design grabbed from prototip2's demos, thanks dude.
Update: I got some interesting feedbacks I totally agree about this post:
Alternatively, an error page could be displayed in the browser window like many other errors that Firefox displays. Instead of "Address Not Found" and asking, "Did you make a mistake when typing the domain? (ww.mozilla.org instead of"www.mozilla.org)" it could say "Could Not Understand Protocol" and ask, "Did you make a mistake when typing the protocol? (htp:// instead of http://)" or something like that. Rather than introducing new UI paradigms, it's good to stick with what's already there if it works well.
-- Josh Tynjala
I agree, but not entirely.
I agree it should be used in a critical choice situation only. But generally descriptive verbs are better than Ok / Cancel. (And even Microsoft is switching toward this trend.)
Move / Cancel Overwrite / Skip / Cancel
are better than
OK / Cancel Yes / No / Cancel
-- [FlyingAvatr])(/blog/69/#comment-214)
post a comment Comments
Not to discount your point (you're correct, of course that this shouldn't be a modal dialog) but why are you ever typing http anyway? Just skip that part like you did the www... this isn't 1999, you know :)
permalink dude ~ September 19, 2008 at 12:49 a.m.
Better still, use no message at all and just do whatever you would have done with the http:// version. You can use some sort of edit-distance based method to determine which handler to use. If it really is too far away from any of them, just run a google search on the contents of the address bar.
permalink James ~ September 19, 2008 at 2 a.m.
it's interesting that one of the best UI improvements in FF3 is, in my humble opinion, the new style for the "remember this password" question. Which was unmodalized (allowing me to answer "no" if I got the password wrong), and does have "ok/cancel" buttons (or something like that).
permalink Paolo Bonzini ~ September 19, 2008 at 6:36 a.m.
I'd rather never see the words "OK" and "CANCEL" as end users never read them, and only learn about their mistakes -after- they have experienced what they do by default.
Thank previous bad design for your software having to suffer.
permalink Wade Mealing ~ September 19, 2008 at 7:35 a.m.
@dude
Well honestly it's quite rare that I type the protocol prefix, it mostly only happens when I use other protocols, like ftp.
It was really just an example to illustrate my point.
permalink h3 ~ September 19, 2008 at 8:25 a.m.
I'd just correct the feed and take a best shot - starting with https and then http in that instance.
permalink akatsuki ~ September 19, 2008 at 8:36 a.m.
"If it does not contain a OK and a Cancel button, you probably should not be using a modal dialog."
I definitely agree
permalink Richard Trautmann ~ September 19, 2008 at 10:27 a.m.
Alternatively, an error page could be displayed in the browser window like many other errors that Firefox displays. Instead of "Address Not Found" and asking, "Did you make a mistake when typing the domain? (ww.mozilla.org instead of"www.mozilla.org)" it could say "Could Not Understand Protocol" and ask, "Did you make a mistake when typing the protocol? (htp:// instead of http://)" or something like that. Rather than introducing new UI paradigms, it's good to stick with what's already there if it works well.
permalink Josh Tynjala ~ September 19, 2008 at 3:28 p.m.
Excellent observation :)
permalink segfaulthunter ~ September 19, 2008 at 5:50 p.m.
I agree, but not entirely.
I agree it should be used in a critical choice situation only. But generally descriptive verbs are better than Ok / Cancel. (And even Microsoft is switching toward this trend.)
Move / Cancel Overwrite / Skip / Cancel
are better than
OK / Cancel Yes / No / Cancel
Hrm. This is a great idea. But instead of having the tooltip come from the addressbar itself, I think it would be better for non tech savvy users to have a small animated character in the lower right corner of the screen, perhaps the firefox or something, and have the character suggest you use http.
permalink Louis ~ September 18, 2008 at 11:46 p.m.