Questions tagged [input-fields]
Input fields are several different controls such as textboxes, dropdown lists and radio buttons who reside in a (web) form.
641
questions
119
votes
10
answers
62k
views
Splitting credit card number fields into four different inputs
I have previously been using 4 fields for the credit card number, splitting up each set of 4 numbers to make it easier to enter.
I am now thinking about having one field, which inserts spaces after ...
- 2,343
100
votes
12
answers
34k
views
Removing placeholder text on focus
Chrome, Safari, and Firefox 15+ remove the placeholder text after the users first key press in the text input field.
Opera, IE, and Firefox 14 and below remove placeholder text immediately after ...
- 3,882
78
votes
13
answers
8k
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 ...
- 770
67
votes
4
answers
50k
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 ...
- 3,034
59
votes
11
answers
8k
views
Why is the input field always at the bottom of a chat window?
It seems like the input field for writing your messages in a chat application is always placed at the bottom of the conversation.
Do we have any argument for this seen in a UX perspective?
55
votes
11
answers
10k
views
"Typocaptcha" - an alternative to CAPTCHA? [closed]
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 ...
- 1,049
54
votes
4
answers
44k
views
Character limits on textarea 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, ...
- 9,271
49
votes
5
answers
10k
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 ...
- 3,453
49
votes
6
answers
10k
views
How should I allow a user to input a number where not all numbers are valid?
I have an application where users need to configure certain machine settings. One of these settings is an integer percentage value, from 1-100. Unfortunately, for historical reasons, we're not ...
- 593
46
votes
8
answers
11k
views
How to enable users to insert an infinity number
I am designing a web page which give admin users the opportunity to manage the users below them. in one section of this admin page, the admin user is required to fill out how many queries he permits ...
- 677
46
votes
6
answers
4k
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'?
- 543
42
votes
3
answers
5k
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 ...
- 538
41
votes
7
answers
134k
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 ...
- 513
40
votes
4
answers
4k
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 ...
- 787
39
votes
11
answers
44k
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 ...
- 1,086
38
votes
7
answers
8k
views
How can I reduce duplication of radio buttons?
I've been asked to redesign a score calculator for a website. At the moment it looks like this:
I was wondering if there is a way to optimise the radio inputs, so that there isn't as much repetition? ...
- 549
37
votes
7
answers
22k
views
Best error color on blue color?
I have the color: #4285f4 and I'm looking for a easy to read error color code. I'm using Google's default error color: #dd2c00. However this doesn't read very well on the page...
- 473
37
votes
4
answers
4k
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 ...
- 9,297
37
votes
4
answers
92k
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?
- 371
34
votes
4
answers
6k
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?
- 343
32
votes
9
answers
7k
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 ...
- 925
32
votes
5
answers
4k
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 ...
- 481
32
votes
8
answers
13k
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] ...
- 675
32
votes
6
answers
9k
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, ...
- 882
31
votes
5
answers
33k
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....
- 413
29
votes
5
answers
3k
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 ...
- 503
28
votes
1
answer
7k
views
Google and Yahoo require you to enter your username first, then password. Why is this? [duplicate]
For a while now, logging onto your google account has required you to enter your username and hit next, before entering your password like this:
Recently yahoo has implemented a similar system.
What ...
- 397
27
votes
3
answers
22k
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-...
- 956
26
votes
6
answers
4k
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 ...
- 2,315
26
votes
6
answers
3k
views
Form layout with fields which are sometimes input and sometimes output
I'm designing the UI for a desktop application. In one of the windows certain interdependent properties of an object are listed. I want the user to be able to choose which properties are to be used as ...
- 363
25
votes
8
answers
6k
views
Customers using the New Order option when they should use Reorder
I have a form for customers to place orders through a form (An Ecommerce solution is coming, but in the meantime we are using this). There is one <select> drop down that was giving us issues. ...
- 518
25
votes
9
answers
8k
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 ...
- 5,985
25
votes
5
answers
5k
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'...
- 26.7k
24
votes
7
answers
5k
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 ...
- 3,453
24
votes
5
answers
4k
views
Why would the search input field not get focus when the page is loaded?
Opening up google.com I see that the search input field gets focus automatically, i.e. the cursor is already blinking in the field and users can start typing right away.
In contrast, amazon.com or ...
- 8,746
24
votes
2
answers
2k
views
Input Field Widths
In a form with several input fields, is it better to define the same width for all fields (in order to maintain alignment), or to have different sizes for fields that are intended for less data?
For ...
- 353
22
votes
6
answers
15k
views
What is the most common color to indicate the input-field is disabled?
as I have been going through different references on input-field designs, I realized that people tend to flip-flop with grey or white background to indicate whether the input-field is enabled or ...
- 339
22
votes
3
answers
8k
views
Is password-unmasking worth the potential security downside?
I work on the iOS implementation of a mobile application where the (cross platform) design guide specifies an unmasking-control for password fields. I am primarily an iOS+Mac user, so this concept was ...
- 323
21
votes
2
answers
4k
views
Two forms to choose from, choose only one
I've got one screen with two API options available (web tool). Both forms include a title and two input fields. The user can only choose one API at the time.
Now, I've tried checkboxes, a dropdown ...
- 311
21
votes
6
answers
67k
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 ...
- 537
20
votes
8
answers
15k
views
Signifying to user that field is editable
I have a grid that has a bunch of data. Some of the fields are editable and cause a postback updating the data. What are the best ways to show that to the user?
i.e. Is there a best practice for how ...
- 303
19
votes
4
answers
22k
views
Editable table in material design
we're designing a web application in material design and we have an editable table there - something like this:
Any suggestion on how to indicate the editable fields, if not all columns are editable? ...
- 707
18
votes
3
answers
41k
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 ...
- 181
17
votes
5
answers
3k
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 ...
- 273
17
votes
4
answers
31k
views
Material Design required field
Has anyone seen in Material Design how to present a required field?
At the moment it seems the guideline is either to hide the submit button until required fields are populated or else throw an error ...
- 313
17
votes
6
answers
8k
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 ...
- 466
17
votes
6
answers
4k
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 ...
- 285
17
votes
5
answers
8k
views
Should I make space for error messages in forms?
I'm designing an mobile app for both iOS and Android, which includes a form. The form has several required input fields that the user needs to complete before continuing.
If the user clicks Continue ...
- 201
16
votes
4
answers
5k
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 ...
- 3,686
16
votes
6
answers
3k
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 ...
- 1,605