編者按：在進(jìn)行 UI 設(shè)計(jì)的時(shí)候，很多小技巧能夠恰到好處地提升界面的設(shè)計(jì)視覺(jué)效果、用戶體驗(yàn)。這篇來(lái)自Marc Andrew 的文章梳理了 6 個(gè)實(shí)用性很強(qiáng)的 UI 效果提升小技巧，是系列文章的十三篇，原文最早發(fā)布于 marcandrew.me 。

在創(chuàng)建實(shí)用、可訪問(wèn)性良好且視覺(jué)效果頗為出彩的 UI 界面的時(shí)候，我們大多只需要進(jìn)行有限度的微調(diào)，即可達(dá)到頗為不錯(cuò)的效果。在之前，我已經(jīng)撰寫(xiě)了很多實(shí)用的 UI & UX 優(yōu)化小貼士（看完文章在文末獲?。?，這篇文章繼續(xù)增加 6 條實(shí)用的建議。如果你對(duì)于這個(gè)系列感興趣，上一期的內(nèi)容也值得看看：

下面，一起來(lái)看看最新的 6 項(xiàng)設(shè)計(jì)技巧吧！

1、用頁(yè)內(nèi)鏈接讓用戶盡快獲取信息

頁(yè)面內(nèi)鏈接，或者頁(yè)內(nèi)導(dǎo)航，在過(guò)去曾經(jīng)一度被很多設(shè)計(jì)師所抵制，但是如果在對(duì)的地方使用，實(shí)際上對(duì)于整個(gè)頁(yè)面的體驗(yàn)是有明顯加成的。最典型的，就是在較長(zhǎng)頁(yè)面當(dāng)中，頁(yè)面內(nèi)跳轉(zhuǎn)鏈接能夠幫助用戶更好地導(dǎo)航。

當(dāng)用戶打開(kāi)一篇較長(zhǎng)的文章的時(shí)候，文章通常會(huì)被劃分為多個(gè)不同的部分，不同的章節(jié)，這個(gè)時(shí)候頁(yè)內(nèi)鏈接本質(zhì)上就是某種意義上的導(dǎo)航，幫助用戶快速定位到他們需要的位置，無(wú)需進(jìn)行無(wú)休止的滾動(dòng)，迅速確定自己的興趣點(diǎn)，點(diǎn)擊，精準(zhǔn)降落。

使用得當(dāng)，頁(yè)內(nèi)鏈接會(huì)大大提高頁(yè)面內(nèi)容的可發(fā)現(xiàn)性和內(nèi)容的參與度。

2、讓按鈕文本指向性保持一致清晰

按鈕上的文案內(nèi)容是非常重要的。用戶打開(kāi)一個(gè)頁(yè)面，當(dāng)他面對(duì)一個(gè) CTA 按鈕的時(shí)候，他需要知道當(dāng)他點(diǎn)擊這個(gè)按鈕之后，會(huì)發(fā)生什么，去到什么地方，起碼他應(yīng)該知道這個(gè)按鈕所指向的行為和方向是什么，這也對(duì)按鈕的標(biāo)簽文案提出了要求。

我經(jīng)常看到網(wǎng)站和 APP 當(dāng)中的文案使用模糊或者整體的語(yǔ)言風(fēng)格不夠一致。比如有的地方文案是「Lets do this（就這么干吧）」，有的地方則是「Join Now（現(xiàn)在加入）」，類似功能的標(biāo)簽，卻使用了截然不同風(fēng)格的文案，這種情況可能會(huì)增加用戶的認(rèn)知負(fù)荷，還會(huì)讓用戶對(duì)產(chǎn)品產(chǎn)生懷疑。

3、自動(dòng)填寫(xiě)重復(fù)表單字段幫用戶節(jié)省精力

有些表格可能會(huì)很長(zhǎng)，尤其在是在電商和各種涉及專業(yè)服務(wù)的網(wǎng)站上，需要非常具體而準(zhǔn)確地填寫(xiě)各種表單。

為用戶簡(jiǎn)化冗余的表單項(xiàng)目是非常有必要的。比如需要用戶填寫(xiě)送貨地址這種字段，可能需要多次填寫(xiě)，這種字段需要花費(fèi)較長(zhǎng)時(shí)間來(lái)完成，而且可以確定的是，這幾個(gè)地方是完全一樣的。這個(gè)時(shí)候，系統(tǒng)應(yīng)當(dāng)提供自動(dòng)填寫(xiě)功能來(lái)幫助用戶節(jié)省精力。

不過(guò)值得一提的是，在注冊(cè)表單當(dāng)中，有時(shí)候需要用戶重復(fù)填寫(xiě)密碼，這個(gè)環(huán)節(jié)是出于確認(rèn)密碼正確性而設(shè)置的，不應(yīng)該在這個(gè)地方幫用戶「偷懶」。

4、將字段名稱放在較長(zhǎng)表單的輸入框上方

對(duì)于較短的表單，我們將每個(gè)字段的名稱放在填寫(xiě)表格的左側(cè)倒是影響不大，用戶在填寫(xiě)的時(shí)候視線會(huì)使用Z字型來(lái)回折返，由于內(nèi)容量較少，在體驗(yàn)上不會(huì)讓人感到疲憊。但是在較長(zhǎng)的表單當(dāng)中，情況就不一樣了。

由于用戶需要持續(xù)地填寫(xiě)內(nèi)容，使用Z字型掃讀會(huì)非常疲憊，這個(gè)時(shí)候，需要將字段名稱移到表格的上方，這樣用戶可以使用F式的掃讀方式，視線基本上是從上到下自然移動(dòng)，在體驗(yàn)上更加輕松。

5、不要讓不必要的文案內(nèi)容擾亂操作

即使你所設(shè)計(jì)的網(wǎng)站和 APP 并不是走極簡(jiǎn)的風(fēng)格，在很多的頁(yè)面當(dāng)中，都是需要做一些必要的精簡(jiǎn)，幫助用戶更加快速和順暢地從 A 點(diǎn)出發(fā)抵達(dá) B 點(diǎn)。

比如在注冊(cè)頁(yè)面當(dāng)中，一個(gè)「Register Now（立刻注冊(cè)）」就足以告知要做的事情，那么副標(biāo)題「請(qǐng)?zhí)顚?xiě)下方的注冊(cè)表單」其實(shí)是沒(méi)有存在的必要。

指引用戶方向當(dāng)然是必要的，但是在本身的文案和功能是不言自明的情況下，再增加額外的說(shuō)明就屬于畫(huà)蛇添足了。

6、不要為了精簡(jiǎn)而粗暴精簡(jiǎn)UI控件

和上面一條的道理相同，雖然有的 UI 控件在設(shè)計(jì)上確實(shí)存在精簡(jiǎn)的空間，但是也不要為了精簡(jiǎn)而精簡(jiǎn)。最典型的案例，就是加載進(jìn)度條的設(shè)計(jì)。從根源上來(lái)說(shuō)，進(jìn)度條的存在是為了幫助用戶了解某項(xiàng)操作的進(jìn)度，簡(jiǎn)單的加載控件僅僅只能夠給用戶以模糊的感知，只有明確的百分比標(biāo)識(shí)才是用戶真正想要知道的信息。

將百分比的標(biāo)識(shí)去掉，僅保留進(jìn)度條本體，很難讓用戶對(duì)信息把控，這種精簡(jiǎn)方式其實(shí)是在體驗(yàn)上開(kāi)倒車。

作者：Marc Andrew