|
標簽水平右對齊
標簽右對齊和輸入?yún)^(qū)水平排列，從而降低了對頁面高度的要求。但與標簽垂直頂對齊相比，由于標簽文字左側參差不齊，對問題的認知和掃描時間變的更長。
眼動軌跡表明，用戶花了更多時間在看問題，輸入框對他們來說很簡單。
標簽水平左對齊
標簽左對齊和輸入?yún)^(qū)水平排列，同樣降低了對頁面高度的要求。標簽左對齊有利于用戶對問題標簽的掃描，但不利于填寫答案，因為標簽距離輸入?yún)^(qū)較遠，要重新定位到右側輸入框，確實要消耗一點時間。
眼動軌跡表明，用戶花在定位輸入?yún)^(qū)上的時間比看清標簽更長，從而影響了整個表單的完成時間。
標簽在輸入?yún)^(qū)內部
這種方式雖然具備垂直組合的優(yōu)點，但仍應謹慎使用。當焦點移入輸入?yún)^(qū)后，標簽消失，看不到問題，可能會忘記要回答什么，很郁悶，不得不清掉輸入好的字，把“問題”還原出來。這種組合比較適合只有一兩個輸入框的簡短表單，而且人們對他很熟悉，不用費力去記住標簽提出的問題，比如：搜索框。
當你真的選擇用這種表單的時候，注意，讓標簽和真實內容區(qū)分開來，一些約定俗成的做法是減淡標簽字色，在后面打上“…”；下拉菜單則在默認選項兩側打上“-”，以示區(qū)別：
設計要有一條主線，貫穿于整個產(chǎn)品，別讓人用著感覺像是幾個設計師干的事。認真思考一遍，就會有新一層的理解，這對我的工作有極大的幫助。
原文：http://blog.b3inside.com/userexperience/label-and-input-in-form-design/
本文鏈接：http://m.95time.cn/design/doc/2009/6659.asp 
出處：b3inside.com
責任編輯：bluehearts
上一頁 設計表單的標簽和輸入?yún)^(qū) [1] 下一頁
|
第 1 頁 
第 2 頁 設計表單的標簽和輸入?yún)^(qū) [2]
