A List Apart

Menu

Topic: Interaction Design

  • Put Your Content in My Pocket

    ·

    In this first of two articles on bringing your content to the iPhone, the Iconfactory’s Craig Hockenberry offers detailed guidance on tuning your site for the hot new phone, and making changes that can enhance even non-iPhone-users’ experience. Hotcha!

  • Never Use a Warning When you Mean Undo

    ·

    Are our web apps as smart as they should be? By failing to account for habituation (the tendency, when presented with a string of repetitive tasks, to keep clicking OK), do our designs cause people to lose their work? Raskin’s simple, foolproof rule solves the problem.

  • Quick CSS Mockups with Photoshop

    ·

    It may seem like we’re trying to party like it’s 1999, but rest assured, we’re not. Casper Voogt shows us a way to use Photoshop, ImageReady, and slices to produce mockups that utilize clean XHTML and CSS.

  • Paper Prototyping

    ·

    Running with scissors isn’t recommended for kids, but it might be ideal for your next big development project. With interfaces becoming more complex and schedules growing shorter, the best prototyping tools may be simpler than you think.

  • Where Am I?

    ·

    It’s 2006 and we’re still messing up global navigation. Derek Powazek gets back to basics and offers a few simple guidelines for getting it right.

  • Calling All Designers: Learn to Write!

    ·

    You know all that copy that goes around your forms and in your confirmation e-mails? Who’s writing it? Derek Powazek explains why it’s important for user-interface designers to sharpen up their writing skills.

  • Flywheels, Kinetic Energy, and Friction

    ·

    You want your users to do something, buy things, beg you to work for them, learn how they too can achieve inner peace. So how do you get them to do what you want? Try getting out of the way.

  • Home Page Goals

    ·

    Home pages may get plenty of design attention, but that doesn’t mean they don’t need improvement.

  • In Search of the Holy Grail

    ·

    Just in case you might want a three-column layout that doesn’t require the usual sacrifices, we thought we’d share this technique. Not that you’d want that or anything.

  • Thinking Outside the Grid

    ·

    CSS has broken the manacles that kept us chained to grid-based design…so why do so few sites deviate from the grid? Molly E. Holzschlag can tell us that the answer has something to do with airplanes, urban planning, and British cab drivers.

  • Sensible Forms: A Form Usability Checklist

    ·

    Sometimes it’s the little things that drive you nuts. As many of us have probably noticed during this season of holiday shopping, usability problems in online forms can be infuriating. Brian Crescimanno helps solve the problem with a checklist of form-usability recommendations.

  • Power to the People

    ·

    Relentlessly simple solutions to complex design problems can be the difference between an average experience and a great one. D. Keith Robinson reminds web designers and developers that ease of use is more important than technological sophistication.

  • Ambient Findability: Findability Hacks

    ·

    In this excerpt from his new book, Ambient Findability, Peter Morville explains why findability is a required element of good design and engineering—and what that means for you.

  • High-Resolution Image Printing

    ·

    Your client looks up and says, “Why does our logo look funny when we print the pages?” Do you sigh dramatically, or learn about Ross Howard’s technique for printing high-resolution images via CSS? We vote for option B.

  • Invasion of the Body Switchers

    ·

    Wouldn’t it be great if we could update the classic ALA style switcher to accommodate multiple users and devices, including some that aren’t even traditional browsers, all from a single JavaScript and CSS file? Well, now we can! Enter the Body Switcher.

  • Dynamically Conjuring Drop-Down Navigation

    ·

    Got content? Got pages and pages of content? Wouldn’t it be nice if you could offer your readers a drop-down menu providing instant access to any page, without having to sit down and program the darned thing? By marrying a seemingly forgotten XHTML element to simple, drop-in JavaScript, Christian Heilmann shows how to do just that. There’s even a PHP backup for those whose browsers lack access to JavaScript. Turn on, tune in, drop-down.

  • Designing for Context with CSS

    ·

    The medium is the message: Imagine providing unique information exclusively for people who read your site via a web-enabled cell phone — then crafting a different message for those who are reading a printout instead of the screen. Let your context guide your content. All it takes is some user-centric marketing savvy and a dash of CSS.

  • Night of the Image Map

    ·

    CSS design from beyond the grave: all the secret ingredients you’ll need to resurrect the image map using CSS and structurally sensible XHTML.

  • JavaScript Image Replacement

    ·

    Perhaps it’s time to consider the ups and downs of a JavaScript-based alternative to the Fahrner Image Replacement technique. This version uses plain vanilla XHTML with no special IDs or CSS tricks.

  • Suckerfish Dropdowns

    ·

    Teach your smart little menus to do the DHTML dropdown dance without sacrificing semantics, accessibility, or standards compliance or writing clunky code.