讀者：

呆呆，這個(gè)圖的卡片列表里，標(biāo)題用省略號(hào)合適嗎？

（因?yàn)樵瓐D涉及讀者項(xiàng)目隱私，所以重畫(huà)了個(gè)草圖。）

又是一個(gè)沒(méi)有業(yè)務(wù)背景的問(wèn)題。不過(guò)這個(gè)問(wèn)題比較簡(jiǎn)單，可以展開(kāi)來(lái)說(shuō)一下。

通常，我們會(huì)在各類產(chǎn)品里面見(jiàn)到諸如「標(biāo)題超出部分用省略號(hào)顯示」這樣的設(shè)計(jì)，譬如上面這圖。

于是，許多人在自家產(chǎn)品的設(shè)計(jì)過(guò)程中，遇到此類情況，被開(kāi)發(fā)問(wèn)到時(shí)，也會(huì)搪塞一句：文案要是超出就「…」顯示吧。

大多數(shù)遇到這種情況的，都是因?yàn)橹皼](méi)考慮好，才臨時(shí)想了這個(gè)解決辦法。

而很多時(shí)候，一些產(chǎn)品之所以用「…」顯示，并不是因?yàn)閱渭兊匚陌敢绯?，可能是專門(mén)設(shè)計(jì)過(guò)的。

所以，如果簡(jiǎn)單地認(rèn)為「…」就是解決溢出而使用的方法，那就有問(wèn)題了。

下面舉幾個(gè)例子。

有些產(chǎn)品，我們幾乎看不到列表視圖里的標(biāo)題是有省略號(hào)的。

因?yàn)檫@類產(chǎn)品的目的就是讓用戶讀到完整的標(biāo)題信息，對(duì)眼前的內(nèi)容好做判斷，從而考慮是否點(diǎn)進(jìn)去看詳情。

所以在設(shè)定的時(shí)候，界面中標(biāo)題字?jǐn)?shù)的規(guī)定，與界面樣式就已經(jīng)提前規(guī)劃好了，可能在后臺(tái)設(shè)置就限定死字?jǐn)?shù)，要求運(yùn)營(yíng)人員上新時(shí)要統(tǒng)一界面的展示形式。

這種情況下，一般就不會(huì)再有省略號(hào)的問(wèn)題，譬如一些知識(shí)付費(fèi)類產(chǎn)品。

比較典型的還有 TED 演講視頻的標(biāo)題，在《設(shè)計(jì)體系》這本書(shū)里專門(mén)提到了這個(gè)案例。

對(duì)于 TED 來(lái)說(shuō)，演講標(biāo)題的信息優(yōu)先級(jí)是最高的，所以他們寧可保留所有標(biāo)題文案，也不對(duì)文案做截?cái)嘤谩浮癸@示。

因?yàn)閷?duì)標(biāo)題做截?cái)嗍呛苋菀椎?，而難的是把一個(gè)演講主題提煉成一句簡(jiǎn)短句子，所以他們?yōu)榱苏故靖逦臉?biāo)題，寧可在界面上保留長(zhǎng)標(biāo)題，甚至為長(zhǎng)標(biāo)題的顯示而專門(mén)設(shè)計(jì)相符合的展示形式。

反過(guò)來(lái)，他們也因?yàn)檫@一點(diǎn)而確定了界面上標(biāo)題字?jǐn)?shù)的上限，確保文案不會(huì)超過(guò)界面顯示的最大臨界值。

包括一些資訊類產(chǎn)品，在標(biāo)題上也會(huì)做限制，以滿足最大化呈現(xiàn)且不使用省略號(hào)。意思是：假設(shè)界面上文案范圍定了 30 個(gè)字符，那么配置的時(shí)候就必須 30 個(gè)字符以內(nèi)把內(nèi)容表達(dá)清楚，且必須完全顯示在界面上。

所以經(jīng)?？吹揭恍?UGC 產(chǎn)品之所以會(huì)限制標(biāo)題字?jǐn)?shù)，原因除了常見(jiàn)的標(biāo)題不能過(guò)長(zhǎng)之外，還有一點(diǎn)是為了在列表頁(yè)就能顯示完整。

各位在設(shè)計(jì)這類產(chǎn)品功能時(shí)，也要注意到這一點(diǎn)，而不是隨意說(shuō)一個(gè)「字符不能超過(guò) 50 吧」。

而有些產(chǎn)品的內(nèi)容列表，之所以頻繁使用省略號(hào)，它的目的是為了引導(dǎo)用戶點(diǎn)擊用的。

這類形式一般出現(xiàn)在營(yíng)銷號(hào)發(fā)的文章里，多是營(yíng)銷人員自己為了文章點(diǎn)擊率而做的。很少會(huì)有一款產(chǎn)品的所有內(nèi)容都是這樣的，除非是一些內(nèi)容產(chǎn)品，運(yùn)營(yíng)方是企業(yè)自己，為了讓產(chǎn)品上的內(nèi)容有更多人點(diǎn)擊而這樣去設(shè)計(jì)，當(dāng)中可能涵蓋了廣告，以此賺取廣告費(fèi)。

不過(guò)這類內(nèi)容的設(shè)計(jì)已經(jīng)讓用戶開(kāi)始反感，所以如果不是特殊情況，最好少這樣去做。

當(dāng)然，還有同類型的，一般出現(xiàn)在頁(yè)面面積小且需要展示更多信息的集合類視圖，比如：

這種形式的設(shè)計(jì)，就是因?yàn)轫?yè)面上想展示的信息太多，以至于通過(guò)這類合集來(lái)展示某個(gè)模塊里的內(nèi)容，營(yíng)造出一種很豐富的感覺(jué)。

也就是利用「…」引導(dǎo)用戶點(diǎn)擊，表示信息沒(méi)有展示全，如果要看，就點(diǎn)開(kāi)詳情，進(jìn)二級(jí)頁(yè)面。

還有一些產(chǎn)品的省略號(hào)，純粹就是大家理解的，溢出就省略號(hào)顯示。

比如同樣是資訊或內(nèi)容類，以文字為主的產(chǎn)品，雖然標(biāo)題超出范圍用了省略號(hào)，但用戶基本也已經(jīng)知道是什么內(nèi)容（上面那個(gè)集合類視圖也是一種），且還有摘要引讀。

比如下圖：

這種標(biāo)題字符限制在了兩行以內(nèi)，多余字符用「…」展示，基本上已經(jīng)是一句完整的話，能讓人大致了解這條信息的意思。并且還有部分摘要，已經(jīng)足夠用戶判斷是否對(duì)它有興趣，如果沒(méi)興趣，直接刷走也無(wú)所謂。

包括一些電商類產(chǎn)品，用戶多以商品圖片為主要決策因素，商品標(biāo)題作為輔助信息，優(yōu)先級(jí)不高，所以標(biāo)題溢出是否省略號(hào)顯示也無(wú)所謂。

這其中有一個(gè)特殊情況，就是有些產(chǎn)品的標(biāo)題即不展示全，同時(shí)又沒(méi)有省略號(hào)，比如淘寶的商品搜索結(jié)果頁(yè)面。

因?yàn)檫@類列表實(shí)質(zhì)是一個(gè)產(chǎn)品賣(mài)點(diǎn)集合的濃縮詞，不是完整的一句話，多余字符展示或者不展示，都不會(huì)有太大影響，所以也不重要。

當(dāng)中我比較反感的還要數(shù)農(nóng)藥了。

好友邀請(qǐng)的列表視圖里，常常看不全昵稱，因?yàn)楹糜褧?huì)有游戲昵稱，微信備注會(huì)展示在游戲昵稱后面，以至于要點(diǎn)到游戲關(guān)系里先看全昵稱，再到匹配界面邀請(qǐng)好友。

既然已經(jīng)區(qū)分了微信好友與游戲好友，為什么昵稱上面不也加以區(qū)分呢？

當(dāng)然，經(jīng)常玩的好友可能沒(méi)這個(gè)必要，畢竟頭像或昵稱都可以很快識(shí)別出來(lái)，但是偶爾一起玩的好友通過(guò)這樣的識(shí)別方式就比較難了。

這里就是簡(jiǎn)單提一句。

通過(guò)上面提到的一些例子，以及不同場(chǎng)景下標(biāo)題省略號(hào)的處理方式，相信大家對(duì)這塊的理解會(huì)比之前更深。

同樣，對(duì)于開(kāi)篇讀者提到的問(wèn)題，更符合的情況可能類似于知乎這種，有完整句子，所以標(biāo)題是否省略號(hào)處理也就沒(méi)太大影響。

但具體的還是要結(jié)合業(yè)務(wù)詳情仔細(xì)考量。

而標(biāo)題內(nèi)容的展示是否要用省略號(hào)處理，優(yōu)先要看這條信息的業(yè)務(wù)權(quán)重，以及是否會(huì)影響用戶決策。

所以各位在設(shè)計(jì)這類內(nèi)容標(biāo)題是否要用「…」顯示時(shí)，也要注意判斷自己的產(chǎn)品特性符合哪種類型，而不是隨意一句話，說(shuō)「超出就省略號(hào)顯示好了」。

3、怎么判斷輸入框里放不放清空按鈕？

最近收到兩個(gè)問(wèn)題，正好都與輸入框有關(guān)：一個(gè)是怎么判斷輸入框要不要放置清空按鈕；另一個(gè)是輸入框超過(guò)限制后，是禁止用戶繼續(xù)輸入，還是允許超出但會(huì)警告提示。

在一定程度上，這兩個(gè)問(wèn)題的分析邏輯是類似的，所以放到一起聊正合適。

先看第一個(gè)問(wèn)題：怎么判斷輸入框里要不要放置清空按鈕？

原問(wèn)題是這樣的：

呆呆，我最近在優(yōu)化公司的產(chǎn)品，遇到一個(gè)問(wèn)題，就是 PM 想在聊天輸入框里加一個(gè)「清除按鈕」，可我覺(jué)得不太合適，但是說(shuō)不出原因，只能說(shuō)沒(méi)見(jiàn)過(guò)在聊天框里加清空按鈕的。這個(gè)問(wèn)題要怎么判斷呢？

我們一般會(huì)在搜索、手機(jī)號(hào)輸入框里看到類似的清空按鈕，比如輸錯(cuò)了就點(diǎn)一下，清空后再重新輸入。但是很少會(huì)在聊天框里看到清空按鈕，為什么呢？

主要是「時(shí)效性」…算了，這種概念詞用多了，發(fā)現(xiàn)現(xiàn)在人都不會(huì)講話了。說(shuō)白話就是「要快」。

無(wú)論在登錄注冊(cè)還是搜索的場(chǎng)景下，除了內(nèi)容本身之外，最注重的就是效率。

譬如有個(gè)數(shù)據(jù)大概是說(shuō)，用戶登錄注冊(cè)花的時(shí)間超過(guò)某個(gè)范圍，轉(zhuǎn)化率就會(huì)對(duì)應(yīng)逐步降低。而率，就是讓用戶能快速登錄注冊(cè)賬號(hào)，使用產(chǎn)品功能。所以設(shè)計(jì)師們會(huì)在登錄注冊(cè)的操作流程里抓住可提率的每個(gè)細(xì)節(jié)，輸入框使用效率就是其中之一。

搜索也是一樣，當(dāng)用戶有明確目的使用搜索框時(shí)，關(guān)鍵詞就是用戶當(dāng)下最關(guān)注的信息，如果輸錯(cuò)，再一個(gè)個(gè)刪除，顯得麻煩，所以清空按鈕能在這里提高用戶的操作效率，甚至 iOS 的搜索組件也會(huì)自帶一個(gè)清空按鈕。如果是電商產(chǎn)品，率是能間接提高成交率的。

這里的輸錯(cuò)，也有兩層意思，一個(gè)是用戶在輸入過(guò)程中發(fā)現(xiàn)錯(cuò)字，比如登錄注冊(cè)時(shí)，發(fā)現(xiàn)手機(jī)號(hào)輸錯(cuò)了，一個(gè)個(gè)刪除反而沒(méi)清空重新輸入來(lái)得快，因?yàn)閯h了之后，號(hào)碼要重新背一遍，具體到某個(gè)數(shù)字，然后接著輸，特麻煩。

或者搜索內(nèi)容時(shí)，發(fā)現(xiàn)有錯(cuò)別字，刪除某個(gè)字再重新輸入，反而沒(méi)有清空重新輸入來(lái)得快，畢竟輸入法有串聯(lián)關(guān)鍵詞組的功能。

另一個(gè)是反饋的結(jié)果不符合用戶的心理預(yù)期。比如輸入手機(jī)號(hào)已被注冊(cè)，或者搜索結(jié)果不滿意要重新輸入關(guān)鍵詞，使用一鍵清空都是比較的。

而且輸入之后，系統(tǒng)需要給用戶呈現(xiàn)結(jié)果，如果結(jié)果不滿足用戶預(yù)期，還會(huì)存在短時(shí)間內(nèi)多次輸入與清空的情況。那么，無(wú)論是錯(cuò)字還是對(duì)結(jié)果不滿意，清空按鈕都可以非常便捷地幫助用戶一鍵清除上次輸入的字段，讓用戶更快速地重新輸入新字段，從而提高用戶的操作效率。

于是，我們會(huì)把這類場(chǎng)景下的「清空」說(shuō)成是「一鍵清空」，主要是因?yàn)榉奖?。而它的作用就是?strong style="outline:0px;margin:0px;padding:0px;">在出錯(cuò)的場(chǎng)景下，更快捷地給用戶重置的操作。

反過(guò)來(lái)，各位可能要說(shuō)：那聊天框不滿足這個(gè)條件么？

我們接著看聊天輸入框。

我們知道，聊天輸入框的內(nèi)容不是固定的，它是根據(jù)對(duì)話內(nèi)容而變化的，用戶甚至需要花時(shí)間持續(xù)輸入并糾正自己的用詞，以及話術(shù)的準(zhǔn)確度。過(guò)程中，如果輸入的內(nèi)容多，而且又是即興的，耗費(fèi)的時(shí)間與精力也是很大的，清空后也難以再恢復(fù)。

它不像登錄或搜索，固定的輸個(gè)數(shù)字串或關(guān)鍵詞，它是一段完整內(nèi)容。雖然也會(huì)有某一句話或者某個(gè)詞輸錯(cuò)的情況，但是一鍵清空的操作成本太低，對(duì)應(yīng)著聊天框的高輸入成本，一鍵清空的存在與之并不相符。

于是，這里就引出了一個(gè)概念，叫做「輸入成本」與「修改成本」。

清空按鈕對(duì)應(yīng)的，就是低修改成本，因?yàn)楹?jiǎn)單點(diǎn)擊一下，就清空了。它所適用的場(chǎng)景就是低輸入成本的情況，也就是前面提到的登錄注冊(cè)或搜索 —— 輸入的內(nèi)容相對(duì)固定，且可能反復(fù)。

對(duì)于登錄、搜索等指向性比較明確的輸入框來(lái)說(shuō)，用戶在乎的是輸入和反饋的效率高不高。一鍵清空操作能帶來(lái)效率上的提升，而且操作后帶來(lái)的損失成本是很低的。因此，一鍵清空操作在這個(gè)場(chǎng)景下，對(duì)用戶來(lái)說(shuō)是安全且的。

但是在聊天場(chǎng)景下，一鍵清空作為低修改成本的作用是不適合的，因?yàn)檫@時(shí)候輸入成本比較高。

用戶在聊天輸入框內(nèi)表達(dá)清楚自己的想法是為了讓對(duì)方理解，達(dá)到交流的目的，這樣的內(nèi)容是不確定的。而且在聊天輸入出錯(cuò)情況下，我們有多種操作方式讓用戶重輸，比如鍵盤(pán)快滑定位，觸摸定位錯(cuò)字等，都比一鍵清空重新輸入的成本低很多，而它所謂的「便捷性」在這里意義也就不大了。

于是乎，在衡量輸入框是否需要清空按鈕時(shí)，我們首先要知道，清空按鈕是低修改成本，那么如果輸入框的輸入成本比較低時(shí)，我們就會(huì)使用清空按鈕，來(lái)提高操作效率。而當(dāng)輸入成本比較高時(shí)，一鍵清空的操作就顯得配不上這個(gè)輸入框了。所以，它在聊天框里就沒(méi)有存在的必要了。

包括其他非固定內(nèi)容的輸入框，也是一樣的道理。

接著，延伸出第二個(gè)同學(xué)的問(wèn)題：輸入框超過(guò)限制是禁止用戶繼續(xù)輸入，還是允許超出但會(huì)警告提示？

相信各位讀完上面的，再看這個(gè)問(wèn)題，應(yīng)該也能分析出原因了吧？邏輯跟上面的也差不多。

也看輸入成本，比如是固定內(nèi)容的手機(jī)號(hào)，我們正常會(huì)禁止多余輸入，因?yàn)檫@樣用戶更容易判斷手機(jī)號(hào)是否正確。

如果是短長(zhǎng)文，說(shuō)明用戶可能是手打字超出限制，這時(shí)候如果禁止輸入，用戶不好在輸入框里做內(nèi)容刪減或修改，也會(huì)打斷用戶的輸入流，畢竟還沒(méi)寫(xiě)完就限制了，那得先刪掉前面的，再來(lái)思考后面怎么寫(xiě)，會(huì)亂。而且如果是復(fù)制的，禁止輸入的話，超出部分就被截?cái)嗔?，也要先刪減，再繼續(xù)復(fù)制剩余部分，非常麻煩。除非先在別處刪減到限制字?jǐn)?shù)內(nèi)，再?gòu)?fù)制過(guò)來(lái)，但這樣又增加了用戶的操作成本。

如果允許輸入但警告提醒，那么用戶就可以根據(jù)自己已經(jīng)輸入完的內(nèi)容做刪減修改。

所以對(duì)于這個(gè)問(wèn)題，我們從這個(gè)視角出發(fā)，也能了解一二，就是通過(guò)適用場(chǎng)景與輸入成本來(lái)分析。

當(dāng)然，以上所有內(nèi)容更偏向于通用性說(shuō)明，針對(duì)具體業(yè)務(wù)還需要具體分析。