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

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

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

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

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

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

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

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

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

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

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

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

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

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

4、將字段名稱放在較長表單的輸入框上方

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

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

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

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

比如在注冊頁面當(dāng)中，一個「Register Now（立刻注冊）」就足以告知要做的事情，那么副標(biāo)題「請?zhí)顚懴路降淖员韱巍蛊鋵?shí)是沒有存在的必要。

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

6、不要為了精簡而粗暴精簡UI控件

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

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

作者：Marc Andrew