The short answers are provided here; and longer ones are available, of course, in the book. Why does Web form design matter? Forms enable commerce, communities, and productivity on the Web to thrive. If you are in online retail, your goal is to sell things. But standing in the way of your products and your customers is a checkout form.

Author:Kekus Mikajas
Language:English (Spanish)
Published (Last):14 September 2016
PDF File Size:14.86 Mb
ePub File Size:20.25 Mb
Price:Free* [*Free Regsitration Required]

The short answers are provided here; and longer ones are available, of course, in the book. Why does Web form design matter? Forms enable commerce, communities, and productivity on the Web to thrive. If you are in online retail, your goal is to sell things.

But standing in the way of your products and your customers is a checkout form. If you are developing social software, your goal is to grow your community. Standing in between you and community members is a form. How should I organize my Web form—within one Web page or across several? Who is filling the form in and why? Answering this up front allows us to think about our forms as a deliberate conversation instead of the inputs for a database. When you approach forms as a conversation, natural breaks will emerge between topics.

When these distinct topics are short enough to fit into a few sections, a single Web page will probably work best to organize them. When each section begins to run long, multiple Web pages may be required to break up the conversation into meaningful, understandable topics. When the questions that need to be answered before a Web form is complete are spread across multiple Web pages, you may want to include an overview of the number of Web pages involved scope , an indication of what page you are on position , and a way to save and return to your progress status.

Though closely integrated, these three progress indicators perform different functions. Should I top-, right-, or left-align the labels for input fields? When you are trying to reduce completion times or if you need flexible label lengths for localization, consider top-aligned labels. When you have similar goals but vertical screen real estate constraints, consider right-aligned labels. How are smart defaults used in Web forms?

Smart defaults can help people answer questions by putting default selections in place that serve the interests of most people. There are many opportunities within Web forms to utilize the power of smart defaults to reduce the number of choices people have to make and thereby expedite form completion. When should I include help text on my forms? You should consider adding help text when: forms ask for unfamiliar data; people question why they are being asked for specific data; people may be concerned about the security or privacy of their data; there are recommended ways of providing data; and certain data fields are optional or required when the bulk of the form is not.

How should I indicate required input fields? If most of the inputs on a form are required, indicate the few that are optional. If most of the inputs on a form are optional, indicate the few that are required. When indicating what form fields are either required or optional, text is the most clear. Actions such as Submit, Save, or Continue are intended to enable completion, which is the primary goal of just about anyone who has started filling in a form. As a result, they are often referred to as primary actions.

Secondary actions, on the other hand, tend to be less utilized. I know this because of a study we conducted years ago when we had the opportunity to observe Master Cabinetmakers. What does building kitchen cabinets have to do with designing forms in an online application? Let me explain… The purpose of our study was to look at the difference between those who do mediocre work and those whose work is excellent.

We picked a variety of trades to study, where we could find people who were true masters. This brought us to cabinetmakers. Cabinetry is a very old craft, and the people who master it are amazing in their talents and skills. They can create something that is both useful and beautiful.

Even though each person we interviewed had years of experience, nothing was taken for granted. Every hinge and joint was finely crafted, almost as if it were the most important element in their entire career. The pride they took in the final cabinet was the sum of the pride they took in each individual element. So are the master craftsmen of our own field, like Luke Wroblewski. In this book, Luke applies that same loving attention to detail to the design of Web forms.

Like the cabinetmakers, his masterwork is both useful and beautiful. But unlike many craftsmen, Luke is willing to share his secrets outside the guildhall. This is what will change your life: the new appreciation of how subtlety and nuance in form design can have dramatic overall effects on the total online experience and your bottom line. And, once you learn to control those subtleties and nuances, you, too, will be a master of your craft.

As I said, your life is about to change. It starts right … now! Jared M. Spool Founding Principal, User Interface Engineering Acknowledgments Though countless Web designers, developers, and their forms inspired and influenced the content in this book, there was a particular sequence of events that made the book itself possible. Their work and insights built the groundwork for how and why I think about form design.

And three of them took their time to review this book in its early stages—thanks guys. This was the spark that led me to take what I knew about Web form design and turn it into something that could be shared with others. Step three was Liz Danzico and Lou Rosenfeld at Rosenfeld Media believing that we had the makings of a book on our hands and bringing in Marta Justak and Susan Honeywell to help make it happen through top-notch editing and design.

Along the way, the comments and questions from bloggers, conference attendees, mailing lists, fellow designers, researchers, and developers stewed big thoughts and added the insights that made this book what it is today.

Although I lack the room to list everyone, I would like to highlight the work of Matteo Penzo, Caroline Jarrett, Bob Baxley, and Aaron Gustafson in spreading the good form design gospel. Thanks for letting a Web geek type away late into the night…. Book Blog.


Web Form Design: Filling in the Blanks

In paperback only from Amazon. Forms make or break the most crucial online interactions: checkout commerce , registration community , data input participation and sharing , and any task requiring information entry. Web Form Design is the definitive guide for designing one of the most important user interface experiences online filled with design considerations presented in a concise and easily applicable format. This book is a trusted source of data-driven and experience-based recommendations for Web designers, developers, product managers, and more across the World. As arbitrators of checkout, registration, and data entry, forms are often the linchpins of successful Web applications.


Web Form Design



Web Application Form Design


Related Articles