GUI Elements/Characters

1 Introduction
This document is designed as guidance about correct spelling and usage of some terms related to
the graphical user interface elements and some special characters normally mentioned in all sorts
of reports, defect descriptions, specifications, and test documentation.

2 GUI Elements
This section gives a list of common GUI elements and illustrates how they should be used in text
and what words can go before or after them.
Word order and article: Click the Back button. OR Click Back.
 Button (OR command button)

Note Click the button. NOT Click on the button.

 Radio button (OR option button, option)

Note NOT radiobutton

 Check box (checkbox)

Note NOT check-box

 Drop-down list (dropdown list)

Usage Select an option IN the list OR FROM the list

 Window

Usage Click a button IN the window

 Dialog box

Usage Click an option IN the dialog box

 Menu

Usage Commands ON the menu. ON the Format menu, click Paragraph.

 Pane

Usage IN the right pane

Note NOT text-box

Usage Type in the text box

 Text box

1
3 Sample Descriptions—GUI

Note Correct: Click the button. NOT Click on the button.

Synonyms Command button

Usage Click the Cancel button OR Click Cancel.

Sample defect 1. The Back button takes the user to the previous content page.
descriptions
2. The font of the button text is too large for the button size.
3. There is too little space between the navigation buttons.
4. The cursor does not change its state when being moved between the
buttons of the editor’s page.
5. The entire Add New button should be clickable, not just its text.
6. The rightmost unnamed button does not have a hint.
7. The control buttons on the toolbar do not change their state when the
cursor is over them.
8. The text on the Start Task and End Task command buttons has a shadow
on it.
9. The On or Off options are designed as command buttons. It is more
appropriate to use radio buttons instead.
10. The command buttons on the toolbar are named by nouns that do not
describe clearly the action performed by each button, e.g. Request. It
would be better to use verbs, e.g. Submit Request.
11. The Add User and Edit User buttons are not identical in size.
12. The drop shadow on the Create button falls from the bottom right, and
the on the Delete button it fall from the bottom left.

 Radio button

Note NOT radiobutton

Synonyms Option button, option

Usage Select the Every week radio button. OR Select the Every week option.

Sample defect 1. One of the radio buttons under Period must be switched on by default.
descriptions
2. The radio buttons on the Subscription page are not vertically aligned. The
last two buttons (Sports news and Music) are indented to the right.
3. The text of the radio buttons on the Notification Settings page is
displayed to the left of the radio button indicators, although the
application is designed for the UK locale with the left-to-right writing
system.
4. Several radio buttons (Import Shared Library and Import File via FTP)
start with identical words.
5. When the Every day radio button is disabled, its text remains enabled.

2
4 Characters
The table below lists characters commonly used in descriptions of CQ defects.

, comma

. period

! exclamation point

? question mark

- hyphen

— dash

: colon

; semicolon

_ underscore

* asterisk

~ tilde

` grave accent

@ at sign

# number sign

$ dollar sign

% percent

^ caret

& ampersand

() Parentheses or round brackets 

( left parenthesis

) right parenthesis

<> angle brackets

{} curly brackets or braces

[] brackets, box brackets or square brackets

+ plus sign

| vertical bar

\ backslash

/ slash (mark)

3
" quotation mark

' apostrophe

§ section sign

± plus-minus sign

= equal (sign)

< less than

> greater than

≤ less than or equal to

≥ greater than or equal to

… dots, ellipsis