Whether using a keyboard, mouse, trackpad, or your voice, inputting information can be a tedious and sometimes error-prone process. When an app asks for lots of input before doing anything useful, people can get discouraged quickly.
Let people make choices whenever possible. Consider using a table, pop-up button, or set of radio buttons instead of a text field. The ability to choose from a list of predefined options rather than type a response makes data entry quicker and more efficient.
Simplify navigation of value lists. In controls like tables and pop-up buttons, make it easy to locate a specific value. Consider sorting values alphabetically or in another logical manner that facilitates speedy scanning and selection.
Use an introductory label or placeholder text to help communicate purpose. A label helps users understand what type of information they should enter. A text field can also contain placeholder text—such as Email or Password—when there’s no other text in the field. A label is often unnecessary when placeholder text is present. Generally, labels should use title-style capitalization and end with a colon, while placeholder text should use sentence-style capitalization and no punctuation. For related guidance, see Labels.
Adjust text field line breaks accordingly. By default, any text extending beyond the bounds of a text field is clipped. A text field, however, can be set to wrap text to a new line at the character or word level, or to be truncated (indicated by an ellipsis) at the beginning, middle, or end.
Consider using an expansion tooltip to show the full version of clipped or truncated text. An expansion tooltip behaves like a help tag and appears when the user places the pointer over the field.
Use secure text fields when appropriate. Always use a secure text field when your app asks for sensitive data, such as a password.
Let the user adjust text attributes if it makes sense. If your text field contains styled text, it may add value if the user can adjust the font, size, and color of the text.
Get information from the system whenever possible. Don’t force people to provide information that can be gathered automatically or with the user's permission, like contact or calendar information.
Provide reasonable default values. To the extent possible, prefill fields with the most likely values. Providing good defaults minimizes decision making and speeds up data entry. Whenever possible, use autocomplete to offer suggestions as the user types. Autocomplete uses any text the user has entered so far to provide one or more suggested entries. The user can accept a suggestion or continue typing. Suggestions continue to be refined as more typing occurs.
Never prepopulate a password field. For security, the user should be asked to enter their password, use Touch ID, or authenticate using a keychain. For related guidance, see Authentication.
Ensure the accuracy of data populated by your app. People appreciate the convenience of having some information supplied for them, as long as it’s correct. If you can’t guarantee the accuracy of the information you provide, it’s better to leave fields empty.
Require field values only when necessary. Use required fields only for information that is truly necessary to proceed.
Defer showing a required indicator next to a required field until the user tries to proceed without entering a value. Preemptively displaying an asterisk or a custom icon next to each required text field and selection control can make your interface appear cluttered and unappealing. Assume people know what they're doing and will enter all required values. If they forget one, show an indicator next to the forgotten field when they try to exit the current context.
Dynamically validate field values. It’s frustrating when you have to go back and correct mistakes after filling out a lengthy form. Whenever possible, check field values immediately after entry so users can correct them right away.
Perform appropriate field validation. Let the user know if they’ve entered an invalid value. If the only legitimate value for a field is a string of digits, for example, your app should alert the user if they’ve entered characters other than digits. In most cases, the appropriate time to check the data is when the user clicks outside the field or presses the Return, Enter, or Tab key.
Use a number formatter to aid with numeric data entry. A number formatter automatically configures the text field to accept only numeric values. It can also be set to display the value in a specific way, such as with a certain number of decimal places, as a percentage, or as currency.
Enable advancement only after collecting required values. Before enabling a Next or Continue button, make sure all required fields have values. The enabled button provides a visual cue that it’s OK to proceed.