How to Use Dreamweaver to Make Form Labels

Web page form labels are an essential element of the form. They identify for the user what should be inputted or checked in order to complete the form. For Dreamweaver users there are helpful tricks for adding labels to form elements in the best way. Here are several.

Difficulty: Moderately Easy

Instructions

Things You'll Need:

• Adobe Dreamweaver software

1. Make sure that your Dreamweaver preferences are set to always include accessibility features for images, media and form objects.

2. 
   Dreamweaver Preferences

   In the Dreamweaver Preferences category for Accessibility, make sure each checkbox is selected. If you have Dreamweaver CS4, the accessibility options are selected by default. In older versions of Dreamweaver you must select them manually.

3. On the Dreamweaver page where you are creating the form, the actions to create a label take place when you add a form element to a page.

4. 
   Complete the Dialog

   When adding an input tag to the page you will see the Input Tag Accessibility Attributes dialog. The selections you make here are critical. Enter an ID. The ID should be a short and helpful to you, but it won't be seen by the user. Enter a label. The label will be seen by the user and should tell the user what to enter in the input field.

5. Select "Attach label tag using 'for' attribute." This is essential. The "for" attribute is what makes the form accessible by creating a connection in the web page code between the label and the form field.

6. For an input field it's best to put the label before an item. For radio buttons and checkboxes it makes more sense to put the label after the form element.

7. I suggest you leave the access key and tab index fields blank. These are no longer considered best practice to use with accessible form creation.