Input fields are several different controls such as textboxes, dropdown lists and radio buttons who reside in a (web) form.

learn more… | top users | synonyms

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 ...
73
votes
13answers
6k views

Why does the email subject appear before the body when composing an email?

Note: I am not talking about reading experience, I am focusing on the experience of composing email. I am very aware of this issue since it happens to me all the time, and I am pretty sure that it ...
50
votes
11answers
9k views

“Typocaptcha” - an alternative to CAPTCHA?

We all hate CAPTCHAs, but to some applications they're a necessary evil. Today I wondered if there's a better alternative we just haven't thought of yet. I considered the dilemma: how do you create ...
47
votes
5answers
6k views

To clear (or not to clear) the search box?

We are having a discussion at the office today, about when to clear (or not to clear) a search box from its input. Is there a preferred approach, something that the user expects? Like emptying the ...
45
votes
4answers
6k views

Why aren't HTML5 typed number inputs right aligned, and should they be?

As you may know, with HTML5 when an input has type="number" the field is "customized". Two little arrows are added to the field (w3school example) but the numbers are still left aligned. I saw that ...
43
votes
6answers
2k views

When the username is an email address should the field be called 'username' or 'email'?

When the username for a service is an email address should the field be called 'username' or 'email'?
37
votes
4answers
3k views

Why does the Stack Overflow swag request form have six address lines?

Some backstory: I ran in the Stack Overflow election, and lost. Poor me. The SE gods took pity upon me, though, and sent me a link to a form where I could give them an address and they would send me ...
36
votes
3answers
3k views

What do you call this input element where a focus will automatically be transferred to next text field after being filled?

I have seen this input element often when inputting a serial number or similar code. Each text field accepts N characters, after which focus is automatically transferred to the next field. Pressing ...
36
votes
7answers
51k views

How to avoid 12:00 AM midnight/noon confusion in a time input field?

I recently specified the wrong deadline for an assignment, for a "dropbox" in the D2L course management application. I was trying to choose 12:00 noon, and the time entry field showed 12:00 right ...
35
votes
4answers
3k views

Where should the GUI light source come from?

I know that historically the light source on GUIs is in the upper left, casting a shadow on the bottom-right of buttons and the upper left of fields. Now, I see some places (like Apple) use a top ...
32
votes
5answers
3k views

How to tell a user that a search is being performed when they stop typing

I'm developing a web application and inside this application I have the following form Whenever the user changes the value of the Tax Code field and there is a pause in typing, a database search is ...
32
votes
4answers
10k views

Character limits on fields - pros and cons and best practices?

Some of our form fields have character limits. We're debating whether we should reflect the current size of data entry, or to simply hard-limit and inhibit data entry beyond that size. In HTML, ...
31
votes
5answers
2k views

Auto Advance to Next Field

When is it appropriate to 'auto advance' from one text field to the next, as in phone numbers and SSN?
30
votes
9answers
5k views

Good UX for inputting 14 different times

I'm updating a form which has elements for each day of the week, and the user needs to select a start time and end time for each day. Currently this is just 14 different text boxes where users can ...
29
votes
7answers
3k views

Is there a recommended size for search boxes?

Do users change their search patterns if the search is shorter? Do users search less if the search box is too large? The only article I'd found is a 2009 Smashing Magazine article: The [Nielsen] ...
27
votes
5answers
2k views

Is constantly updating the formatting of a numeric input box a good idea?

I have a numeric input box, as part of a form. I'm implementing delimited splitting, to make large numbers easier to read. ie, 1000000 would become 1,000,000. Would it be a good idea to automatically ...
27
votes
6answers
5k views

When and why should date pickers be used?

The above screenshot is from an airline's website. Date pickers are somewhat common on websites - they're especially common for circumstances when you're booking events. Most often when they appear, ...
26
votes
9answers
12k views

Mark or don't mark required fields if all are required?

If all fields in a form are required should they be marked somehow (eg. with an asterisk)? I see this done a lot and find it redundant? There could be a difference in big forms and small forms, but ...
26
votes
4answers
12k views

What should the character limit(s) for first/last name inputs be? [closed]

We want to create input fields for a user's first and last names. What should the minimum and maximum limits be, if any, and why?
23
votes
9answers
3k views

How to warn a user they are approaching the character limit for a text input field with a soft maximum?

I'm writing an internal web application to generate subtitle text for videos. Part of the requirement for this project is that each line not exceed X characters, except where circumstances warrant. I ...
22
votes
5answers
3k views

Is it standard practice to indicate on the form that Caps Lock is on?

In forms where certain input fields have case sensitive input data, is it an accepted or standard practice to indicate somewhere on the form that caps lock is on? I am thinking that this concept doesn'...
21
votes
7answers
2k views

Disable or hide input fields?

I have three radio buttons and text input fields, but the user is only supposed to be able to use the input fields if the radio button is checked. What would be the best approach? To hide the input ...
21
votes
5answers
3k views

What is the best practice for password field placeholders?

It seems like the accepted best practice for email fields is to have a label and an example email address. Assuming you want a consistent style, the label will make it clear that it's a password field....
21
votes
6answers
2k views

Combining all the address fields into one?

Both customers and companies want a quick and easy checkout experience. From what I've seen, a big UX bottleneck at checkout is the billing and/or shipping address(es) because there are so many input ...
18
votes
5answers
2k views

Should input fields be cleared out when the user selects them?

I have a few input fields in my form with some default values (numbers). Please note, they are not just placeholders, i.e. they can be used as is, if they are not changed. I was wondering if I should ...
18
votes
2answers
1k views

Input Field Widths

I just created my account on ux.stackexchange.com. I'm a developer and don't have much experience in UX best practices. So I intend to start coming to this site regularly. My question is really ...
17
votes
4answers
1k views

How wide should input fields be?

I'm trying to find a good default width for money input in my forms. If I assume that the amount people will put in is under 1 billion Euro, the width of the value, including decimal places and ...
16
votes
6answers
1k views

Is it acceptable to make a text field look like a write in line?

My designer would like to implement a text field that drops down on hover against a white background, and only have a bottom border to define the field. Also, the designer would like to see a flashing ...
16
votes
3answers
3k views

Best ux design for “add row” to enter multiple values

Ive seen this following method on Xing that allows multiple entries of unknown limit: I want a better way, since the + and - look confusing i sometimes get confused myself, in addition the high-...
15
votes
3answers
31k views

How do users react to Bootstrap's uneditable-input class?

Bootstrap supplies a class .uneditable-input, which can be applied to a span/label/text/etc to mimic the appearance of a disabled text input. Bootstrap describes it as: "Uneditable inputs: Present ...
15
votes
6answers
1k views

Case-study for hiding the optional fields?

I am currently designing a web form for the Online Travel Insurance System and I am thinking of hiding the optional fields since there were so many of them. Like the image below. I put a Show More ...
15
votes
3answers
4k views

Float Label Pattern for Select Boxes

I'm sure you've all come across this pattern, does anyone know whether there is any documentation that can provide information on how this pattern can be used with other form elements for example a ...
14
votes
6answers
1k views

Using asterisk (*) vs required [duplicate]

For a long time, the norm was to put a red asterisk "*" after the field label if the field was required. Now I am observing a shift into replacing the asterisk symbol with the word "(required)" after ...
13
votes
6answers
1k views

How to convey a true/false value to a user?

I'm developing an application where users will be allowed to create custom fields that are part of a record, in addition to the fields that are provided by default. Users will be able to choose names ...
12
votes
9answers
2k views

Does leaving a field blank - mean “everyone”

I'm beating myself up over this one, since we had just that discussion today. We were arguing why a customer was eager to pay a week of work for something that could be trained. And to me it’s pretty ...
12
votes
8answers
2k views

How to show two options without preferring one over the other initially?

I want to ask for a persons gender, but I don't want to make a choice in which to put first, male or female. Normally one would use radio buttons for this, O male O female However, there is ...
11
votes
4answers
14k views

For required fields, should we add the red asterisk before or after the field label?

Should we add red asterisk before or after the label of required fields, i.e., to the left or the right of the field name? My boss prefers to add the asterisk before the labels, but I like to add them ...
11
votes
2answers
327 views

Form with input boxes packed together

I'm wondering if there is an official name for this style of the form: Example uses: https://www.tumblr.com/login OR https://www.tumblr.com/register where the input boxes are packed together with ...
10
votes
6answers
1k views

Convey to user that they can input absolute numbers or percentages

I have a quoting form in which I want users to have the ability to add a discount. The discounts can be added as percentage or absolute values. My current design is a text field and a dropdown for ...
10
votes
5answers
845 views

What is the term for a numeric input field of a specific format?

There are new HTML5 input types being defined for commonly used numeric input types such as date, time, telephone number, etc. These terms refer to a specific input format based on the type of numeric ...
10
votes
5answers
730 views

What is the best way to show conditional fields?

We are creating a desktop app where (business) users can enter contracts. The issue is that the contract form contains a very large number of fields, with some of them being conditional. An example ...
10
votes
4answers
369 views

Does the height of an input field affect UX?

Overview I'm working on a project that includes an in-browser Chat feature. We're looking for ways to improve the UX. Problem Today, our online chat UI offers a textareathat allows customers to ...
10
votes
1answer
660 views

Time (duration) entry in webapp - pros/cons of various designs

In designing a way to enter time durations in a website, there are various proposals below. What are the pros/cons from a UX standpoint for both mouse & touch uses. Yellow boxes show input ...
9
votes
4answers
2k views

Help tooltips and screen-readers

I have an input form that contains help tooltips for many of the field labels (usually more meaningful than the example). download bmml source – Wireframes created with Balsamiq Mockups ...
9
votes
2answers
384 views

What's the official name of concept of input boxes with tags?

I'm looking for an implementation and the (official) name of this kind of control where it's a inputbox where we can add multiple tags into it. By example, it is used in JIRA like this capture (and ...
9
votes
5answers
261 views

horizontal drop down

I had a look around, but is there such a thing as a horizontal drop down (or drop across as it were)? I'm involved in a website project where the PO wants to introduce this; however, I'm not sure ...
8
votes
4answers
295 views

Converting two character dates into four character dates

I have an application that converts the following invalid dates, with only two-character years into a valid date format automatically while the user's filling out the form: (NOTE: The application is ...
8
votes
4answers
791 views

Is it good practice to only accept numeric keystrokes in number-only fields?

I have a form that only takes in numbers as it represents a dollar amount. Currently, the form only accepts numerical keystrokes. Is this good practise?
8
votes
4answers
1k views

Is it useful to have all the input controls in a form the same width? [duplicate]

All the input controls are the same size in this question about form design: Why might right aligned field labels be better? My question is if does it help with something, or it is just a matter of ...
8
votes
3answers
872 views

Alignment of input fields in a form with plain text

I have a details page containing a list of information and input fields at the same time. Sections are alternating between information and input fields. I am debating between the alignment of data. ...