Working with accessible forms
This site details how to approach web forms designed using the 2007 University of Melbourne web templates when browsing with the aid of a screen reader (such as JAWS). It aims to demystify some of the common elements and constructs used by the University in collecting information to allow greater autonomy in navigating the virtual University.
There is also a section for web maintainers who would like to learn more about constructing an accessible web form.
Form elements
Forms consist of a small set of input elements. You can take a tour through each of these elements and practise submitting form data. In each case you will be given a short explanation of common usage and will be given feedback on what you selected.
- Radio options
- Checkbox options
- Drop down menu (single select)
- Drop down menus (multiple select)
- Text input (edit)
- Textarea input
- Uploading files
Required fields
Some forms will use JavaScript to check that you've filled in the required fields. The following examples use the same script so that you can attempt forms that have required fields. Note that you cannot submit such a form until the required field has the correct type of entry. There will be a link at the end of the form to let you know what fields remain incomplete. Once there is something in all the required fields that link disappears and the submit button becomes active.
- Radio options
- Checkbox options
- Drop down menu (single select)
- Drop down menus (multiple select)
- Text input (edit)
- Textarea input
- Uploading files
Putting it all together
Below is a sample form that includes all the elements mentioned above in a single form. Have a go at entering some data. As with the previous examples you will receive feedback on what you answered. No data will be collected by the server. Note that there is a mixture of required and non-required fields.