Using Custom Labels

The Custom Labels feature is an extremely flexible and versatile way to customize Web pages to suit your individual needs. JAWS allows you to assign custom text labels to almost any HTML element that you can move to by pressing the TAB key. These elements include text links, graphic links, form fields, and buttons. You can also label images on Web pages. JAWS reads these custom labels instead of the identifying text assigned to the elements by the Web page author. JAWS also uses custom labels to identify elements when they appear in lists, such as the list of form fields that displays when you press INSERT+F5.

You can use this feature to customize the elements of any Web page to help you navigate the page, reduce verbosity, compensate for incomplete or poorly labeled elements, and similar functions. Redefine the labels for entire Web forms or applications so the names are more useful and meaningful to you. Customize Web pages so that links and graphics provide more information and help you find what you need right away. The Custom Labels feature provides unmatched flexibility in the way you read Web pages.

NOTE: JAWS saves the labels you assign to a Web page so they are available each time you use that page. In addition, the labels you create are applied to identical elements any time they appear in that page's domain. The domain is usually the first part of the page's Web address. For example, if you assign a label to a button, JAWS reads that label any time you encounter the button on any Web page within that domain. Custom labels are saved in JSI files in the Settings\Enu\PersonalizedSettings folder.

The following exercises demonstrate how you can use custom labels to make Web pages easier to use and more informative.

Labeling an Image Map

The image at the very top of the Customer Response Form depicts three tabs that users can click to navigate to other sections of the site. When JAWS reads this image, it says, "Graphic navigation tabs." This graphic is a special type called an image map. Image maps have one or more areas on them that act like links. Mouse users can click these areas, and JAWS users can press ENTER to activate these links.

EXERCISE: The image map on the sample Customer Response Form is not coded to work well with JAWS. In this exercise, you'll use custom labels to make the image map easier to use:

  1. Open the Customer Response Form sample Web page.
  2. Press CTRL+HOME to move to the top of the page.
  3. Press DOWN ARROW until you hear JAWS announce "image map link tab2." The information provided by the page author is not very helpful in determining what this link actually does.
  4. Press ENTER to activate the link. The message that displays tells you what this link does. On a real Web page, the link would take you to another page without displaying the message. You would have to explore the site more thoroughly to discover what the link actually does.
  5. After reading the message, press ENTER to close this dialog box.

TIP: Normally, if you follow a link to see what it does, you can return to the original page by pressing ALT+LEFT ARROW.

  1. Press INSERT+F2. Select "Custom Label," and press ENTER to assign a custom label to this image map link.
  2. Since this link takes you to the Products page, type "Products" and press ENTER.
  3. Press DOWN ARROW to read the next image map link. This link also doesn't have a good description. Press ENTER to find out what this link does.
  4. After reading the message, press ENTER to close this dialog box.
  5. Next, press INSERT+CTRL+TAB. This keystroke is a shortcut you can use to label an HTML element.
  6. Since this image map link takes you to the Shopping page, type "Shopping," and press ENTER.
  7. Press CTRL+HOME and then begin reading the page again. Notice that JAWS now reads the labels you assigned to the image map links instead of "tab2" and "tab3."

JAWS Tip: JAWS also uses the custom label whenever the element appears in an HTML list. Press INSERT+F7. Notice that the labels you created are used to indicate the image map links in the list instead of "tab2" and "tab3."

Labeling a Text Link

Often times, the actual text of a link will not be very descriptive. You can use custom labels to change the text of a link. Use this feature to shorten wordy links or add more description to short links.

EXERCISE: Follow along with the steps below to see how you can use JAWS to label text links.

  1. Open the Customer Response Form sample Web page.
  2. Press INSERT+F7 to display a list of links on the page. Find the link named "click here." That name isn't very descriptive. Select the link "click here" and choose Move to Link to go to the link's location on the page so you can find out more about it.
  3. Press ALT+NUM PAD 5 to read the sentence this link appears in. From the context of the sentence, you can determine that the link allows you to send e-mail to the Webmaster.
  4. Press INSERT+CTRL+TAB to label this link.
  5. Type "Send the Webmaster e-mail" without the quotes, and then press ENTER.
  6. Press ALT+NUM PAD 5 to read the sentence again. Notice that JAWS reads your label instead of the words "click here."
  7. Press INSERT+F7 again. The entry "click here" that was previously in the list has been replaced by "Send the Webmaster e-mail." Any time you assign a custom label, JAWS displays that label when the element appears in HTML lists.
  8. Press ESC to close the list of links when you are finished.

Labeling Form Fields

You can also assign custom labels to form fields and controls, such as edit boxes, radio buttons, combo boxes, check boxes, and buttons.

EXERCISE: In this exercise you'll assign custom labels to some unlabeled edit fields.

  1. Open the Customer Response Form sample Web page.
  2. Press F to move to the first form field on the page. This form is poorly designed. Most of the fields are labeled incorrectly or aren't labeled at all. Press INSERT+F5 to display a list of form fields. You can see that the majority of fields in this list are unlabeled.
  3. Press E several times to move through the first three edit boxes on the page. JAWS announces the label for the first field as "full name" but the next two edit fields have no label. In reality, the first field should be labeled "first name," the second field should be labeled "middle initial," and the third field should be labeled "last name."
  4. Press SHIFT+E twice to return to the first edit box, and then press INSERT+CTRL+TAB.
  5. Type "First Name" and press ENTER to label this field. Assign meaningful labels to the other two edit boxes using the Custom Label command (INSERT+CTRL+TAB).
  6. Press F until you hear, "Address." Press the TAB key four times and listen to JAWS announce each address-related field. See if you can determine the purpose of each field and then assign each a meaningful custom label.
  7. When you've finished, press X. This command moves you to the first of three check boxes that you can use to indicate your level of customer satisfaction. Each check box is labeled with an image (a happy face, an indifferent face, and an angry face). Though the descriptions you hear for the check boxes are long, they are accurate and coded correctly. These particular descriptions come from the images' ALT text. In this case, the Web author primarily intended to use this ALT text to provide further information to sighted users when they move the mouse pointer over the image.
  8. Use custom labels to shorten these verbose labels. Press INSERT+CTRL+TAB, type "Good," and press ENTER.
  9. Press X to move to the next check box and give it the label "Fair." Then press X again and label the last check box "Poor."
  10. Press E to move to an unlabeled multiline edit box. From the introductory paragraph and the initial text, you can deduce that this area is where you enter your comments. Press INSERT+CTRL+TAB, type "Comments," and press ENTER.
  11. Press INSERT+F5 to review all of the form fields on this page. JAWS displays all the fields using the custom labels you assigned to them. This form should be much easier to fill out now. Go ahead and fill out the form to see how you've used custom labels to greatly enhance its usability.

Sharing Custom Labels

After you assign some custom labels to a page, you can share those labels with other users. Custom labels are saved in JSI files, just like personalized Web settings. To share your custom labels with other JAWS users

  1. From the JAWS application window, press ALT+U to open the Utilities menu and press X to activate the Explore Utilities Folder option.
  2. Navigate to Explore My Settings and press ENTER. A folder opens that contains all of the files you have had JAWS modify or create for you.
  3. Select the folder PersonalizedSettings and press ENTER to open it.
  4. Locate the JSI file with the domain name of the page that contains the custom labels you want to share. For example: "Google.com.jsi."
  5. Copy this file and distribute it to others. Those you share your JSI file with need to copy the JSI file into their user folder on their computer following the steps above. They can now use that HTML page with your custom labels.

Deleting Custom Labels

You can delete specific custom labels at any time, or you can delete all custom labels on a page. To delete an element's label, move to it with standard JAWS reading commands, the TAB key, a Navigation Quick Key, or a JAWS HTML list. Then, press INSERT+F2, select "Custom Label Delete," and press ENTER. JAWS will now read the original identifying text instead of your custom label.

To delete all custom labels on the current page, press INSERT+F2, select "Custom Label Delete All," and press ENTER.