用戶體驗(yàn)設(shè)計(jì)-“跳過導(dǎo)航”鏈接(3)

#skip a:active , #skip a:focus{position:static; width:auto; height:auto;}

HTML結(jié)構(gòu)：

<div id=”skip”><a href=”#content”>skip to man content</a></div>

三、哪種文字描述比較好呢？

有不只一種好的方式來描述這個(gè)鏈接 。以下是比較常用的幾種：

1. 跳過導(dǎo)航
2. 跳過主要導(dǎo)航
3. 跳過導(dǎo)航鏈接
4. 跳到主內(nèi)容區(qū)
5. 跳到內(nèi)容區(qū)

以上任何一種都很好。

四、瀏覽器怪癖

Windows的IE號(hào)稱是最棘手的瀏覽器了。在一些頁面中，“跳過導(dǎo)航”鏈接如預(yù)期的一樣起作用，但是在一些情況中，視線的焦點(diǎn)是改變了，但是輸入焦點(diǎn)并沒有。換句話說，當(dāng)用戶激活了跳過導(dǎo)航鏈接，焦點(diǎn)移到正確的位置，但是當(dāng)用戶再次TAB的時(shí)候，焦點(diǎn)重新回到了初始的位置。當(dāng)這種情況發(fā)生時(shí)，跳過導(dǎo)航的鏈接就完全沒有意義了。

是什么引起了IE下這個(gè)bug呢？事實(shí)證明，IE需要錨點(diǎn)在一個(gè)定義了寬度的元素內(nèi)。寬度可以是絕對(duì)的（如600px）,也可以是相對(duì)的（如100%等），但是寬度必須被定義。這個(gè)寬度可以定義給一個(gè)div，一個(gè)表格單元，span標(biāo)簽或者其他元素。

有時(shí)在一個(gè)特殊的設(shè)計(jì)里，找到一個(gè)可用的寬度單位是很不方便的。但是讓“跳過導(dǎo)航”鏈接起作用是很必要的。事實(shí)上，所有頁面上的每一個(gè)錨點(diǎn)都必須在一個(gè)定義了寬度的元素里，并不只是跳過導(dǎo)航鏈接的錨點(diǎn)。

五、“跳過導(dǎo)航”的替代方法

事實(shí)上，“跳過導(dǎo)航”是一個(gè)非常笨拙的方法。他將一直有效，直到有一種劃分導(dǎo)航和主要內(nèi)容的更標(biāo)準(zhǔn)化的方法出現(xiàn)。然后，還有不止一種方法來達(dá)到跳過導(dǎo)航的效果。

（1）按標(biāo)題導(dǎo)航

最有效的辦法就是創(chuàng)建有合適標(biāo)題的文檔結(jié)構(gòu)，這樣用戶就能在標(biāo)題之間跳轉(zhuǎn)。大部分屏幕閱讀器都允許用戶只聽標(biāo)題，跳過段落、圖片、鏈接和其他