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:
- Open the Customer Response Form sample Web page.
- Press CTRL+INSERT+G, select "Navigation tabs," and press
ENTER to move to the navigation tab image.
- Press DOWN ARROW to read the first image map link. The information
provided by the page author is not very helpful in determining what this link
actually does.
- 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.
- 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.
- Press INSERT+F2. Select "Custom Label," and press ENTER
to assign a custom label to this image map link.
- Since this link takes you to the Products page, type "Products"
and press ENTER.
- 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.
- After reading the message, press ENTER to close this dialog box.
- Next, press INSERT+CTRL+TAB. This keystroke is a shortcut you can use to label an HTML element.
- Since this image map link takes you to the Shopping page, type "Shop,"
and press ENTER.
- 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 your 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.
- Open the Customer Response Form sample Web page.
- Press INSERT+F7 to display a list of links on the page. Find the
link named "Here." That name isn't very descriptive. Select the
link "Here" and choose Move to Link to go to the link's location
on the page so you can find out more about it.
- 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.
- Press INSERT+CTRL+TAB to label this link.
- Type "Send WebMaster e-mail" and press ENTER.
- Press ALT+NUM PAD 5 to read the sentence again. Notice that JAWS
reads your label instead of the word "here."
- Press INSERT+F7 again. The entry "Here" that was previously
in the list has been replaced by "Send WebMaster e-mail." Any time
you assign a custom label, JAWS displays that label when the element appears
in HTML lists.
- 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.
- Open the Customer Response Form sample Web page.
- 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.
- 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.
- Press SHIFT+E twice to return to the first edit box, and then press INSERT+CTRL+TAB.
- 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).
- 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.
- 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.
- Use custom labels to shorten these verbose labels. Press INSERT+CTRL+TAB,
type "Good," and press ENTER.
- 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."
- 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.
- 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. You can use Settings Packager to export your labels to other JAWS
users or import another user's custom labels. For more information, read the lesson on Settings
Packager later in Surf's Up.
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.