公主的腿间舌奴们np肉_国产在热线精品视频99公交_公主车上荫蒂添的好舒服_公侵犯人妻中文字慕一区二区_公么大龟弄得我好舒服秀_公交车+多人+高cH文章推荐_日本熟妇另类视频在线播放

B端表單設(shè)計(jì)-標(biāo)題樣式細(xì)節(jié)設(shè)計(jì)

2024-5-6 博博

B端系統(tǒng)軟件中表單的應(yīng)用場景非常多，今天就撈點(diǎn)干貨，說說B端產(chǎn)品表單如何設(shè)計(jì)，用戶體驗(yàn)會(huì)更好

從標(biāo)題、輸入框、布局排版、數(shù)據(jù)展示四個(gè)方面，詳細(xì)介紹一下關(guān)于表單的體驗(yàn)設(shè)計(jì)，目錄如下：

1.1 標(biāo)簽是否加冒號(hào)

設(shè)計(jì)師A說：不加冒號(hào)，用戶不在意，而且占空間......

設(shè)計(jì)師B說：要加冒號(hào)，加上可以更好的區(qū)分上下文，以及標(biāo)簽和輸入框的關(guān)系......

以上A/B設(shè)計(jì)師說的都有一定的道理，那到底加不加冒號(hào)呢？

遇到問題咱就先調(diào)研一波，看一下Win、Mac系統(tǒng)中是否有無冒號(hào)

Win系統(tǒng)：最新版本不加冒號(hào)

Mac系統(tǒng)：最新版本設(shè)計(jì)偏向C端化，不加冒號(hào)，13.0.1之前版本有冒號(hào)

是不是感覺主流的設(shè)計(jì)是不加冒號(hào)呀？稍等一下......

那在具體B端系統(tǒng)中是有怎樣的應(yīng)用場景呢？

以上場景中左右布局，單選/多選組件、標(biāo)題加內(nèi)容組件都不適合去掉冒號(hào)展示

那到底加不加冒號(hào)呢？可以先說一下答案，加不加冒號(hào)對(duì)用戶無影響，《Web 表單設(shè)計(jì)·創(chuàng)建高可用性的網(wǎng)頁表單》中，卡羅琳·賈雷特做過大量測試，最終證明沒有一名用戶留意表單冒號(hào)是否出現(xiàn)

因此，得出以下建議：

如果你希望系統(tǒng)重表單使用更多的業(yè)務(wù)場景，和對(duì)齊方式，請(qǐng)使用冒號(hào)
如果你當(dāng)前已使用有冒號(hào)的表單，請(qǐng)保持使用冒號(hào)
如果你新建一個(gè)系統(tǒng)，使不使用冒號(hào)隨意
一旦決定是否使用冒號(hào)，需要全部表單統(tǒng)一規(guī)則

1.2 表單必填樣式

用戶填寫表單時(shí)，有必填項(xiàng)和選填項(xiàng)，如果表單中多數(shù)或全部是必填項(xiàng)，那是否還應(yīng)該對(duì)其標(biāo)記

答案是肯定的，用戶遇到較多表單填寫項(xiàng)時(shí)，是需要通過必填標(biāo)記來評(píng)估工作量。下面就介紹一下具體標(biāo)記必填項(xiàng)的三種樣式

1.2.1 頂部統(tǒng)一提示

填寫表單過長或填寫表單被打斷（移動(dòng)端常見），就會(huì)增加用戶工作記憶，和認(rèn)知負(fù)荷，放完成任務(wù)更加困難，從而降低了用戶體驗(yàn)

1.2.2 文字提示“必填”

有部分設(shè)計(jì)師認(rèn)為紅色星 * 會(huì)增加視覺噪音，并且重復(fù)的紅色星 * 會(huì)帶來一些認(rèn)知恐慌

便采用文字提示方式，但這種方式比較占用空間，文字內(nèi)容過長，用戶壓力較大，用戶體驗(yàn)降低，不建議使用

1.2.3 紅色星號(hào) * 必填提示

雖然有設(shè)計(jì)師認(rèn)為紅色星 * 會(huì)增加視覺噪聲，帶來一些認(rèn)知恐慌，但紅色星 * 在互聯(lián)網(wǎng)中很常見，用戶熟知其意，已形成固定的視覺語言，并空間較小，也能與標(biāo)簽文字足夠區(qū)分開，相比之下采用紅色星 * 必填提示是非常值得推薦使用

但是還有一個(gè)文字，就是紅色星 * 的位置是在字段前還是字段后呢？