Forms are generally used to retrieve user input such as text, selected radio button, selected checkboxes and actions like pushing a button

learn more… | top users | synonyms (1)

12
votes
2answers
638 views

Should there be a difference in the relative sizes of the buttons in a confirmation dialog?

I understand the idea behind having the more likely to be used action on a page slightly larger or in a different style in order to guide the user to it (for example having a button for save but a ...
11
votes
3answers
877 views

Opt-ins versus opt-outs in forms - does nobody else care?

Whilst filling out a form on the Royal Mail site this morning, I came across this heresy of form design: the self-negating checkbox... This required careful (re)reading to ensure that: I was ...
10
votes
1answer
314 views

Should I allow users to select a valid but disqualifying option?

I'm working on an application form where a user must be 18 years or older to apply. Should users be able to select years that would equate to them being younger than 18 or should I remove them from ...
10
votes
3answers
4k views

Guidelines for when to auto-save settings vs “save” button

In our web application we have a number of pages to do with user settings, in different categories. For most of them we have a display page with an edit button/link, which takes them to a form which ...
9
votes
3answers
659 views

What is the best control to use to select from a list of thousands of possible options?

I have a field which needs to be populated from a large list of items (many thousands). These items have unique numbers as identifiers, and there can be many thousands of them. (Similar to the way ...
7
votes
1answer
287 views

When designing a form, should I favor consistency over optimal usability for each input?

I was reading this question and this thought occurred to me: When I am designing medium or longer length forms in a web interface I often favor consistency in choosing the input mediums for the ...
5
votes
1answer
403 views

Unifying Search and Browse

I am working on a part of a website right now. Let's just call it a Map for now. Every user has a map, which displays his or her interests as images in a grid. Quite obviously, the user can add or ...
3
votes
2answers
1k views

One column logistration form OR two columns?

Don't look at me like that, I actually like the way to call both login and registration forms together a logistration form, well it's convenient. I've designed a logistration form, but the problem is ...
2
votes
3answers
4k views

Keyboard shortcut for “Submit form”

I use a form maybe 100 times a day. I can tab between the fields with no problem but most of the time I don't have to fill out the entire form and would like to submit it without having to touch the ...
2
votes
2answers
221 views

Is it a good practice to show a sign-up or registration form as seperate parts rather than in one go?

I am designing a registration form for a site with multiple sets of information required from the user. I have categorized the data fields into relevant groups. Now should I present the form sections ...
9
votes
3answers
1k views

Using country flags with currencies?

We are considering incorporating national flags into a currency selector, alongside ISO currency codes, like this: We are well aware we should not use flags for selecting languages because there ...
8
votes
3answers
2k views

Behavior of the Enter button in a form

What is a better experience for a user if they press enter when using a form? Should it submit the form or move to the next field?
8
votes
5answers
3k views

Multiple input boxes on a search form - And/Or Functionality

I am looking at redesigning a search form, which has multiple cases of ‘And/Or’ in between 6 different input boxes. So a user must enter at least 1 piece of search criteria, but may enter up to 7 if ...
8
votes
5answers
880 views

“Clear all” button history

Has anybody ever used "Clear All" button on the page? Maybe someone know the history of this "magic" UI component. I opened my eyes after this answer.
5
votes
1answer
246 views

Search field with or without a button?

I can see two broad patterns as far as the design of the search field is concerned. One like we see on Google has a button that the user can hit to initiate Search. (They could also hit enter to do ...
5
votes
2answers
649 views

Floating submit/cancel buttons

I have a form in the system I am currently working on which loads in a dialogue window within the system. The form is about 3 times the length of the window it shows in, which obviously scrolls. I ...
5
votes
2answers
417 views

Form creation application: how to differentiate the “save form” button from the “submit button” in the form

I have a web application for creating forms. Currently, the create form interface looks like so: download bmml source – Wireframes created with Balsamiq Mockups The interface is ...
4
votes
3answers
1k views

Are on/off switches acceptable in desktop UI

Are the sort of switch controls you see on smart phones acceptable on the web - i'm talking about the left->right sliding on/off switches you have for Airplane mode and others. They certainly look ...
2
votes
1answer
136 views

Is it problematic to have dropdown selector options expand above the field instead of below?

I'm designing a product-based website, and I have a dropdown selector at the bottom of one of the pages near the footer. When I went to review development, I noticed that the way the dropdown selector ...
1
vote
1answer
447 views

Improve design for master-detail interface

INTRODUCTION AND RELEVANT INFORMATION I am programming application that writes data about contracts into database. It is similar to banking software. Contract is very complex data, so let me ...
1
vote
3answers
1k views

Which is the best design practice for edit data in RIA?

Which is the best design practice for edit data in RIA, for example in Flex or Silverlight? I would like to show customer's details, but there will be an edit window, than the datas of customer will ...
39
votes
10answers
3k views

Have I missed anything from my list of web form best practices?

So I have been putting together a list of best practices to apply to forms recently and there is a lot of conflicting research out there. I have been combing everything from blogs through to HCI ...
90
votes
12answers
23k views

Removing placeholder text on focus

Chrome, Safari, and Firefox 15+ remove placeholder text after pressing first key in the text input. Opera, IE, and Firefox 14 and below remove placeholder text immediately after focusing the text ...
12
votes
3answers
3k views

How can we visually improve the nested rule/predicate builder?

This has been discussed a bit here: Building logical criteria (with AND , OR, etc) - but we felt the examples left a lot to be desired. Apple (with their hidden nested rules/predicate builder) in ...
32
votes
7answers
2k views

How do you sort a list of languages?

A website is available in 100 languages. There is a form to select a language, and it includes these 8 English Русский 日本語 עברית العربية বিষ্ণুপ্রিযা় মণিপুরী მარგალური አማርኛ Normally, I would ...
26
votes
5answers
18k views

Best Design/Order/Layout For Mailing Address Form

Is there any standards out there when it comes to a mailing address form? I need to collect the following fields: address line 1 address line 2 city postal code (or zip) province(or state) country ...
23
votes
7answers
2k views

Placement of buttons for Previous, Next, and Save Draft actions

I am designing a five step form. The user can exit the form and return to it later. So I have a Previous, Next, and Save Draft action. What is the ideal placement of the buttons/elements? I want ...
42
votes
21answers
3k views

Do I really need a login button?

We've been having a discussion in the office surrounding a login page we're developing for a new web application. The web application is in intranet-based application, and is mainly used by users who ...
48
votes
9answers
9k views

What color for error messages for a form with a red background?

I have a big website with some forms. There are four background-colours for the form components. One of them is pink/red. Here the image and the error message: I can't change the form ...
21
votes
5answers
8k views

Do we really need a “Remember me” option on a Login page?

I'm wondering why do we need to ask user to make a decision, for how long he want to be authenticated? This is done by having "keep me signed in" option login page: Why can't we simply "predict" ...
14
votes
2answers
5k views

Inline editing vs Edit view

I've seen this question asked a few times, but none that relate to my particular scenario. I'm working on a large, complex UI that involves many user types. For this screen, there are 4 types of ...
5
votes
5answers
8k views

How do you design a registration form?

I am trying to learn about registration forms, what should I be careful about when designing one? Is there any "best practice" or do you know any great websites with great examples of registration ...
21
votes
10answers
5k views

When client and server side validations occur, doesn't it make for a better UX to only do server validations?

I find a problem on the MVC4 project I am working on now, using Fluent Validation, in that some validations are delegated to the jQuery client side validation, while some, such as the NotNull rule for ...
16
votes
3answers
1k views

Should I clear a form after the user submits data?

This is just a general question. I have a single-page web application that does not navigate away after form submission. My question is whether I should clear form data after a successful submission ...
10
votes
5answers
820 views

What's a clean way to implement two checkboxes that can be “ANDed” or “ORed”?

I have a pretty standard search form on a web site that will return records based on various criteria. Let's assume each record corresponds with a person. A person can have a dog, a car, neither, or ...
41
votes
15answers
5k views

Slider control when there is no maximum value

I'm trying to design a control where the user can enter a figure that has no maximum value. For example, how many miles that person wants to travel that year. There's a text field there for direct ...
16
votes
10answers
7k views

Multiple vs single field capture for phone number form input

Working on a form dealing with phone numbers, I've seen two methods to capture user input . In past practices example 2 (image below) has proved effective in controlling phone number lengths on ...
15
votes
8answers
1k views

Is it ok to change the (US) address input field order in favor of a pre-fill feature?

I am working on an international site that requires the user to enter his postal address. I am wondering if it makes sense to have a slightly different order of input fields in favor of a time saving ...
11
votes
4answers
5k views

Where do you put the delete button if you have delete, cancel and submit?

I have a web app which currently uses the following interface. download bmml source – Wireframes created with Balsamiq Mockups Here's what the actions do: Delete will delete this group ...
24
votes
5answers
2k views

Is it a good/acceptable practice to combine checkboxes with radio buttons for one question?

I work on a form, in which there are questions allowing either multiple choices or selecting just one. An example: Which of the sweeties do you like: [ ] chocolate [ ] lollipops [ ] cookies ( ) ...
17
votes
3answers
3k views

Why does * (asterisk) mean Required on a form field

Watching a video from DIBI conference and Jared Spool mentions the mysterious origins of the asterisk (*) on a required form field. Where does this come from, why does an asterisk mean required?
16
votes
6answers
3k views

Credit Card input format

Somewhere, in one of the Usability books I read ( probably Donald Norman ), there was a suggestion that the normal format for entering credit cards was wrong. The usual format is 16 characters in a ...
14
votes
6answers
4k views

How to represent optional fields?

I've read somewhere, that if you have more required fields than optional, best practice is to mark the optional form fields. However I think that asterisk notation for required fields is a widely ...
14
votes
4answers
2k views

Labels above the field or to the side of the field? What about prompt text and validation messages?

Which layout works best for your users?: Field labels on the side of fields Field labels above the data entry fields What about prompt text, format tips, examples and validation or error messages? ...
11
votes
2answers
6k views

When should I use AJAX to submit forms VS regular page submit

Prior to widespread AJAX use and DHTML a form was submitted and the browser would refresh by loading the response to that POST HTTP request which replaced the previous (form) page in the viewport. ...
7
votes
3answers
2k views

How does having multiple stages of a form affect conversion rate?

Say I have membership and donation forms on the website of a not-for-profit organisation. The form is split into multiple stages such that the user submits the first stage (eg. details) and then the ...
5
votes
2answers
2k views

How to layout form navigation for best usability?

Is there any usability study about layout of form buttons? I have a simple registration process. The user is guided with several forms through the process. Each form has a <next> and a ...
23
votes
10answers
11k views

DD/MM/YYYY - do people know what that means?

Just finished reading Caroline Jarrett and Gerry Gaffney's Forms that Work and I noticed that while the publisher used a screen shot on the front cover with that date format the authors didn't ...
19
votes
6answers
3k views

Name on card, or Card number first?

We have a fairly simple credit card form on a public website for users to add a new card, but in the process of adding support for American Express we found they require the collection of the "Name on ...
18
votes
5answers
975 views

Is it better to have an icon in front of validation messages?

As you can see in the above image, there is a validation icon in front of the text. This is unnecessary, but I thought it might be good to catch the eye. If there is no icon, it's still clear ...