Forms
Forms are used to input and display data. All forms should be aligned left and can span across the width of the page if required. Form elements are in cased in a light grey outined box with a gradient starting from the bottom. The buttons are always 10px from right and bottom side margins.
Checklist for form elements:
- All fields must be clearly labelled.
- Ensure labels are capitals.
- Radio buttons are used when selecting between 2 options only. Because the two options are mutually exclusive, radio buttons restrict the user to selecting exactly one option. One item must default.
- Checkboxes are used when the user can select multiple choices, including zero, one, or several. In other words, each checkbox is independent of all other checkboxes in the list, so checking one box doesn't uncheck the others.
- Stand-alone checkbox is used for a single option that the user can turn on or off.
- If legal acknowledgement is required, ensure the user can get access to ‘Terms and Conditions’ near where acknowledgement occurs.
- Lay out your lists of tick boxes or radio buttons vertically.
- Date fields should consist of separate fields for day, month and year.
- Required fields should be indicated by a ‘ * ’ (= required fields). Note: the asterisk should come after the colon, see illustrations. Also add note on form to indicate what this means.
- Alt tags should be applied to both fields and label.
- Use positive and active wording for checkbox labels, so that it's clear what will happen if the user turns on the checkbox. In other words, avoid negations such as "Don't send me more email," which would mean that the user would have to check the box in order for something not to happen.
Forms
| Headings | |
| Verdana 12px bold #354F5C |  |
| Required Fields Text | |
| Verdana 10px #000000 Asteriks: #CC0000 |  |
| Background Image & Borders | |
| Background Image: Align: Bottom Repeat-x Border: 1px #E9E9E9 |
 |
| HR | |
| width: 100% height: 1px color: #EEEEEE |  |