狠色狠色狠狠色综合久久,国产第一页浮力影院入口,刺激性视频黄页,日本强伦片中文字幕免费看黄色综合,91.cn国产大片,亚洲日韩视频在线观看

向左走、向右走？表單元素設(shè)計大揭密

2014-3-3 藍(lán)藍(lán)設(shè)計的小編

轉(zhuǎn)載藍(lán)藍(lán)設(shè)計( www.jghy.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供有效的 BS界面設(shè)計、 cs界面設(shè)計、 ipad界面設(shè)計、包裝設(shè)計、圖標(biāo)定制、用戶體驗、交互設(shè)計、網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

來源：http://www.uisdc.com/100-things-you-should-know-about-design

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中，請點這里　

表單的界面設(shè)計是由許多細(xì)小的元素所組合而成的集合體，標(biāo)題和輸入框的排列方式有著重要的地位，標(biāo)題要放在輸入框的左側(cè)還是上面？要靠左還是靠右？要怎么排列才能提高表單的完成率呢？藍(lán)藍(lán)設(shè)計表單元素ui設(shè)計大揭密!

標(biāo)題和輸入框常見的排列方式

1. 放在輸入框左邊，而且靠左對齊

2. 放在輸入框左邊，但是靠右對齊

3. 放在輸入框上面

4. 放在輸入框里面

排列方式的比較

到底這四種排列方式有什么不一樣呢？其實這些排列組合最大的影響都在于用戶視線的移動，在第一種排列方式中，用戶的視線先看到標(biāo)題，由于靠左對齊的緣故，我們可以看到表單的左側(cè)有著很整齊的虛擬標(biāo)線，用戶的視線會跟隨著這條虛擬路徑前進(jìn)，他們會舒服的看完所有的標(biāo)題，大概的這張表單要求用戶輸入什么數(shù)據(jù)。

但是由于標(biāo)題靠左的關(guān)系，標(biāo)題和輸入框之間的關(guān)系就不是這么明顯，距離也不固定，使用者要來回在標(biāo)題－輸入框之間呈現(xiàn)Ｚ型的瀏覽路徑，所以對用戶而言輸入上會稍微產(chǎn)生一點障礙，當(dāng)然也就增加了完成表單的時間。

第二種排列方式可以減少上面所提到的困擾，因為標(biāo)題靠右對齊，標(biāo)題和輸入框之間的關(guān)系既清楚又明顯，Ｚ型路徑變短了，輸入數(shù)據(jù)就會比較輕松。但是由于左側(cè)的虛擬標(biāo)線也變得崎嶇，用戶對于整個表單的概念就會稍微減低，但還不致于造成障礙。

第三種排列方式是直接把標(biāo)題放在輸入框上面，這個方式完全消除了讓人感到煩躁的Ｚ型路徑，從頭到尾可以較為流暢的閱讀與完成表單，左側(cè)的虛擬標(biāo)線也很整齊，所以使用者的輸入時間也比較短。唯一的缺點是表單看起來變長了，讓使用者心理上感覺好像會花最多時間。

最后一種方式最常出現(xiàn)在注冊或登入的表單上面，把標(biāo)題直接和輸入框結(jié)合，當(dāng)使用者開始輸入的時候，在輸入框里的標(biāo)題便慢慢淡出。視覺動線流暢、垂直高度短、也很容易快速瀏覽表單要求的項目。這個方式最大的缺點大概就是當(dāng)用戶開始輸入數(shù)據(jù)的時候，標(biāo)題就消失了，偶爾會讓使用者產(chǎn)生混淆。