Designing Tables Designing Tables

Placement of Table-Related Functions

The goals of the following proposed changes are:

  • To specify that table-related functions should appear as pushbuttons near the table control, and not in the pull-down menus or in the application toolbar.
  • To specify the order in which the table-related pushbuttons should appear.

Background

Due to the ever-increasing number of functions in most R/3 applications, the pull-down menus are becoming longer and longer, making it very difficult for users to find the functions they want. Application toolbars are also becoming more crowded, making particular pushbuttons difficult to find and making the various icons more difficult to differentiate.

As more complex contexts appear in the R/3 system it will become even more difficult to find the controls that pertain to a particular table or other screen element. In the specific case of table controls, placing functions in the pull-down menus and application toolbar forces users to change contexts, leaving the table area to go search the menus or toolbars for the table-function that they need.

Placement and Spacing

Functions that are related to a table should appear as pushbuttons in the window work area, very close to the table itself. It is not necessary for these table-related functions to be in the pull-down menus or in the system or application toolbars.

All table-function pushbuttons should appear in a single row, immediately below the table. In most cases, this placement matches the top-to-bottom workflow of the user, and positions the pushbuttons clearly in context of the table and away from other controls.

This placement and spacing of buttons applies whether the table appears in a main window, in a tab area, or in a pop-up dialogue. In a pop-up dialogue, the table-function pushbuttons must be in the same row as the dialogue control pushbuttons "OK" and "Cancel".

Exception: In some cases, it is allowable to place the button row above the table, instead. One example would be if you expect the enduser to be using a very large screen and you want the buttons to be closer to the top of the table to make them more visible and to minimize mouse movement to get to the pushbuttons.

Horizontal Spacing

The leftmost button should be left-aligned with the bottom left edge of the table. Pushbuttons for related functions must be placed right next to one another, with one horizontal space (one column in the Screen Painter) between them. Groups of functions must be separated by a two spaces (two columns in the Screen Painter).

See the suggested ordering in figure 2 for a recommendation of which buttons to group together.

Vertical Spacing

There should be a very small vertical space between the bottom of the table and the tops of the pushbuttons. This space is about half the height of a push-button. The necessary space will be automatically generated by the GUI. Do not insert an empty row between the table and the buttons - this will cause too much vertical space to appear.

Figure 1: Placement of table pushbuttons

 

Order from Left to Right

Figure 2 shows a list of the most commonly used table-related functions, as well as a nearly complete list of all table functions. The functions that you choose to use depend on the context of the table and the needs of the users' tasks, but usually you need only the most common ones, plus any functions specifically related to your application.

Once you determine which functions are appropriate for your application, place the pushbuttons in the order shown below, from left to right. Include separator spaces between groups of buttons, as indicated.

Any functions that you do not use should not be included. These unused functions should not appear in the button row at all - do not include them and then gray them out.

This ordering of buttons applies whether the table appears in a main window, in a tab area, or in a pop-up dialogue. In a pop-up dialogue, the "OK" button should appear at the far left and the "Cancel" button should appear at the far right, after all of the-related pushbuttons.

Most Commonly Used Table Functions:
Order from Left to Right
  (Nearly) All Table Functions:
Order From Left to Right
 

Figure 2: Order of most commonly used functions

 

top top

Source:  SAP R/3 Style Guide