Button, Button, Where Goes the Button?

Clients often ask us about button placement on forms. Button placement sometimes causes confusion because on the Web a variety of conventions are used. And there are also different button placement conventions between the Mac and Windows.

The standard Windows dialog box places the buttons on the right side of the dialog, with the primary action (OK) on the left.

Windows XP wizards place the primary action (Next) as the middle button, between Previous and Cancel.

Wizard layout in Vista is slightly different, with the Previous button placed at the top of the dialog--essentially in the same position as a browser back button.

In the standard Mac OS X dialog, the primary action (OK) is on the right.

The  Mac OS X wizard also places the primary action (Next) is on the right.

Web forms tend to place the primary action on the right, as shown in the examples below.

But application-like functionality on the Web sometimes follows the Windows convention of putting the primary action on the left.

But, then again, sometimes the primary action is placed on the right.

For web-based system, we generally place the primary action on the right because this seems to be more of a convention on the web than left placement. Of course, for Windows or Mac applications, we follow the appropriate OS standard.