Dynamic Input Hints mini

Also known as: Automatic Inline Help, Form Field Hints

Tags: forms, help, inputs

Dynamic Input Hints are instructional texts or examples that are shown when a user clicks or tabs to an input field.

Showing input hints only when people feel they need them keeps the form simple and uncluttered compared using Always Visible Input Hints. Therefore, Dynamic Input Hints should be considered to be used especially with complex, long forms with many input fields. Also, this patterns works best for forms containing questions that most people can answer, but they are not sure why or how they should give their answers.

When the user moves to an input field, the helps text should appear immediately below or beside the input field, and the selected input element should be highlighted. Usually an input hint is related to one form field, but sometimes it is a better idea to bound the help text to a set of inputs. In both cases it is important to tie the help text visually to the input field it is connected to.

If it is important to show the help text before the user moves to an input field, consider using Input Prompt (show the help text inside an input box).

On Recipefy, the input hint is shown directly above the text field to which it applies.

On Recipefy, the input hint is shown directly above the text field to which it applies.

Useful linksUseful links icon

Code snippetsCode snippets icon

Example Images (5 examples)

Comments

  • logiebil July 28, 2011 10:32

    awesome guidelines.