編者按：本文來自微信公眾號(hào)“UXRen”（ID：cnUXRen）,，翻譯：凌藝蜻 審校：惜惜,，36氪經(jīng)授權(quán)發(fā)布,。

為什么有些網(wǎng)站能夠長期在人氣榜上領(lǐng)先，而其他網(wǎng)站耗費(fèi)大量時(shí)間和財(cái)力都無法吸引用戶,？最重要的原因在于這些網(wǎng)站的信息架構(gòu)與用戶交互的方式,。以Etsy.com為例，其導(dǎo)航,、推薦和下單流程的優(yōu)化使得消費(fèi)者的生活盡可能變得輕松,。如果你想像Etsy一樣，讓用戶體驗(yàn)變得更友好,。那就來學(xué)學(xué)如何避免下列用戶體驗(yàn)上的錯(cuò)誤：

1. 忽略了第一印象

有句話是這么說的：“想要給人留下良好的第一印象,，機(jī)會(huì)只有一次?！毕胂竽阏谝粋€(gè)高檔餐廳舉辦party,，你邀請(qǐng)了你的客戶一起慶功或討論合作機(jī)會(huì)。無論他們是你的現(xiàn)有客戶或潛在的投資人,，你都希望給他們留下好的第一印象,。網(wǎng)站也一樣，你只有幾秒鐘的時(shí)間去吸引訪客,，讓他們認(rèn)為值得花更多時(shí)間去了解這個(gè)公司,、產(chǎn)品或服務(wù)。

在設(shè)計(jì)網(wǎng)站時(shí),，需要記住的是,，用戶更傾向于遵循“F”的瀏覽習(xí)慣。Nielsen Norman Group通過眼動(dòng)測試已經(jīng)證明這點(diǎn),，用戶在瀏覽很多網(wǎng)頁時(shí),，眼睛會(huì)先看標(biāo)題，然后瀏覽它下方的部分,，接著到下一個(gè)標(biāo)題,。用戶就是這樣快速瀏覽，以決定他們是否對(duì)這個(gè)網(wǎng)頁的內(nèi)容感興趣,。

2. 忽視殘疾用戶

僅需一點(diǎn)努力,，你就可以讓你的網(wǎng)站對(duì)殘疾用戶更友好。根據(jù)新罕布什爾大學(xué)發(fā)布的2018 Disability Statistics Annual Report,，在美國,，有12.5%的人存在不同程度的殘疾，其中2%的人存在視覺障礙,。從殘疾用戶角度考慮,，甚至讓他們來協(xié)助設(shè)計(jì)網(wǎng)站，會(huì)對(duì)你的公司有很多好處,。Open Inclusions研究部主管Tom Pokinko說：

“(…)和殘疾人及老年人設(shè)計(jì),，可以為大家創(chuàng)造出更好的產(chǎn)品和服務(wù),，同時(shí)會(huì)帶來更好的品牌體驗(yàn)。比如說,，網(wǎng)站和郵件中用很小或者低對(duì)比度的字體,，不僅對(duì)于有視力障礙的用戶來說很難閱讀，對(duì)那些視疲勞或那些手機(jī)屏幕反光的用戶也一樣困難,?！?/p>

他對(duì)比了殘疾人和有閱讀障礙用戶的需求。

“模糊不清的文案及視覺設(shè)計(jì),，包括令人困惑的頁面布局或分散注意力的視覺效果,，會(huì)讓有閱讀障礙的用戶難以理解網(wǎng)站內(nèi)容。(…)這個(gè)問題同樣會(huì)發(fā)生在非殘疾人的用戶身上,，尤其是那些碰巧沒集中注意力,、壓力大、需要快速查找信息或是那些非母語閱讀者,?！?/p>

這就是為什么要讓你的用戶可以自由設(shè)置字體和顏色對(duì)比度。

另外,，記得讓開發(fā)人員在照片和視頻中加一段文字描述（ALT屬性）,，這樣使用讀屏軟件的盲人用戶也可以通過文字描述獲取照片和視頻信息。

3. 用詞不當(dāng)或太多

你應(yīng)該見過很多網(wǎng)站都有過多的文案以及專業(yè)術(shù)語,，很多品牌經(jīng)常在網(wǎng)站上放盡可能多的信息,，但是卻始終沒有把他們的核心信息傳達(dá)給用戶。我們?cè)僖媚莻€(gè)與客戶晚宴的比喻,，在討論商業(yè)問題時(shí),，會(huì)一上來就把所有的餐食飲料全上齊嗎？還是說先上開胃菜,，然后慢慢上其他菜呢,？這不僅僅是出于禮節(jié)，也是有背后的道理的,。首先,，我們要先了解客戶，這樣就可以呈現(xiàn)符合客戶的需求和認(rèn)知水平的內(nèi)容,。

在平面藝術(shù)中,，有一個(gè)“少即是多”的趨勢，它現(xiàn)在已經(jīng)可以被認(rèn)為是一條標(biāo)準(zhǔn)了,，因?yàn)樾欧钏娜嗽诓粩嘣黾?，尤其是用戶體驗(yàn)專家。

對(duì)于內(nèi)容也一樣，隨著用戶體驗(yàn)寫作的發(fā)展,，趨勢是朝著簡化至最少內(nèi)容的方向發(fā)展的。所以要先了解你的用戶,，不要在一開始就扼殺了轉(zhuǎn)化,。

4. 忘記使用面包屑導(dǎo)航

盡管我們產(chǎn)品和服務(wù)背后有很先進(jìn)的技術(shù)，但網(wǎng)站和移動(dòng)應(yīng)用還是應(yīng)該越簡潔越直觀越好,。如果沒有使用面包屑導(dǎo)航,，就很難做到簡潔和直觀。當(dāng)在決定如何使用他們時(shí),，你可以參考像ebay,、沃爾瑪那樣的大型電商網(wǎng)站，它們使用了現(xiàn)在最受歡迎最有用的兩種導(dǎo)航：

1. 基于位置
展示我們現(xiàn)在在網(wǎng)站的什么地方,。通過導(dǎo)航欄,，用戶可以輕松地在上級(jí)和下級(jí)分類中跳轉(zhuǎn)。像這樣：類目>子類目>產(chǎn)品分類>具體產(chǎn)品

2. 基于產(chǎn)品屬性
多見于電商網(wǎng)站,。他們依靠產(chǎn)品標(biāo)簽或能吸引用戶的內(nèi)容來篩選,，或根據(jù)用戶需求，從產(chǎn)品分類中篩選,。通過這種方式,，我們能確保產(chǎn)品信息的呈現(xiàn)符合規(guī)范，或能根據(jù)少數(shù)幾個(gè)產(chǎn)品屬性來過濾出產(chǎn)品,。

如果你有關(guān)注網(wǎng)站的SEO（搜索引擎優(yōu)化）,，記住，使用面包屑導(dǎo)航可以提升站內(nèi)連接和增強(qiáng)網(wǎng)站整體結(jié)構(gòu)框架,。如果你用對(duì)了,，會(huì)降低網(wǎng)站跳出率，因?yàn)橛脩裟芡ㄟ^導(dǎo)航找到他們感興趣的內(nèi)容,。

5. 迫使用戶思考接下來該做什么

用戶對(duì)你的網(wǎng)站提出的最糟糕的問題,，是“我現(xiàn)在應(yīng)該點(diǎn)擊哪里？”,，這表示當(dāng)用戶希望了解更多時(shí),，你的網(wǎng)站沒能讓用戶輕松做到這點(diǎn)。記住,，一個(gè)好的網(wǎng)站是很容易瀏覽的,。你需要決定你的網(wǎng)站上各元素的優(yōu)先級(jí)，并用顏色,，對(duì)比度,，大小或者位置去區(qū)分它們。如果你沒有做這些，并且給用戶過多的選項(xiàng),，用戶會(huì)不知所措,。

當(dāng)我們覺得沒有選擇的時(shí)候，會(huì)有被控制和挫敗感,，但當(dāng)我們面對(duì)太多選擇的時(shí)候,，滿意度也會(huì)下降。如果你不知道哪些元素是你網(wǎng)站上的重點(diǎn),，可以分析數(shù)據(jù)或是跟蹤用戶的瀏覽路徑,。這對(duì)你的轉(zhuǎn)化率非常重要，因?yàn)橛醒芯勘砻?，過多的選擇會(huì)使銷量下降,。

如果你發(fā)現(xiàn)用戶在你的網(wǎng)站上做決定時(shí)花的時(shí)間過多，你可以使用Hick定律,。使用它,，你可以讓你的用戶更快的做出決定。比如說一個(gè)用戶離開了購物車頁面,，但回頭又再次瀏覽產(chǎn)品頁面,，那么他的問題，很有可能與從一個(gè)很大的分類中選擇一個(gè)產(chǎn)品有關(guān),。那么你就可以通過專注且動(dòng)態(tài)地展示一個(gè)產(chǎn)品的內(nèi)容來解決這個(gè)問題,。在這種情況下，少一些信息,，代表著更快地下單,。

6. 不清晰或過多的行為召喚

很多網(wǎng)站都有與行為召喚相關(guān)的問題，通常都是和網(wǎng)站的表達(dá)不夠清晰有關(guān),。

記住,，用按鈕提示用戶做出行動(dòng)必須滿足一些特定的條件：

按鈕需要在視覺上突出于頁面上其他的內(nèi)容，慎重選擇它的顏色和大小,。

按鈕的順序很重要,。問問自己用戶會(huì)想要什么樣的順序。默認(rèn)選項(xiàng)應(yīng)該是什么,，還有什么應(yīng)該是備選項(xiàng),。如果你還是有疑問，Nick Babich的文章會(huì)給你答案,。

按鈕的顏色也很重要,。生動(dòng)的，明亮的顏色會(huì)讓我們明白點(diǎn)擊它會(huì)導(dǎo)致一些結(jié)果,。顏色也會(huì)引發(fā)一些特定的聯(lián)系,，比如紅色代表否認(rèn),，綠色代表接受，而橙色或者黃色代表警告,。

太多的按鈕,。就如同過多選擇會(huì)使銷量下降的定律所說，用戶可能會(huì)不知道點(diǎn)哪個(gè)而導(dǎo)致什么都不點(diǎn),。你要決定你想在你的頁面中突出什么,，并且限制用戶只能點(diǎn)一個(gè)按鈕。

點(diǎn)擊后沒有交互,。確保用戶清楚點(diǎn)擊之后產(chǎn)生了一些結(jié)果。

常會(huì)遇到當(dāng)訂閱推送郵件或投票后,，不給用戶返回任何反饋的情況,，記得在最后展示一個(gè)感謝信息。

7. 要求,，要求（不停要求）

你有認(rèn)識(shí)誰喜歡填問卷的么,？應(yīng)該沒有，因?yàn)闆]人喜歡,。如果你不得不使用問卷,，記得在發(fā)問卷的時(shí)候給用戶一些東西作為回報(bào)。以物換物,，才公平對(duì)吧,？當(dāng)你要求用戶去做類似問卷調(diào)查或者需要用戶提供一些可以幫到你的信息時(shí)，最好可以給他們提供一些折扣碼或者優(yōu)惠價(jià),。

有時(shí)候,，我們會(huì)讓用戶填寫聯(lián)系信息，而不管用戶是否需要從網(wǎng)站中接收任何信息,。這種情況常發(fā)生在購買前的注冊(cè)或者網(wǎng)站收到投訴時(shí),。如果你需要獲取用戶信息，記得讓你的表單：

• 加入自動(dòng)填充的選擇,，讓用戶很容易填完

• 加入自動(dòng)保存的功能

• 越短越好

• 好好展示問題,，不要讓用戶還需點(diǎn)擊展開

當(dāng)用戶完成表單后，要感謝他們,。如果可能的話,，用某種獎(jiǎng)勵(lì)來表達(dá)你的感謝。記住,，任何人都會(huì)喜歡得到東西,！

8. 沒有保存那些很容易保存的東西

你應(yīng)該知道比起填表單，更容易激怒客戶的,，是沒有自動(dòng)保存功能的表單,。想象一下你正在買機(jī)票,，需要四個(gè)步驟。當(dāng)你完成了購買,，你發(fā)現(xiàn)輸入了錯(cuò)誤的身份證號(hào),。你點(diǎn)返回去修改，然后很快發(fā)現(xiàn)你填都所有信息都不見了,，需要從頭再填一遍?，F(xiàn)在所有事情都需要花雙倍時(shí)間而你也感到雙倍的沮喪。

這顯然不是你想給用戶的體驗(yàn),，所以需要做什么去防止它出現(xiàn)呢,？

• 在表單中加入自動(dòng)填充功能。

• 使用可以檢查格式的工具,，幫助用戶避免簡單錯(cuò)誤和拼寫錯(cuò)誤,。

盡量讓過程變得順利并且沒有困難。這會(huì)讓用戶更開心更沉浸在你的網(wǎng)站中,，這樣的用戶也是會(huì)花更多錢的用戶,！

9. 把用戶的注意力從最重要的事情上轉(zhuǎn)移

我們從第一印象開始，讓我們?cè)谧罱K印象上結(jié)尾,，因?yàn)樽罱K印象對(duì)轉(zhuǎn)化率有重要且長遠(yuǎn)的影響,。如果一個(gè)網(wǎng)站用很多分散注意的內(nèi)容來轟炸我們，比如彈窗廣告或者打擾的廣告,，會(huì)讓購買過程變得很困難,。不僅僅因?yàn)樗^的廣告盲區(qū)，用戶不會(huì)看,，還會(huì)打斷購買流程,。

當(dāng)你的用戶往購物車?yán)锛恿艘患a(chǎn)品并且想要完成購買的時(shí)候，往往不會(huì)有時(shí)間讓用戶從這個(gè)流程中被打斷,。那什么樣的事情會(huì)在購買的最后階段分散用戶的注意呢,？想象一下你正在購買一個(gè)高端產(chǎn)品，在購買的最后一步,，你看到頁面上有個(gè)框里寫著“高端產(chǎn)品九折優(yōu)惠劵”,。如果你沒有收到過優(yōu)惠劵，你會(huì)去找它,，也許會(huì)離開商店頁面去尋找,。讓我們回顧一下“少即是多”的原則。在你的網(wǎng)站上去掉不必要的元素,，當(dāng)你離賣出一件產(chǎn)品更近的時(shí)候,，應(yīng)該給你的客戶更少的選擇。

10. 沒有充分的測試

在介紹中,，我說高效的頁面往往很相似,。這些相似點(diǎn)都很明顯,。如果你對(duì)用戶一無所知，不知道用戶喜好會(huì)如何變化等等,。你就需要持續(xù)監(jiān)測他們的行為并且收集相關(guān)的數(shù)據(jù),，對(duì)網(wǎng)站上的元素進(jìn)行A／B測試，這對(duì)于及時(shí)發(fā)現(xiàn)用戶的需求是十分重要的,。測試的元素應(yīng)該包括：

• 頭部內(nèi)容

• 圖片

• 視頻

• 表單

• 行為召喚

你可以決定何時(shí)對(duì)哪些用戶及哪些元素進(jìn)行測試,。要記住這項(xiàng)工作是長期持續(xù)的，并且要對(duì)多個(gè)子頁面或者表單進(jìn)行這些測試,。檢查產(chǎn)品頁面,，測試下單流程，以及在不同渠道發(fā)出的信息形式,。那些對(duì)你的競品有效的東西,，可能并不適用于你，所以請(qǐng)將A／B測試作為你營銷計(jì)劃中不變的一部分,。

總結(jié)

Hlade定律：如果你把一個(gè)困難的任務(wù)交給一個(gè)懶惰的人，他會(huì)找到一個(gè)更簡單的方式去完成它,。

這個(gè)定律首次發(fā)表于十九世紀(jì)八十年代的《Murphy’s Law Book Two: More Reasons Why Things Go Wrong》,，現(xiàn)在仍然適用。在用戶爭奪戰(zhàn)中,，誰能讓用戶生活更輕松,，誰就贏了。這就是為什么一個(gè)能給用戶提供個(gè)性化設(shè)置的,，表單簡潔,，且內(nèi)容簡練的網(wǎng)站會(huì)十分受歡迎。好的用戶體驗(yàn)設(shè)計(jì),，意味著用戶不需要停下來思考接下來該做什么,。我們不需要那么多復(fù)雜耗時(shí)的步驟，只要簡單引導(dǎo)用戶正確操作,。記住“少即是多”的原則,，讓事情從一開始就保持簡單。祝好運(yùn),！

名詞解釋：

ALT屬性：ALT屬性是一個(gè)用于網(wǎng)頁語言HTML和XHTML,、為輸出純文字的參數(shù)屬性，用于在圖像無法顯示或者用戶禁用圖像顯示時(shí),，代替圖像顯示在瀏覽器中的內(nèi)容,。

Hick’s Law：一個(gè)人面臨的選擇（n）越多，所需要作出決定的時(shí)間（T）就越長,。用數(shù)學(xué)公式表達(dá)為反應(yīng)時(shí)間 T=a+b log2（n）,。

CTA（Call to Action行為召喚）：通過按鈕,、鏈接文字、圖標(biāo)等頁面元素,，促使用戶采取某個(gè)行動(dòng),。

--------------------------

原文鏈接

https:///synerise/dont-ruin-your-conversion-rate-with-these-10-ux-mistakes-42c29f677d9

--------------------------

本文經(jīng)授權(quán)發(fā)布，不代表36氪立場,。如若轉(zhuǎn)載請(qǐng)聯(lián)系原作者,。