接低成本提高web可用性的幾個細節(一)

5、注釋性文案要盡量簡短

注釋性或是情景提示的文案一定要在表達準確意思的前提下簡短，不需要修飾性的形容詞，建議大家仔細學習好中文，很多朋友知道要簡短，但為了簡短，把要傳達的意思破壞了，甚至有了歧義。
舉例，見圖1
修改之前，文字冗余。

修改之后，清晰明確。

(圖1)
K3定律之一：把頁面中的文字去掉一半，把剩下的文字再去掉一半。

6、用好alt和title

簡單直白的說：
alt適用于圖片，在瀏覽器中鼠標懸停在圖片上時有輔助的文字注釋或說明，用在img標簽中
例如：把鼠標懸停在圖片上

title適用于帶有鏈接的文字，在瀏覽器中鼠標懸停在鏈接文字時有文字注釋或說明
例如：把鼠標懸停在鏈接上
www.myzdnet.com.cn

其實這兩個html語法中的屬性，大多數人都知道，但很多網站沒有把這兩個屬性用好。
例如一些按鈕，為了設計美觀，在按鈕的圖片中只會寫上一個關鍵的動詞，例如：Search或Go
但在一些場景中，可能這個按鈕不足以十分清楚告知用戶它的作用，所以使用alt值做為注釋就可以提高可訪問性。另外，在網絡不好或是服務器問題而導致圖片無法打開時，alt值也起到的非常關鍵的作用。如下圖2

(圖2)
再例如一些文章標題因為頁面設計整齊的限制，而僅顯示了短標題或是做了截取，但這樣的標題往往不能很準確的表達意思甚至讓人看不懂，這時候如果用了title屬性就可以很好的解決這個問題，見圖3

(圖3)
關于alt和title的更多技巧，請參閱千鳥的兩篇文章：《使用Alt提升可訪問性》《使用Title提升可訪問性》

7、超過1秒鐘的等待要有進度顯示

在現實中，我們都有過體驗，如果去銀行排隊，漫長的時間中，如果玩兒著手機，或是看等候區提供的雜志可能會好過一些。
在web中用的比較早比較普遍的等待進度狀態是上傳，比如我們用web中的郵箱上傳附件或是在視頻分享網站上傳視頻，這些進度條往往都是由程序判斷，可以給出預測性的完成時間或是完成的百分比，讓用戶有一種“期待感”，見圖4，這些已經成為“web產品標準”的地方，大多數網站做的已經都不錯。

(圖4)
但存在一些頁面中的交互，需要等待的時間遠遠沒有上傳一個文件那么長時間，但這種等待又不能控制在非常短的時間內(通常在1秒以內用戶可以忍受)。即便這種“不長不短”的時間，如果完全讓頁面處于空白的等待狀態，哪怕只是2秒鐘，對用戶來講，可能會以為網站出了問題頁離開。
比如一些標簽頁的切換會向服務器提交請求，比如一些檢索器的查詢結果需要查詢數據庫
而這些看似很短暫的等待，如果沒有任何提示，會讓很多用戶離開。
例如，在新版的首頁中有一個切換各地報價的模塊，網速好的情況下，切換城市只需要1秒鐘左右的時間。如果沒有加任何切換時的等待提示，切換城市時，這個模塊就會空白一片，帶給用戶的體驗就非常不好。
如果我們加上一個gif動畫和一行文案描述，用戶從心理上在這1秒鐘里就不會有一種“空白”的等待感，而且會很有耐心。如圖5

(圖5)
而且這種等待進度提示的成本非常低，只需要一個gif動畫圖片就可以解決。