Projects/Usability/HIG/SOU Workspace/Status Bar: Difference between revisions
(New page: A status bar is an area at the bottom of a window that can be used to display brief information about the status of the application. === Guidelines === == Selecting the right information...) |
No edit summary |
||
| Line 11: | Line 11: | ||
* General information about the document or application. For example, current connection status in a network application, or the size of the current document in a text editor. | * General information about the document or application. For example, current connection status in a network application, or the size of the current document in a text editor. | ||
* Progress of a background operation. For example, "Sending to printer", "Printing page 10 of 20", "Printing Complete". | * Progress of a background operation. For example, "Sending to printer", "Printing page 10 of 20", "Printing Complete". | ||
* Information about the | * Information about using the current tool. For example, while using the selection tool in a drawing application, "Hold Shift to extend the selection" | ||
* A description of the control or area of the window under the mouse pointer. For example, "Drop files here to upload them" | * A description of the control or area of the window under the mouse pointer. For example, "Drop files here to upload them" | ||
| Line 21: | Line 21: | ||
* Information about routine checks (unless something - non-critical - has happened) | * Information about routine checks (unless something - non-critical - has happened) | ||
* An error | * An error that is critical to the task | ||
== Status bar layout == | == Status bar layout == | ||
* | * Display status messages on the left end of the status bar | ||
* Place permanent status indicators (icons or text) to the right of status messages, with enough space to display the longest message your application may give | |||
* Place progress bars to the right. Don't use a placeholder when there is no background operation happening. | |||
== Providing contextual help == | |||
Use tooltips to describe status indicators that are not self explanatory or to give additional information about a status. | |||
== | == Interacting with the status bar == | ||
* Use interactive elements in the status bar sparingly - if at all. Don't use the status bar as an additional toolbar or as a supplement to the toolbar. | |||
* You may allow to change a status indicated on the status bar directly by clicking on the status bar indicator. | |||
** Never use clicking the status bar indicator as the only means to change a status. Also provide a toolbar button or menu item. | |||
Revision as of 16:43, 12 September 2008
A status bar is an area at the bottom of a window that can be used to display brief information about the status of the application.
Guidelines
Selecting the right information
Use statusbars for information that is
- Relevant to the current user in the current situation
- Not critical (i.e. information that does not need immediate response)
Examples:
- General information about the document or application. For example, current connection status in a network application, or the size of the current document in a text editor.
- Progress of a background operation. For example, "Sending to printer", "Printing page 10 of 20", "Printing Complete".
- Information about using the current tool. For example, while using the selection tool in a drawing application, "Hold Shift to extend the selection"
- A description of the control or area of the window under the mouse pointer. For example, "Drop files here to upload them"
Do not use status bars for
- Information that most users won't need while using the application. Put that information in a log file or display it in a dialog on demand.
- Critical information to which users need to respond in order to complete their task or avoid loosing any work. Display critical information in a dialog instead. Users may miss information displayed in a status bar and some novice users might not even notice the status bar at all.
Examples:
- Information about routine checks (unless something - non-critical - has happened)
- An error that is critical to the task
Status bar layout
- Display status messages on the left end of the status bar
- Place permanent status indicators (icons or text) to the right of status messages, with enough space to display the longest message your application may give
- Place progress bars to the right. Don't use a placeholder when there is no background operation happening.
Providing contextual help
Use tooltips to describe status indicators that are not self explanatory or to give additional information about a status.
Interacting with the status bar
- Use interactive elements in the status bar sparingly - if at all. Don't use the status bar as an additional toolbar or as a supplement to the toolbar.
- You may allow to change a status indicated on the status bar directly by clicking on the status bar indicator.
- Never use clicking the status bar indicator as the only means to change a status. Also provide a toolbar button or menu item.