Creating Accessible Forms with Adobe Dreamweaver CS6




An overview of Adobe Dreamweaver CS6

The Adobe Dreamweaver CS6 web design software is an easy-to-use application for building and editing HTML websites and mobile applications. With Adobe Dreamweaver CS6 , web designers are able to create and test cross-platform systems. The websites created using Dreamweaver CS6 can be accessed via a wide range of browsers.
Also, mobile apps with better jQuery and PhoneGap support can be created. The Live View and Multi-screen Preview panels can be used to test the final product. Adobe Dreamweaver CS6 allows designers to save time while uploading large files by using the multi-threaded FTP transfer tool.



Adobe Dreamweaver CS6 offers a comprehensive set of tools for the creation of accessible forms. Several wonderful features provided by Dreamweaver CS6 allow designers to create forms that can be accessed by people with disabilities by providing easy-to-use and easy-to-access form objects. The following paragraphs outline a simple process of creating accessible forms using Adobe Dreamweaver CS6.

Preferences
Dreamweaver’s CS6 Accessibility Preferences feature enables designers to create accessible forms. The feature is enabled by default. The Accessibility Preferences menu is found under the Edit Menu. A shortcut to access this menu is provided by hitting the combination of Control + U. In the dialog box, users are supposed to select the Accessibility category. Once opened, the user needs to select the Form Objects option and click on the OK button.

This activates the Accessibility Preferences, which prompts the user to enter the relevant accessibility information. As the user adds each new text box, he is prompted by the system to provide a label, a tab index and an access key. All the information provided to the prompts enables users with disabilities to navigate around the forms more easily.

Label Creation
Labels are very important in forms as they help with the identification of form objects. With Adobe Dreamweaver CS6, users are able to associate label text with form objects through the use of HTML. This eliminates the confusion often generated when labels are not placed where users expect them to be. Identification of labels within HTML makes it easier for users to interact with the forms using assistive technologies such as screen readers.

Three Label Style options are provided to add and edit the HTML code. The first two techniques provide a similar result while the third option that uses the Attach Label Tag is more flexible. However, the third option requires a certain level of competence with HTML coding.

Setting of The Access Keys
Access keys in forms allow users to easily and quickly access specific objects on forms with keyboard shortcuts. Access keys make it easier for users to navigate around forms. This is a very useful feature for people with mobility problems who may find it hard to press the Tab key many times to access every object on a form. To avoid conflicts, designers need to use non-standard key combinations. In addition, the designers also need to communicate the specified access keys to the users. The common way of communicating this feature is to have the access key letter underlined.


Tab Indexing
The tab index in a form specifies the order in which the form elements are going to be accessed when using the Tab key for navigation. By default, the order of access is determined by the order of the elements in the HTML code. If the desired order of access is different from the visual layout o is just unusual, the designer can set a tab index to create the desired order.


This article was written on behalf of Augmented reality application development firm, Gravity Jack.

Comments