頁面優(yōu)化Check List(四)-輸入(表單、注冊)#產(chǎn)品經(jīng)理的設計課#

本文為轉載整理的學習筆記澜倦,編號有所改動聚蝶。關于表單、注冊類的輸入優(yōu)化將會陸續(xù)整理更新到這一篇藻治。

文章來自@謝爾魚翻譯并授權人人都是產(chǎn)品經(jīng)理社區(qū)發(fā)布

原文地址:http://goodui.org/

1.嘗試精簡表單

人類天生就抗拒密集型勞動碘勉,并且這也體現(xiàn)在表單填寫上。你要求用戶填寫的每一個字段都有讓用戶轉身放棄的風險桩卵。每個人打字的速度都是不一樣的验靡,況且在移動設備端輸入更是一件苦差事。確定是否每一個字段都是必需的雏节,盡量刪掉不必要的字段胜嗓。如果你確實有大量的信息需要用戶填寫,考慮將它們分開到不同的頁面填寫钩乍,或者在提交之后還能繼續(xù)補充辞州。過多的字段會讓你的表單臃腫浆洗,要想精簡也很容易荞彼,減少字段就行了标捺。

2.嘗試暴露選項而不是隱藏它們

你使用的每一個下拉菜單隱藏的信息迈螟,都需要用戶用額外的操作才能顯示罕容。假如那些隱藏選項對用戶來說是貫穿整個操作的袋毙,你可能會希望它們展示得更明顯一些沪摄。保留那些約定俗成的下拉菜單诱篷,比如說日期和時間(例如:日歷)或者地理位置的選擇妄痪。有時候下拉菜單在用戶重復使用的地方也是可以使用的(例如:操作菜單)哈雏。在你需要進行頁面跳轉的地方,盡量避免為主要功能使用下拉菜單衫生。

3.嘗試循序漸進的引導而不是草率地讓用戶注冊

與其要求用戶立馬注冊裳瘪,何不讓用戶先體驗一些已示范的有價值的操作呢透敌?在最初的交互過程中划滋,不僅能展現(xiàn)產(chǎn)品的價值饵筑,也能顯示出產(chǎn)品的個性。一旦用戶開始看到你的產(chǎn)品的價值处坪,了解產(chǎn)品對自己的用處根资,他們將更樂于與你分享更多的信息架专。這種循序漸進的引導是一種盡可能推遲注冊過程的方法,同時還可以讓用戶使用和自定義你的應用或產(chǎn)品玄帕。

4.嘗試使用智能的默認值部脚,而不是要求額外的操作

使用智能默認值,或者根據(jù)經(jīng)驗猜測預填表單字段能夠幫助用戶減少大量的工作量裤纹。這是一種節(jié)省用戶的寶貴時間委刘,幫助用戶快速完成表單填寫的常用技巧。最糟糕的事情是從經(jīng)驗和轉化點出發(fā)要求用戶填寫的信息可能是他們在過去已經(jīng)反復多次提供過的服傍。嘗試加載和顯示已經(jīng)驗證過的字段值钱雷,而不是每次都要求用戶填寫。用戶的工作量越少越好吹零。

5.嘗試進行內聯(lián)驗證罩抗,而不是提交后再報錯

當處理表單時,通常在驗證到字段填寫不正確時就立馬給出錯誤提示灿椅,比填完提交之后再報錯要好得多套蒂。這里強調的交互模式當然就是最著名的內聯(lián)驗證了。當驗證到錯誤的時候茫蛹,將其立馬顯示出來(在輸入框右邊顯示出來)操刀,這樣上下文中出現(xiàn)錯誤時就可以立即被更正。另一方面婴洼,如果在表單提交之后再提示錯誤骨坑,就會強迫用戶回憶之前的操作步驟而做額外的工作。

6.嘗試放寬輸入的條件柬采,而不是要求嚴格的數(shù)據(jù)格式

適當放寬對輸入數(shù)據(jù)的要求會使計算機看起來更人性化一點欢唾。放寬對輸入數(shù)據(jù)的要求,包括數(shù)據(jù)的內容粉捻、格式礁遣,會讓你的用戶界面更加友好。最好的例子就是當我們要求用戶輸入電話號碼的時候肩刃,用戶輸入的方式有很多種——帶括號的祟霍,不帶括號的,帶破折號的盈包,帶區(qū)號的等等沸呐。對你來說,就是稍微多寫幾行代碼续语,但你的用戶會因此省很多事垂谢。

7.嘗試顯式地羅列選項,而不是讓用戶自己邊回憶邊填寫

這是一條與心理學緊密相關的經(jīng)典原則疮茄,即人們很容易在一些已有的事物中進行辨識滥朱,而純粹從記憶中回憶則相對困難根暑。辨識給我們提供的線索或提示,讓我們只需要稍微回憶一下就能完成徙邻。而回憶則要求人們完全靠自己從記憶深處進行搜索排嫌。這可能就是為什么在考試中有時多項選擇題比開放題能更快地完成。所以給用戶提供一些之前涉及到的信息作為選項缰犁,而不是讓他們完全靠自己回憶浪箭。

8.嘗試漸進式地收集信息豺憔,而不是無條理的獲取信息

漸進式顯示能使用戶免收不相關信息的干擾衡怀。這種模式漸進式地展示信息银伟,即在上下文中有必要顯示該信息的時候,它才顯示并徘。通常漸進式顯示會伴隨著某種形式的內聯(lián)擴展或者滑出動畫遣钳。如果太多字段需要用戶填寫,可能會將用戶嚇跑麦乞,所以這也是另一種避免不必要的輸入字段的策略蕴茴。只在必要的情況下才顯示/請求這些字段。

9.嘗試為控件添加多功能

簡潔性因其與易用性息息相關而在設計中舉足輕重姐直。太多的雜物會消耗我們有限的注意力倦淀,并且模塊越多声畏,可用性空間不足的問題就會越明顯撞叽。在用戶界面上用簡潔的元素也可以實現(xiàn)相同的功能,方法之一就是讓UI控件具備多功能插龄。也就是說能扒,在一個控件上添加兩個或多個功能。舉個例子辫狼,我們可以在一個搜索輸入字段上綁定一系列的過濾機制,以此來移除額外的過濾器辛润。我們也可以通過鼠標懸停展示來進一步減少額外的部分膨处。不過多功能機制并不是萬能的。簡潔的代價是隱蔽性砂竖。不太明顯的功能有被忽略的風險真椿。因此,對澈醭危客來說突硝,保留多功能方法還是很好的。所以置济,合理使用多功能解恰,但不要濫用锋八。

10.嘗試在界面上做有用的運算,而不是讓用戶自己計算

用戶界面可以為用戶做一些數(shù)學運算护盈,從而消除不必要的摩擦挟纱。舉例來說,讓我們假設有一些應用的積分快用完了而不能再繼續(xù)使用腐宋。這時為用戶計算出還有多少天應用就到期或許是更有意義的紊服。一個更簡單和應用廣泛的例子是“3分鐘前”相對于“9月2日,下午4:37”對用戶來說更易于理解胸竞。在界面上為用戶做好運算欺嗤,使用戶免于計算的苦惱。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末卫枝,一起剝皮案震驚了整個濱河市煎饼,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌剃盾,老刑警劉巖腺占,帶你破解...
    沈念sama閱讀 210,978評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異痒谴,居然都是意外死亡衰伯,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,954評論 2 384
  • 文/潘曉璐 我一進店門积蔚,熙熙樓的掌柜王于貴愁眉苦臉地迎上來意鲸,“玉大人,你說我怎么就攤上這事尽爆≡豕耍” “怎么了?”我有些...
    開封第一講書人閱讀 156,623評論 0 345
  • 文/不壞的土叔 我叫張陵漱贱,是天一觀的道長槐雾。 經(jīng)常有香客問我,道長幅狮,這世上最難降的妖魔是什么募强? 我笑而不...
    開封第一講書人閱讀 56,324評論 1 282
  • 正文 為了忘掉前任,我火速辦了婚禮崇摄,結果婚禮上擎值,老公的妹妹穿的比我還像新娘。我一直安慰自己逐抑,他們只是感情好鸠儿,可當我...
    茶點故事閱讀 65,390評論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著厕氨,像睡著了一般进每。 火紅的嫁衣襯著肌膚如雪汹粤。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,741評論 1 289
  • 那天品追,我揣著相機與錄音玄括,去河邊找鬼。 笑死肉瓦,一個胖子當著我的面吹牛遭京,可吹牛的內容都是我干的。 我是一名探鬼主播泞莉,決...
    沈念sama閱讀 38,892評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼哪雕,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了鲫趁?” 一聲冷哼從身側響起斯嚎,我...
    開封第一講書人閱讀 37,655評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎挨厚,沒想到半個月后堡僻,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,104評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡疫剃,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,451評論 2 325
  • 正文 我和宋清朗相戀三年钉疫,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片巢价。...
    茶點故事閱讀 38,569評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡牲阁,死狀恐怖,靈堂內的尸體忽然破棺而出壤躲,到底是詐尸還是另有隱情城菊,我是刑警寧澤,帶...
    沈念sama閱讀 34,254評論 4 328
  • 正文 年R本政府宣布碉克,位于F島的核電站凌唬,受9級特大地震影響,放射性物質發(fā)生泄漏漏麦。R本人自食惡果不足惜法瑟,卻給世界環(huán)境...
    茶點故事閱讀 39,834評論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望唁奢。 院中可真熱鬧,春花似錦窝剖、人聲如沸麻掸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,725評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽脊奋。三九已至熬北,卻和暖如春孙咪,著一層夾襖步出監(jiān)牢的瞬間探遵,已是汗流浹背帽氓。 一陣腳步聲響...
    開封第一講書人閱讀 31,950評論 1 264
  • 我被黑心中介騙來泰國打工汁果, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留拥知,地道東北人荡陷。 一個月前我還...
    沈念sama閱讀 46,260評論 2 360
  • 正文 我出身青樓态罪,卻偏偏與公主長得像黎茎,于是被迫代替她去往敵國和親地消。 傳聞我的和親對象是個殘疾皇子炉峰,可洞房花燭夜當晚...
    茶點故事閱讀 43,446評論 2 348

推薦閱讀更多精彩內容

  • HTML表單 在HTML中,表單是 ... 之間元素的集合脉执,它們允許訪問者輸入文本疼阔、選擇選項、操作對象等等半夷,然后將...
    蘭山小亭閱讀 3,412評論 2 14
  • 本文為轉載整理的學習筆記婆廊,編號有所改動。關于介紹文案的優(yōu)化將會陸續(xù)整理更新到這一篇巫橄。 文章來自@謝爾魚翻譯并授權人...
    錢小小春閱讀 1,001評論 2 12
  • 無論你是做什么產(chǎn)品的淘邻,我相信表單設計的需求都是非常常見的,但是也是容易被忽略的嗦随。跟以往不同的是列荔,寫這篇文章并不是我...
    idatadesign閱讀 1,835評論 1 25
  • 一. 表單設計的影響與原則 1.1 表單的產(chǎn)生 由內而外,網(wǎng)站根據(jù)自身信息存儲格式要求枚尼,從數(shù)據(jù)庫映射成表單贴浙。 由外...
    曉夢蟬君閱讀 12,034評論 1 30
  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務發(fā)現(xiàn)署恍,斷路器崎溃,智...
    卡卡羅2017閱讀 134,628評論 18 139