Submit and HTML Forms Guidelines

Consult with Manweb and Communications Services Manitoba (webmaster@gov.mb.ca or standards@gov.mb.ca) before creating online forms.

Refer to the Electronic Form Design Guidelines for information on creating fillable PDF forms.

Submit Form

Provide an e-mail response to automatically acknowledge receipt of message. Check for undeliverable e-mail before preparing a response to the user's e-mail.

• Radio buttons as well as text boxes are acceptable with the following HTML code. Please make sure the labeling is to the right or above the field area.
• Mandatory fields should be indicated with an asterisk (*).
• All data entry fields must indicate units where applicable (ex: hours, $).
• The correct format for any date entry is DD/MM/YYYY and must be indicated.
• The submit button must be located at the end of a data entry section. There should also be a Clear Form button as well.
• If data entry validation is to be performed, incorrect entry field(s) must be identified for the user on the error message screen (make sure this is bilingual for both French and English pages).
• The users should always move horizontally across the page when tabbing between fields.
• Indicate to the user how the information being collected will be used.

HTML Forms

HTML forms pose accessibility problems when web developers separate a form element from its associated label or title. For instance, if an input box is intended for receiving a user's last name, the web developer must be careful that the words "last name" (or some similar text) appear near that input box or are somehow associated with it. The visual proximity of a form element and its title offers no guarantee that a screen reader will associate the two or that this association will be obvious to a user of assistive technology. Explicit labelling works extremely well with all popular assistive technology and is recommended in all but the very simplest of tables.

Use the <LABEL> tag and associated FOR attribute to tag labels. Identify the exact words that you want to use as the label for the form element and enclose those words in a <LABEL> tag. Use the FOR attribute to uniquely identify that element. Use the ID attribute in the associated form element. Every form element supports the ID attribute. By setting this attribute to the identifier used in the FOR attribute of the associated <LABEL> tag, you tie that form element to its associated label. For instance, we have rewritten the HTML code for our simple form-inside-a-table to include explicit labels below. The new HTML code for the explicit labels is indicated in bold:

<FORM>
<TABLE>
<TR>
<TD><LABEL FOR="first"> FIRST NAME:</LABEL> </TD>
<TD><INPUT TYPE="TEXT" NAME="FIRSTNAME" ID="first" ></TD>

Currently all forms should be done in HTML with a link to the general cgi which is set up. Please follow the steps below (DO NOT ADD IN THE 'NOTES' in italic):