Forms and Web Accessibility
There are two main ways to make sure electronic forms are accessible. But remember that you only need to make sure your forms are accessible if your department or program is federally funded. The easiest way is to keep the form element next to it's associated text, without separating it into different table cells. The other way is to use label tag and id attribute form relationships between form elements and their associated text.
1. Simplify your Form
The easiest way to create an accessible form is by keeping the form element next to it's associated text
Example:
View HTML Code:
<form name="form1"> <p>First Name <input type="TEXT" name="FNAME"> <br> Last Name <input type="TEXT" name="LNAME"> <br> <INPUT name="SUBMIT" TYPE="SUBMIT" VALUE="SUBMIT"> </p> </form>
2. Using the Label tag and ID attribute
If you need to separate the form elements from their assossiated text, you can use the label tag and the id attribute to allow non-visual text browsers to associte them.
Example of form with form fields and labels separated in different table cells:
View HTML Code
<form>
<table>
<tr>
<td>
<label for="first">First Name:</label>
</td>
<td>
<input type="text" name="firstname" id="first">
</td>
</tr>
<tr>
<td>
<label for="last">Last Name:</label>
</td>
<td>
<input type="text" name="lastname" id="last"></td>
</tr>
<tr>
<td> </td>
<td>
<input name="submit" type="submit" value="submit">
</td>
</tr>
</table>
</form>