Skip to main content

Text Input

A text field is an input that can be used on a form, sign-in or any place where data is requested from the user.

Do's​

  • minimise the number of input fields - only ask for necessary information
  • arrange them vertically for better layout and readability
  • group related fields together
  • order input fields logically, matching real-world task succession and interactions
  • always label each text area with a short, descriptive title, placed above the text area
  • indicate whether the input field is optional or mandatory
  • make use of helper text if there are further directions or hints the users may need in completing their goal (example: Must be at least 6 characters and contain a number and a special character)
  • allow copy/paste for ease of use
  • if a character counter is necessary, place it below the text area
  • match the text field area to the expected size of the input - make it wide enough for the user to see their entire entry
  • write specific and descriptive error message for easy comprehension

Don'ts​

  • don't use placeholder text in the text area - this may not be read by screen reading software, leading to accessibility issues
  • don't have a mandatory minimum input of characters
  • don't restrict the use of uncommon or special characters
  • don't disable copyand paste functions

When to use​

  • use in any situation where the user needs to input limited amount of data (name, email address, age, etc)

When not to use​

  • do not use where the user needs to input a large, or unknown amount of data
  • do not use when the user must respond with specific options which are known to the organisation