Event: Web Form Design talk in Emeryville, CA

On Monday, May 19, 2008 at 7:00pm, I'll be speaking at the East Bay Innovation Group (ebig) in Emeryville , CA about Web Form Design Best Practices.

WebDev/Web 2.0 SIG: Web Form Design Best Practices
7:00pm - 9:00pm May 19, 2008
Expression College for Digital Arts
6601 Shellmound Street
Emeryville, CA 94608

In my talk, I'll walk thorugh the importance of Web forms and a series of design best practices culled from live to site analytics, usability testing, eye-tracking studies, and best practice surveys. Some of the topics I discuss and provide patterns for are: label alignment, required form filed, input field sizes, content grouping, primary & secondary actions, help text & tips, dyanmic help systems, inline validation, error messages, progress indicators, success messaging, progressive disclosure, gradual engagement, tabbing, flexible data inputs, smart defaults, paths to completion, selection dependent inputs, and more...

From the official description
“In the world of Web applications, forms bridge the gap between people, their information, and your product or service. From registration forms that welcome new customers to checkout forms that finalize e-commerce transactions, Web forms frequently broker crucial online interactions.

In this session, Luke will walk you through the considerations and best practices of Web form design culled from international usability testing, eye-tracking studies, and over ten years of designing Web applications. He’ll outline how the interaction and visual design of Web forms can make the difference between acquiring a customer and completing a transaction or not.”

Hope to see some of you there

| Tags: forms | TrackBacks: 0

Audio: Content page design best practices

Boxes & Arrows has published audio from my Content Page Design Best Practices talk at IA Summit 2008, where I presented a framework for thinking about how to optimize content pages for the dynamic ecosystem of the Web instead of the structured hierarchy of a Web site.



Download the audio:
Content Page Design Best Practices (19.9MB ipod audio)

Download the slides:
Content Page Design Best Practices (4MB PDF)

Official Description:
In today’s social, distributed, search-driven Web, customers are finding their way to Web content through an increasing number of distinct experiences. Yet when people arrive at most Web pages, the experience they get isn’t optimized for this context. Instead, the vast majority of content pages online remain more concerned with their own context than the context of their users: where did a user arrive from and where are they likely to go next? These pages remain designed as if they were primarily accessed from a Web site’s home page or a carefully thought-out selection from the site’s information architecture.

To address these issues and more, this talk outlines a set of best practices for Web content page design that focuses on appropriate presentations of content, context, and calls to action. Specifically: how can content be optimized to meet user expectations as they arrive from a diverse number of access points; what is the minimum amount of context required to frame content appropriately; how can the most relevant calls to action be presented to maximize user engagement? Applying these considerations enables information architects to deliver content experiences that take full advantage of emerging opportunities online and the existing assets within their Web sites.

Much thanks to the Boxes & Arrows team!

| Tags: iasummit, iasummit2008, context, guidelines, interface, Web conventions | TrackBacks: 1

Audio: Luke Wroblewski on Form Design

I recently had the pleasure of talking with Tom Crawford, CEO of VizThink, about my Web Form Design book and its relevance for the visual thinking community.

Check out the podcast with video on the VizThink site.
Download the audio as an mp3 (21.6 MB)

In the interview we discuss:

• Why web form design is important
• If form design is everywhere, why are there so many bad forms?
• What are some of the common mistakes web form designers make?
• What are the Top 3 tips for improving web forms?
• Why do good designers create bad forms?
• What is the disappearing form?
• How does web form design relate to visual thinking?

| Tags: forms, vizthink08, visual communication, visual design, interaction design | TrackBacks: 1

Web Form Design: Filling in the Blanks

• Table of Contents
• All Images in the Book

| Tags: forms, guidelines, Web applications, usability, user experience, interaction design | TrackBacks: 24

Web Form Design: All 218 Images Online

| Tags: forms, UI components, Web applications, guidelines | TrackBacks: 1

Audio: Filching Design

| Tags: sxsw, aesthetics, credibility | TrackBacks: 0

Audio: Why Logos are Irrelevant

| Tags: sxsw, brand, visual design, business, Web OS | TrackBacks: 2

Top