All in the <head>

– Ponderings & code by Drew McLellan –

– Live from The Internets since 2003 –

About

The Slippery Slope

1 June 2004

It’s not easy to get the information architecture right when designing a web interface. What might appear to be a workable solution in the pre-production planning phases does not always come together in production, and we all know how clients like to pitch those curve-balls at us, mid-development. The result can often be an excess of interface elements, or even orphaned functionality that has nowhere to live.

This situation can be hard to solve. Once you’re in production it can be expensive to go back and refactor the IA to take account of your predicament. It may seem like there is no good solution and besides, you can’t backtrack as the project deadline cannot be allowed to slip. In these circumstances it’s easy to see why so many web developers play their joker. They resort to the get-out-of-jail-free card that they’ve been holding to their chest the whole time. They put the functionality in a pop-up window.

It seems like a logical choice though, doesn’t it? All you need is somewhere for the user to click, and you can launch a new, bright clean canvas on which to weave your evil ways. The pop-up needs no context within the site, and therefore doesn’t have to fit into the IA. So it’s the perfect solution, right? No. You’re bad and wrong, and very naughty. On your rug.

By putting pointy-cornered functionality into pop-up windows, you simply address one small problem by introducing another problem of such magnitude that the fixes to all your other problems become nicetohaves at the bottom of your project manager’s wish list. It’s the start of a very slippery slope. Once you’ve use a pop-up within the interface, it becomes a precedent that is very easy to follow. Suddenly, the answer to every interface challenge is a pop-up window. It’s not long before you create a situation where a pop-up needs to launch another pop-up and it’s Geri Halliwell all over again.

So here’s the bit to print out and pin to your wall: by putting awkward functionality in a pop-up window you’re either creating a) and interface inconsistency, or b) a precedent you’ll wish you’d never set. Pop-up windows are not a get-out-of-jail-free card, they’re a dig-a-tunnel-and-escape-from-jail card that leaves you forever looking over your shoulder and living life on the run. They will catch up with you, and this time, it’s personal.

- Drew McLellan

Comments

  1. § Jesse Rodgers: ok so how bad is your project going then??? hehe.

    I think the same is true no matter what web project you are on. Once you set a precedent by using a certain feature in a site design, it can explode… a uni web environment is the worst for this.
  2. § Kris: Why exactly is a popup window an interface inconsistency? Why exactly is it bad?

    I know this, but answering it in your post makes it more credible.

    Just my 2 cents.
  3. § Drew McLellan: Kris – I thought that was implicitly stated. The use either becomes a precedent and pop-ups are used all over the interface, or failing this, the technique is being used just once and so is inconsistent with the rest of the interface.

    I feel like I’m not adding much value with that explanation, but there you have it.
  4. § Nathan Pitman: Another point to consider is that many browsers now employ pop-up blockers, so pop-ups are becoming more and more counter intuitive.

    The other day I suggested to Drew that we should do a ‘change password’ function on a current project inside a pop-up… oops. :)
  5. § Drew McLellan: Nathan – that’s want prompted my thoughts.

    You can still go ahead and do it if you like ;-)
  6. § David Horn: Cripes. I was naturally nervous about a situation that could be ‘Geri Halliwell all over again’, but lord knows – you could have warned us with a bit more drama / sense of impending doom in your text.

    Out of natural, misguided, curiosity I clicked on the Geri link. Heavens preserve us. What were they thinking?

    Anyway, having just added a pop-up form to my site (where, I tentatively suggest) it is perhaps okay (it’s a largely flash based site with just the one page of HTML – so, the ‘precedent’ risk is minimized nor can it be used ‘everywhere’ because there isn’t an ‘anywhere else’), I will now have nightmares about Geri Halliwell and my web based connection to her.

    Jeepers.
  7. § Isaac: thanks for posting this Drew. I was in the middle of that exact predicament. Unfortunately, I just talked to the client, and they WANT a borderless flash popup instead of an intro page. :S Convictions or money? .... quite frustrating!
  8. § jens: OMG that Geri halliwell page is a joke! What on earth were they thinking??? scary!!
  9. § Olivier Travers: To elaborate on why pop ups are bad, look beyond just consistency and think about “usage flow.” Most pop-ups don’t show the URL field and thus can’t be sent to a friend or bookmarked. They remove control from the user and put it back into the designer’s hand, who will more often than not abuse this power (think evil unresizable popups that don’t show the whole text when users have their own font size settings).

    There are a few cases when popups can be used effectively (for instance, exit popups that you show only once to let people know about a subscription offer—that works well and users don’t mind) but those are quite rare. Most features and content belong within the main site, within the chrome.

Textile Help

Photographs

Work With Me

edgeofmyseat.com logo

At edgeofmyseat.com we build custom content management systems, ecommerce solutions and develop web apps.

Recent Links

Affiliation

  • Web Standards Project
  • Britpack
  • 24 ways

About Drew McLellan

Photo of Drew McLellan

Drew McLellan (@drewm) has been hacking on the web since around 1996 following an unfortunate incident with a margarine tub. Since then he’s spread himself between both front- and back-end development projects, and now is Director and Senior Web Developer at edgeofmyseat.com in Maidenhead, UK (GEO: 51.5217, -0.7177). Prior to this, Drew was a Web Developer for Yahoo!, and before that primarily worked as a technical lead within design and branding agencies for clients such as Nissan, Goodyear Dunlop, Siemens/Bosch, Cadburys, ICI Dulux and Virgin.net. Somewhere along the way, Drew managed to get himself embroiled with Dreamweaver and was made an early Macromedia Evangelist for that product. This lead to book deals, public appearances, fame, glory, and his eventual downfall.

Picking himself up again, Drew is now a strong advocate for best practises, and stood as Group Lead for The Web Standards Project 2006-08. He has had articles published by A List Apart, Adobe, and O’Reilly Media’s XML.com, mostly due to mistaken identity. Drew is a proponent of the lower-case semantic web, and is currently expending energies in the direction of the microformats movement, with particular interests in making parsers an off-the-shelf commodity and developing simple UI conventions. He writes here at all in the head and, with a little help from his friends, at 24 ways.