February 11th, 2010
Duration: 35m | 16 MB
Recorded: January, 2010
Brian Christiansen, UIE Podcast Producer
[ Subscribe to our podcast via ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]
[ Transcript Available ]
Web forms are the mouth that feeds most web apps. There’s no way around that. Yet, few people are thinking about how to make one of the more unpleasant parts of the web more pleasant. The world’s foremost authority on web forms is Luke Wroblewski, author of the heralded book, Web Form Design. It’s no coincidence that we lean on Luke often to join us at events like our upcoming Web App Masters Tour.
Jared Spool sat down with Luke to discuss what’s been happening with web forms since his book came out. It winds up there have been some interesting developments recently.
The first trend Jared and Luke discuss is new ways of styling forms to make them less intimidating. Perhaps the most popular form to employ a friendly and unusual form design comes from our good friend Jeremy Keith and his innovative site for finding and listening to MP3 files, HuffDuffer. Jeremy’s Huffduffer signup form is unusual to say the least. If you’ve been a parent or child in the U.S. since the 1960s, you may think the form’s design strongly resembles that of a Mad Lib.
In general, anything that reduces the stress of filling in a web form, Luke likes:
So his form will work on a real old browser. It’ll allow people to tab between the fields like they do on a regular form. It’ll allow them to put their cursor into every field and type in there. It’s coded in a way so that it actually has labels so screen readers can use it. It has a kind of primary action at the moment, that once you get through the whole thing you can submit. It does actual error checking, and so on and so forth.
So even though it’s this example of rethinking the format of a web forum, it’s still keeping true to things that keep web forms work online. It’s not breaking them, it’s not forcing people to really shift their mindset.
And I think that’s a very interesting direction I’m seeing across the web and in many places. It’s people building on what makes web forms tick, but using new rich technologies, new more interactive format, kind of maybe persuasive design, if you will, to make filling in those important web forms less painful.
However, the visual affordances can make or break the success of the form. Since most web forms haven’t changed since 1996, people have expectations. People succeed with Jeremy’s form because it’s obvious. But poor visual design can ruin a form, as well.
Luke recounts an experience he had at Yahoo! that exemplifies this point:
We had a directory page for the podcasts, and […] at the top of the page we had this input field that was open, which allowed people to tag that podcast episode with whatever terms they wanted.
And because people saw that input field and it was towards the top of the page, they immediately thought “search field,” and they would run search queries in there.
[…] it’s that sort of muscle memory aspect of, “This looks like a search field because it’s up at the top of the page and it looks like an input field. I know what that is. Let me just go ahead and start using it.”
There a number of ways that you can validate information that someone enters into your web form, on the fly. When done correctly, this really helps people get through long forms with less frustration. However, if you’re too clever with your validation, you can make the experience even more frustrating than it would have been without your “help”. Luke provides us with several examples in the podcast. Tune in to hear his advice on how to help and not hinder your users.
Clearly you can see we’re excited to have Luke join us for our 2010 Web App Masters Tour, with his presentation, Input: Moving Beyond Static Web Forms. We’re pleased that you’ll be able to see Luke in all four tour cities, San Diego, Minneapolis, Philadelphia and Seattle. He’ll have all sorts of concrete advice you can act on immediately.Tweet