《Web表單設計:創建高可用性的網頁表單》是2011 年2月人民郵電出版社出版的圖書,作者是(英)Caroline Jarret (澳)Gerry Gaffney
基本介紹
- 書名:Web表單設計:創建高可用性的網頁表單
- 作者:(英)Caroline Jarret (澳)Gerry Gaffney
- 原版名稱:Forms that Work: Designing Web Forms for Usability
- 譯者:董淑楨
基本信息,內容簡介,序言,目錄,前言 什麼是表單,第一部分 關 系,第二部分 對 話,第三部分 外 觀,第四部分 測 試,
基本信息
叢書名: 圖靈互動設計叢書
出版社:人民郵電出版社
ISBN:9787115246684
上架時間:2011-1-30
出版日期:2011 年2月
開本:16
頁碼:1
版次:1-1
內容簡介
本書通過大量實例介紹了創建高可用性網頁表單的經驗和技巧。書中從表單的關係、對話和外觀三層模型入手,全面介紹了創建高質量表單的整個流程,並著重強調了可用性測試這一重要內容。本書是專注於網頁表單設計的一本新作,其中大量實用的方法能夠為現實工作中的設計決策提供建設性的意見,並最終幫助你設計出完美的表單。
本書適合各類對網頁設計特別是對表單設計感興趣的讀者,無論你是ui 設計師、可用性專家,還是信息架構師,亦或是產品經理,都將獲益於書中介紹的實用知識和技巧。
序言
全球資訊網源自多年前創作於瑞士的研究論文,這些最初的論文從原始狀態混沌的概念泥沼中掙脫出來,並最終促成了全球資訊網的誕生。
位於世界各地大學地下室工作的人們都能夠以唯讀的方式閱讀到從另一所大學地下室中發表的論文。
此後的一天,有人突然萌生出這樣的念頭:“等等,為什麼閱讀這些論文的人們不能也向我們傳送信息呢?”由此誕生。
儘管當時並沒有人意識到電子商務的誕生有可能會對人類生活產生巨大的影響,但是卻沒有人能阻擋其前進的腳步。究其原因,正如Caroline和Gerry在這本書中解釋到的那樣,表單讓網頁發布者和網頁使用者之間的對話成為了可能。表單不僅強大,還是一個有用的概念構想,因此今天幾乎沒有一個網站不使用它,有的網站甚至使用了多個表單。
由於我們早已對日常生活中的表單習以為常1,因此相當清楚設計糟糕的表單是那些:
所提問題讓人不知如何作答的表單;
所提問題要求多項選擇,但卻沒有提供所需答案的表單;
要求填寫過多信息,或詢問涉及答題者隱私信息的表單;
含有大量語義不明說明文字的表單。
……等等等等。
在日常的談話中,我們可以通過提問和語義解釋來化解這些迷惑(如“你所指的意思是我最近的平均收入,還是我一輩子的收入?”“你是問我有多少孩子,還是有多少孩子在家中居住?”)但由於表單遵循的模式是:出題者告知表單所需的提問方式,表單精確地以這種方式向答題者提問,因此一個考慮周到的表單設計必須意思表達足夠清楚,而且完全無需加以說明。這也是本書所要闡述的主題。
依我們中一些人這樣的年紀,應該記得多聯複寫紙表單,它的說明文字中寫到:“請用力書寫,你將同時複製7份副本。”
我與CarolineJarrett已相識多年,在這場喧鬧的可用性研究大討論中,她一直是我最欣賞的一名可用性專家。2這並非單純意味著我個人對她的喜好(儘管我們會在這裡說她的確是個好人),而在於她是少數我始終願意聽從其可用性研究方面意見的專家。
一直以來我都認為她是一名專業的網頁表單專家——她可以就是否在標籤末端加上冒號,以及如何讓它更具吸引力談論上一個小時(儘管她始終堅稱事實並非如此,除非人們喜歡像她這樣沉迷於研究表單的人)。
但是本書並不僅限於談論冒號和如何選擇正確小工具等問題,其中詳細介紹了創建優質表單的整個流程,這遠比局限地談論是選擇使用下拉列表還是單選按鈕更具深度,它關注於如何以用戶能夠接受的方式提出正確的問題。
讀Caroline和Gerry所寫的這本書就如同與Caroline進行了一番直指問題核心的對話。本書分享了大量可套用於實戰的建議和實踐經驗,並且給出了能滿足你工作所需,全面且準確的建議。
我是非常幸運的。當我對表單心存疑惑的時候,可以和Caroline通過Skype線上交流,或者直接給她傳送一封諮詢郵件。而現在的你幾乎也和我同樣幸運:得到了在碰到表單設計問題時最好的速查手冊。
SteveKrug
於麻薩諸塞州,布魯克林
媒體評
讀Caroline和Gerry合著的這本書就如同與他們進行了一番推心置腹的對話。本書分享了大量實踐經驗,並且給出了能滿足你工作所需的、全面且準確的建議。
——暢銷書《點石成金:訪客至上的網頁設計秘笈》作者Steve Krug
遵循Jarrett和Gaffney的準則有可能讓你的線上利潤翻番。
——Web易用性大師,Nielsen Norman 集團負責人Jakob Nielsen
本書值得網頁設計人員一讀,它用簡明的語言和易讀的形式列舉了大量實例,展現了Caroline和Gerry的表單三層模型——關係、對話和外觀。表單要做好,這三個層次缺一不可。兼顧美觀、順暢,以恰當的方式提出合適的問題,當然最重要的是讓人們完成表單。
——《勝於言傳:網站內容制勝寶典》作者Ginny Redish
目錄
第 0章
前言 什麼是表單
0.1 表單牽動你和我 1
0.1.1 糟糕的表單後果很嚴重 1
0.1.2 優良的表單眾人皆歡喜 2
0.2 煮酒論表單 3
0.2.1 只談設計不談技術 3
0.2.2 只談網頁不談紙質表單 4
0.2.3 可用性:讓表單更好用 4
0.2.4 制表流程:試試你就知道 4
0.3 一些定義,兩種流程 4
0.3.1 表單,一看便知 4
0.3.2 三個層次:關係、對話和外觀 5
0.3.3 一個混亂而典型的表單設計流程 6
0.3.4 系統化設計流程 7
第一部分 關 系
第1 章 說服人們回答問題 11
1.1 理解用戶才能設計出好表單 11
1.1.1 人們對表單做出何種應答 11
1.1.2 讀者、匆忙填寫者和拒絕者 14
.1.1.3 選擇恰當的提問時機 15
1.1.4 關係隨問題變化 16
1.2 影響反饋率的三條法則 18
1.2.1 規則1:建立信任 18
1.2.2 規則2:降低社交損失 19
1.2.3 規則3:增加獎勵 19
1.2.4 一份小獎勵:在必要時為用戶提供表單 20
1.3 表單應該有多長 22
1.4 誰來回答問題 23
1.4.1 考慮身體差異 23
1.4.2 通過提問了解用戶 24
1.4.3 了解用戶如何理解表單 24
1.4.4 你是否足夠了解自己的用戶 25
1.4.5 通過創建人物角色,反映用戶的現實情況 26
1.5 小結 27
小插曲 註冊表單:如果不可避免應當如何應對 28
第2 章 獲得正確的信息 31
2.1 為什麼要收集信息 31
2.1.1 詢問利益相關者 32
2.1.2 詢問使用信息的人 34
2.1.3 運用問題協定研究信息使用方式 34
2.2 表單發布機構是否已經持有信息 35
2.2.1 使用表單發布機構已經持有的信息 35
2.2.2 避免重複 36
2.3 了解別人的問題 37
2.3.1 如果沒有競爭對手該怎么做 37
2.3.2 一個觀察競爭對手的示例 38
2.4 小結:獲得正確的信息 38
案例分析 會議預定表:問題協定樣本 39
第二部分 對 話
第3 章 提出容易回答的問題 45
3.1 要保證交流順暢 45
3.2 問題要容易理解 47
3.2.1 用常見辭彙提問 47
3.2.2 一次只問一個問題 49
3.2.3 將否定的問題轉換為肯定的問題 50
3.2.4 謹慎的分組方式有助於明確含義 51
3.2.5 不要加入決策點 52
3.2.6 要知道文化差異 53
3.3 讓人容易找到答案 54
3.3.1 插入式答案 54
3.3.2 蒐集式答案 55
3.3.3 第三方答案 55
3.3.4 創造式答案 56
3.3.5 回答策略不匹配將產生問題 56
3.3.6 了解用戶將在何處獲取答案 58
3.3.7 清楚誰擁有你需要的數據 58
3.3.8 幫助用戶找到答案 59
3.3.9 標籤內容要符合用戶獲取答案的方式 61
3.4 讓答案容易判斷 61
3.5 讓表單答案容易填寫 63
3.6 小結:提出容易回答的問題 65
第4 章 說明文字 67
4.1 撰寫實用的說明文字 67
4.2 5 條簡明語言法則 68
4.2.1 法則1:以常見的方式使用常見辭彙 68
4.2.2 法則2:使用簡短、肯定、主動語態的句子 70
4.2.3 法則3:推翻文字的圍牆 70
4.2.4 法則4:先選擇,後行動 71
4.2.5 法則5:使用有幫助的標題 73
4.3 刪繁就簡 75
4.4 放置適當 75
4.4.1 貼切的標題 76
4.4.2 提前告知需要蒐集哪些信息 76
4.4.3 將用戶引導至不同的表單 78
4.4.4 用問題替代說明文字 78
4.5 一個“前後對照”的例子 79
4.6 小結:說明文字 80
小插曲 提供幫助 81
第5 章 選擇表單控制項 85
5.1 選擇恰當的控制項 85
5.2 符合用戶對控制項工作方式的預期 86
5.2.1 鍵入比選擇更自然嗎 87
5.2.2 答案很容易輸錯嗎 88
5.2.3 有多少選項 89
5.2.4 是否允許用戶做多重選擇 90
5.2.5 選項是否在視覺上突出 91
5.2.6 用戶理解問題是否需要參看選項 92
5.3 清晰地描述選項 92
5.4 合理的順序 93
5.5 慎用專門控制項 93
5.5.1 日曆有助於顯示相對日期 94
5.5.2 地圖有助於顯示地理信息 94
5.6 小結:選擇表單控制項 95
第6 章 填表過程一氣呵成 97
6.1 讓表單填寫過程連貫流暢 97
6.2 按話題分解長表單 97
6.2.1 壓縮欄位(較少採用) 97
6.2.2 按話題分成多頁表單(更好的方法) 98
6.2.3 每次只提一個話題 98
6.2.4 先提符合預期的問題,後提意料之外的問題 99
6.2.5 少提突兀的問題 100
6.2.6 解釋多次出現的問題之間有何差異 100
6.3 使用進度指示器 102
6.4 勿因突變而讓用戶感到意外 105
6.4.1 避免不通知就改變頁面 105
6.4.2 按照用戶的要求改變頁面 106
6.4.3 基於早期輸入的信息創建自定義表單 106
6.4.4 不要將標籤用作表單的導航方式 107
6.5 善待錯誤 108
6.5.1 驗證有時可以提供幫助 108
6.5.2 儘早驗證 109
6.6 結束對話時說“謝謝” 111
6.7 小結:填表過程一氣呵成 111
小插曲 和彈出視窗說再見 113
第三部分 外 觀
第7 章 關注細節 117
7.1 外觀的細節 117
7.2 標籤位置應當容易看到 118
7.2.1 眼動跟蹤表明用戶的視線集中在欄位和標籤上 119
7.2.2 用戶會注意到位於欄位上方和左側的標籤 120
7.2.3 用戶只會查看覺得與欄位相關的標籤 120
7.2.4 把標籤放在欄位上方有時奏效 121
7.2.5 右對齊插入式答案的欄位標籤更有效 121
7.2.6 其他答案類型的欄位慎用右對齊標籤 122
7.2.7 詢問個人資料的表單應左對齊標籤 122
7.2.8 拿不準時最好左對齊標籤 123
7.2.9 特殊考量因素:標籤翻譯 123
7.2.10 確保每個標籤都與對應欄位密切相關 124
7.3 標籤末尾要加冒號嗎 126
7.4 標籤應該句子首字母大寫還是標題首字母大寫 127
7.5 標記必填欄位 128
7.5.1 標記必填欄位;若要標記不強制要求的欄位,則用“(可選)”標識 128
7.5.2 說明選用的標記符 129
7.5.3 示例:必填欄位的困惑 129
7.6 選擇易讀的文本:字型和辭彙 130
7.6.1 選用具有良好色彩對比度的大號字型 130
7.6.2 版式不宜多變 132
7.6.3 套用空白讓段落更容易閱讀 133
7.7 小結:關注細節 134
小插曲 用襯線字型還是無襯線字型 135
第8 章 構造簡約的表單外觀 137
8.1 令表單外形美觀的關鍵因素 137
8.2 用戶知道你是誰嗎? logo 和品牌風格 138
8.2.1 品牌信息過少妨礙建立信任 139
8.2.2 品牌風格元素應保持適量 140
8.2.3 謹慎配色 141
8.2.4 在標籤、欄位和按鈕上套用少量品牌風格 143
8.2.5 用戶何時會注意品牌風格 144
8.2.6 切勿改變用戶的瀏覽器 145
8.3 格線:讓表單整潔有序 146
8.3.1 對齊幾根垂直的粗格線線 147
8.3.2 創建新格線線,而不是遷就現有的格線線 149
8.4 分組:讓表單條理清晰 150
8.4.1 位置是表示分組最簡單明了的方式 151
8.4.2 過多的線條會破壞分組 152
8.4.3 切勿改變樣式 153
8.4.4 切勿在分組標識圖案中掩藏文字內容 154
8.5 避免兩欄表單 156
8.6 小結:構造簡約的表單外觀 159
案例分析 徹底改變外觀 160
第四部分 測 試
第9 章 測試 165
9.1 我們熱愛可用性測試 165
9.1.1 可用性測試方便快捷、立竿見影 165
9.1.2 我們如何對表單做專家評審 166
9.2 如何進行可用性測試 166
9.2.1 測試更多用戶(通常5 位就夠了) 166
9.2.2 設法找到“真實的”用戶 167
9.2.3 測試參與者與目標用戶有何差異 167
9.2.4 思考用戶將在哪裡找到答案 167
9.2.5 了解測試參與者的想法 168
9.3 最後的話 169
延伸閱讀 171
參考文獻 179