Hall of Bright Carvings

All important information for forms, such as form instructions, must be
presented before the form itself. The submit button must be the last form element contained
within a form.

All form fields must be associated with their labels using the label HTML tag.
If a form cannot be labeled, it must include a title that explains in brief what the form
field is.

All forms should clearly indicate which form fields are manditory prior to the
actual form inputs. Avoid cryptic hints such as the use of the asterix or different colors as
the sole means of indicating manditory information requirements.

Form fields that are logically related should be grouped in a field set. If
appropriate, the field set should be labeled with a legend.

<p>Fields marked with an asterisk (*) are required.</p>
<form action="#" method="post">
<fieldset>
<legend>Personal Information</legend>
<div>
<label for="fname">First Name*</label>
<input id="fname" name="firstname" type="text" /></div>
<div>
<label for="lname">Last Name*</label>
<input id="lname" name="lastname" type="text" /></div>
<div>
<label for="street">Street Address*</label>
<input id="street" name="street" type="text" /></div>
<div>
<label for="city">City*</label>
<input id="city" name="city" type="text" /></div>
<div>
<label for="country">Country*</label>
<input id="country" name="country" type="text" /></div>
<div>
<label for="postcode">Postcode*</label>
<input id="postcode" name="postcode" type="text" /></div>
</fieldset>
Would you like to sign up for our newsletter?
<div>
<input id="letteryes" name="newsletter" type="radio" value="yes" />
<label for="letteryes">Yes</label></div>
<div>
<input id="letterno" name="newsletter" type="radio" value="no" />
<label for="letterno">No</label></div>
<div>
<input name="submit" type="submit" value="Submit" /></div>
</form>

<form action="#">
<fieldset>
<legend>Login</legend>
<div>
<label for="username">Username</label>
<input type="text" id="username" name="username" />
</div>
<div>
<label for="password">Password</label>
<input type="password" id="password" name="password"  />
</div>
<div>
<input id="Submit" name="Submit" value="Submit" type="submit">
</div>
</fieldset>
</form>

<form action="#">
<div>
<input type="text" name="term" title="Search term" />
<input id="search" name="search" value="Search" type="submit">
</div>
</form>