How to make an accessible form
Along with tables, web forms are probably the most abused when it comes to accessibility. There are several checkpoints that relate to forms that you should be aware of and try to mitigate. The easiest one to implement, and most often ignored is associating the instructions or label of a form element with the element itself.
Because not all technologies properly associate labels with elements, it's ideal to create a form that places the label or instruction directly next to the element itself. Consider the following... Code:
Username: <input type='text' name='username' /> Code:
<label for="username">Username</label>: <input type="text" name="username" id="username" /> By keeping your labels next to your form elements, you will go a long way towards providing an accessible form. If you're using tables for your layout, make sure to use the label tag, to at least create some association between elements and lables. After all, if I had the following code, would you know what is what by the code only? Code:
<table> Admin |
Very good description. The only thing I would add regarding the sample code you supplied is that it is a good idea not to structure the form in a table, unless the table itself would be considered a data table. These days the trend is using CSS.
Tom |
All times are GMT. The time now is 07:08 AM. |
Powered by vBulletin® Version 3.0.1
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.