Sponsored by HowLifeWorks
How Much Are You Over-Paying For Your Auto Insurance view!
howlifeworks.com - Car insurance rates have dropped leaving many people paying far more than they need to...
29 Comments
- judicar, on 05/28/2009, -0/+9Modal windows are an important part of any good UI design but lately their use in web development has become "give a man a hammer and everything starts to look like a nail". Most of the examples in the article are complete overkill, especially the login window modals could be accomplished much less intrusively. A better article would be when NOT to use them, modals are intrusive by nature, also if there's a compatibility issue with a particular browser and the user can't exit a modal there's no graceful exit, your *****.
- RadiantSilver, on 05/28/2009, -0/+7The horrible thing about the web and AJAX is that it appears all the lessons learned about what NOT to do UI design in the 80s and 90s have been thrown out the window, and that everyone is busy making the same mistakes over again, only worse due to short-term gain startups and mindless "fail fast" business modeling taken too far.
I hated modal windows on the Mac in 1985, and I hate them even more now on the web.
Everyone who works on UI on the web or app space needs to read Jef Raskin's "The Humane Interface" and use it as their bible. - realpolitik, on 05/28/2009, -3/+10Modal windows are annoying as hell. Pretty rarely justified.
- tsornin, on 05/28/2009, -0/+6Modal windows for forms (particularly login forms - that means you, digg!) are pure evil. They're rotten usability, and often break the browser's ability to autofill your login/form data.
- judicar, on 05/28/2009, -0/+5I'm pretty sure/hoping he's just trolling for flames.
- CircleFusion, on 05/28/2009, -0/+4What exactly do you hate about them? I've read some complaints, but I haven't read any reasons behind those complaints. What about modal boxes is bothersome?
- smemily, on 05/28/2009, -0/+4/me wonders how many will think the article is about the new Beechwood cellulose textile.
...
oh. You mean not many other diggers are into sewing? - keyo, on 05/28/2009, -0/+4Pretty much the fact that they are modal, linear. Have you never used an application where dialouge pops up after another dialouge?
They disrupt the workflow of everything else, which may be okay for a login box (better than a new page load), but for content is not ideal. Having something like an accordian widget is much better for displaying photos because it's a natural workflow and doesn't change from one state to another. Since there is only one context to learn there is less chance of mode errors.
http://docs.jquery.com/UI/Accordion
http://en.wikipedia.org/wiki/Modal_window
http://en.wikipedia.org/wiki/Mode_error#Criticism_ ... - keyo, on 05/28/2009, -0/+3As much as I love AJAX and the fancy lightbox effects I don't think they are good in terms of usability. At University I was taught that modal interfaces (popups) are bad. They should only be used when they are really neccesary. What's wrong with injecting some HTML into the DOM of the actual page, like accordian menus etc?
- Mizzike, on 05/28/2009, -1/+3ByronT has over twice as many comments as he has diggs, has submitted 5 articles, one of which has made popular, giving him a 20% popular ratio. In other words: he works for douchebags.
There, does that cover it? - skztr, on 05/28/2009, -0/+2"Modal windows are an important part of any good UI design"
You are wrong. - XFi6, on 05/28/2009, -2/+3I hope you get buried by every single person that reads these comments.
- moduc, on 05/28/2009, -0/+1Those people didn't teach you right.
Those are the people who talk but don't actually create applications.
Take a look at all the popular application, how many times you see modal dialogs? Very often. How many times you use a file chooser? They're modal dialogs (save, open). - MtheoryX, on 05/28/2009, -0/+1Yeah, but we can give them a shorter name... maybe we'll call them modal windows?
Seriously, if you don't know what the term "modal window" implies, I doubt "overlapping display blocks with highest Z-index on the page" is going to be any better. - HonoredMule, on 05/28/2009, -0/+1*temporarily, obviously*
I tried to reply to you 10 minutes ago, but I was logged out again (for no apparent reason). I got the obnoxious login screen instead of the intended result (a reply section rolling out). So I typed up my username and password, hit enter, and left, only returning just now.
And for exactly that kind of irritating behavior, I would have not bothered and just left the conversation, were I not the sort of obsessive person who just has to have the last word...and hates cheap shots based on intentionally ignoring the spirit of my words.
So no, the stupid modal windows don't permanently drive me away from the site...they just piss me off and make it less worth my while to contribute in content submissions and conversation.
Or did you intend to imply that websites SHOULD be pissing off their users? - inajeep, on 05/28/2009, -0/+1And so many are comment out of their depth. Understood.
- kimbja98, on 05/28/2009, -1/+2Modal windows remind me of those annoying adverts that float across the page and stop you clicking on anything. Designers also sometimes embed content that cannot be viewed (flash on a mobile phone) but you can't exit so anywhere you click on the page you end up clicking on the advert because it's floating above the page (*cough* nationalrail.co.uk *cough*). Then there's the issue of scaling, for example, viewing web content in a small screen/narrow browser means menus and other elements float above the text (whereas on a static page, you can scroll them out the way) such that reading the page is hard work as you have to drag/avoid the modal window (which on a lite browser, is also difficult).
Please...think of the mobile/lite browser ;) (not forgetting lynx ;)). - HonoredMule, on 05/28/2009, -1/+2Modal windows force my attention exclusively onto one thing, which I almost never want.
The worst uses of modal windows are:
- when they block content underneath that you actually needed in order to complete what the modal window wants (like provide input that was already shown underneath)
- when they split related information into separate contexts that you cannot see/manipulate simultaneously or interactively (i.e. main/blocked window holds one part, modal window holds the other, and you can't easily or effectively move information/input between the two).
- when you're trying to make an alteration to the main context before performing a subsequent and dependent step but the modal window blocks you by demanding the subsequent step before you can finish (or even start).
- when the modal window interferes with multi-tasking contexts (i.e. a js alert blocks the entire browser for the sake of one tab...something which IMO Firefox really needs to change).
Conversely, the best uses of modal windows are:
- when they offer no benefit at all, but at least don't happen to interfere with anything else you were trying to see or do.
_________________________________
Most of the time, modal windows are entirely unnecessary. I wrote a system that tracks where discs/disc contents are and provides ratings etc. In this system, the main window showed the whole library in a hirearchically-filtered context and allowed operations like (re)locating discs, putting content in new discs/locations, creating and defining new containers, searching through library contents, making content part of a named compilation, and setting genre/category/type/etc.
To create/edit/rate content itself, another window would come up on top of that, overlapping irrelevant parts of the main window. But while it was up, you could still interact with the main window. So you could, for example, move content into a different category and add it to a compilation while you actually define or update the content in the sub-window. Most of the time you wouldn't even have to move the sub-window, nor would you loose track of it, because it stays on top, but automatically positions itself over the part of the main window to which a user is least likely to want access while performing the edit (disc location section). Yet even so, the user COULD move it around and still do anything he wanted in the context of the main window.
Most other developers would have made that sub-window modal, and I would have ended up shooting them when I tried to add content. Users should NEVER be forced to handle separate pieces of /related/ information in a specific order or even sequentially at all, unless logical limitations come into play. And there's still no good reason to do it when the information is /not/ related, either.
Don't presume to know how your users organize their thoughts or how they should interact with a data model. It's unnecessary and at best might slightly simplify your design (a difference which should be negligible if your data model is well designed in the first place), and at worst can cause much undue frustration by interfering with a user's ability to immediately act upon whatever is on their mind at the moment.
The most common use of modal windows on the web is login/signup blocks, and that seems mostly harmless, but it's also still useless. Digg's introduction of a modal login was a HUGE step backward in UI design. The prior one was beautifully minimialistic and non-intrusive, and I could fill it out/wait for its submission while I continued to read the content of a page. Now I'm forced to sit waiting from the moment I click "login" to when the new page is rendered. And in case you're wondering, I don't. I go read in another tab or do something else, and may even forget about that page for some time. So really, what did Digg accomplish besides irritating me and driving me away? - inajeep, on 05/28/2009, -0/+1@juidcar: No I'm pretty sure his stupidity is real. He tries to be funny in other comments but not like that above.
- moduc, on 05/28/2009, -0/+1Wrong. It's how they implement it.
I don't like the fact that it shows up for me to log in, then redirect the page below it. It should just somehow change the page below it (dynamically) so that no refresh, redirect is needed.
Auto fill and things like that is a problem because it's a problem, not because modal dialog. Maybe they don't work with modal dialog, and needs to be fixed, but you balk at the side effect. As a developer, I would fix the root, the fix the side effect. - moduc, on 05/28/2009, -0/+1I disagree. Modal dialog is used when it's needed. It's good if used correctly. People will complaint about the use correctly part. Okay, that's fine, but don't complain about modal dialog.
For example, I am currently create a file upload feature, that works like Google gmail or yahoo mail. While uploading, I don't want users to do anything else other than cancel. That's when a modal dialog is needed. It blocks user actions from other controls. It's basically a way to disable a bunch of other buttons if you don't want to use modal dialog. Same thing anyway.
You say it disrupt a natural workflow. What workflow? Depends on how you use it. Showing up a modal dialog is nothing different than showing another window or tab, as long as its own purpose is needed, which again, is to block access to other controls. Take tab for example, it's the same as switch to another tab, and disable other tab, menu items, etc. The disable part is a requirement. Take a file chooser for example, it can be embeded into a panel (Java Swing for example). There is a need for that too. However, normally, if you want to select a file, the only way is to either select a file, or cancel out of it. It's a nice thing to have.
I actually hate non-modal dialog more than modal, but I used both, when it's appropriate.
The non-modal dialog would hide behind the current windows, and the users can sometime feel where the heck is it? Constantly go back to the taskbar for it. - erwinyu888, on 05/28/2009, -0/+0diggs
- choopie911, on 05/28/2009, -5/+5/me wonders how many will try to correct "modal" to "model"....
- Bloodboiler, on 05/28/2009, -0/+0..or you could make sites that don't suck.
Web page is NOT like the desktop. Desktop must stack windows because it has limited space. Web page is as wide as the desktop but practically infinite in height. Everything you can do with stupid floating panels you can do better with hiding and showing regions in the page itself (like replies are shown in these comments).
- Lightbox for images/videos utterly sucks ass. Just show the image on the god dam page.
- Floating contact forms and loging forms ***** up web browser's automatic fill and thereby suck ass. Just have the form on the page or not at all.
- Help is supposed to be viewable while user is working without obstructing use. That's the polar opposite of stupid modal help panel on top of user's work.
- Why the ***** would you hide a search box by placing it in a stupid floating panel.
- Embedding pdf. If you must be retarded enough to have pdf on your site (other than for the purpose of printing that requires specific layout), please have mercy on your visitors and open pdfs in another window. Then user at least has a chance of being able to do something while the gigantic Adobe reader plugin loads. - imagesplace, on 07/04/2009, -0/+0I noticed a lot of sites are using this effect now, and it's kinda lost it's uniqueness.
http://www.design2work.net - MtheoryX, on 05/28/2009, -1/+1"So really, what did Digg accomplish besides irritating me and driving me away?"
You're still here, aren't you? - StigNordas, on 05/28/2009, -4/+3Best invention in web design! I just hope people don't get in the habit of non-modal windows for these. Nothing worse than being forced into action.
- shinkou, on 05/28/2009, -2/+1Nice designs, but shouldn't we call these overlapping display blocks with highest Z-index on the page something else? It's confusing. :(
- ByronT, on 05/28/2009, -17/+4I think you mean model! Wow duh. How stupid can you be? You idiot. Moron. Dumbass. Way to write an article and spell the title and entire description incorrectly. The word is clearly "MODEL." M-O-D-E-L. MODEL. You might as well just uninstall your keyboard because typing is going to get you nowhere but the Laugh Factory. That's right, the Laugh Factory. Take your ignorance and go to hell, benb24.


What is Digg?