Window Design

The guidelines for window design.


[ Guidelines | Essential Related Topics | Supplemental Related Topics ]

Guidelines

Design the initial size and layout of an action window so that a user will not need to scroll the window.
Within a column of controls, left-align the edges of the controls to the right of the longest field prompt.
Single Line Text should be defined as Select on Entry
Arrange controls in a logical order, using rows and columns. Determine the users preferred order
Align fields and controls vertically and horizontally, so the cursor moves in a straight- line pattern.
Group related items together. Identify groups with group headings. Separate by using blank lines or spaces. Use a group box only when a group heading or blank space does not visually distinguish groups of fields or controls.
Use pre-selected choices and pre-filled entry fields whenever possible.
Combine components to be contextually sensitive to the users need.
Make windows modeless whenever possible, and determine the most usable default location and size.
Make sure that the initial cursor placement and the tabbing sequence make sense to the user.
Place push buttons that affect the entire window horizontally at the bottom of the window and justified from the left edge.
Avoid placing push buttons in more than two rows.
If the action indicated by the label on a push button adjusts or is associated with a component within the same window as the push button, place the push button near that component. For example, if the function of a push button is to restore the initial value in an entry field, place that push button beside the entry field that it affects.
Avoid using a push button to change the size of a window; instead, allow a user to change the size of the window using the size borders and the maximize push button or Maximize choice. For example, do not provide a push button labeled More>> to allow a user to enlarge a window.
Use a Tab to organize groups of controls when they will not fit in a single window. Avoid placing related controls in separate windows connected by routing choices on push buttons.
Place a field prompt above or to the left of the field it is associated with.
Left-aligned entry fields so that a narrow vertical column of space is left between the field prompts and their associated entry fields to allow a user to quickly scan the choices in the window.
Allow a user to adjust the size of each column in a window, where appropriate. For example, provide column borders that a user can directly manipulate to change the size of columns.
If a user cannot adjust the width of a column or scroll the column, make the column at least as wide as the widest item in the column or as wide as the column's heading, whichever is wider.
If a user can adjust the width of a column, make the initial width of the column wide enough to display choices of average width.
If the order of columns can be changed, allow a user to directly manipulate each column. For example, allow a user to drag column headings to change the order of columns.
If you provide an information area, place it at the bottom of a window.
If you provide an information area and there is a horizontal scroll bar in the window, place the information area below the scroll bar and above the window border.
If you provide a status area, place it below the title bar and below the menu bar, if a menu bar is provided, and above the rest of the window. For example, place a status area below the menu bar and above column headings in a window.

Essential Related Topics

Supplemental Related Topics


[ Top of Page | When To Use | Guidelines | Essential Related Topics | Supplemental Related Topics ]


Home

Copyright ©. 1991-1999 Interfaced Systems International Inc. Last modified: Saturday, March 20, 1999 11:42:30 PM EST