Section 17.6. Setting the Tab Index for Links


17.6. Setting the Tab Index for Links

In Chapter 16, you looked briefly at the tab index of page elements, and you learned that the tab index establishes the order in which the elements are selected when the visitor presses the Tab key. This is an important accessibility feature for those who don't or can't browse your web site with a mouse.

BEST BET

Set the tab index for all selectable page elements at the same time, when the page is either finished or almost finished.


It's best to set the tab index for all the selectable page elements at the same time, when the page is either finished or close to being finished, so the information here comes a bit out of sequence. Nevertheless, to set the tab index for a link, click anywhere inside the link on the document window, go to the Tag Selector, choose the <a> tag, and then go to the Attributes panel as shown in Figure 17-28, which is also known as the Tag Inspector. If you don't see the Attributes panel, choose Window Tag Inspector from the main menu.

Figure 17-28. Setting the tab index for a link in the Tag Inspector


Look under the CSS/Accessibility category for the tabindex attribute. Then click in the field to the right of it, and supply its value. Remember from Chapter 16 that the tab-index value determines the order in which the element is selected, so a tab index of 1 makes the link the first element selected when the visitor presses the Tab key, while a tab index of 75 makes it the seventy-fifth element selected.

HOTKEY

Press F9 to toggle the Tag Inspector (also called the Attributes panel).


BEHIND THE SCENES

If you don't specify tab-index values, the browser selects page elements according to the order in which they appear in the HTML code. Likewise for two or more elements that share the same tab-index value.

If you have a tables-based layout, you know from Chapter 4 that the order of the elements on screen doesn't necessarily match their order in the code, so set those tab-index attributes wisely and with pride




Dreamweaver 8 Design and Construction
Dreamweaver 8 Design and Construction (OReilly Digital Studio)
ISBN: 0596101635
EAN: 2147483647
Year: N/A
Pages: 154
Authors: Marc Campbell

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net