h11

Predictive input at a glance

Site Genre: Pattern Group h

magnify imageFigureH11.1 Dynamically loaded content enables customers to select departure and arrival cities on this travel site. In addition to saving keystrokes, the option lists also prevent ambiguity due to inconsistent abbreviation of city names.

Background

Used by all patterns in Pattern Group A (Site Genres), this pattern provides a method for simplifying the completion of forms. Predictive input can make a CLEAR FORM (H10) even easier to use.

Close

PROBLEM

Filling out forms can be tedious when lots of typing is required.

buy the book to find out more

SOLUTION

magnify image FigureH11.4 Predictive input makes it more likely that your customers will complete forms quickly and accurately./div>Change type-in fields to predictive pick lists when option lists are short. Use predictive text input for medium and large option lists. Configure forms either to preload predictive input with the page or to load it dynamically. Build a list of text strings that can function as viable options for a particular form field, and sort them using an appropriate method for the information: alphabetical, chronological, or by popularity. Create a predictive text input window that appears when the customer begins typing in the field. Size the window appropriately for the amount and type of information to be displayed and its place on the screen. Let customers choose options with both the keyboard and mouse.

Other Patterns to Consider

Use FAST-LOADING CONTENT (L6) to preload predictive text input options as the page loads, or as visitors type. Put the predictive text input field in the page’s GRID LAYOUT (I1). Keep the predictive text input field ABOVE THE FOLD (I2).

Close

 

Pattern Resources

PATTERN COMMENTS

POST A COMMENT and/or EXAMPLE WEBSITE

You must be logged in to post a comment.