標(biāo)題文案溢出使用「…」合理嗎？來(lái)看高手的分析！

討論一個(gè)比較常見(jiàn)的問(wèn)題。

讀者：

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

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

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

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

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

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

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

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

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

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

因?yàn)檫@類(lèi)產(chǎn)品的目的就是讓用戶(hù)讀到完整的標(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)類(lèi)產(chǎn)品。

比較典型的還有 TED 演講視頻的標(biāo)題，在《設(shè)計(jì)體系》這本書(shū)里專(zhuān)門(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)嗍呛苋菀椎模y的是把一個(gè)演講主題提煉成一句簡(jiǎn)短句子，所以他們?yōu)榱苏故靖逦臉?biāo)題，寧可在界面上保留長(zhǎng)標(biāo)題，甚至為長(zhǎng)標(biāo)題的顯示而專(zhuān)門(mén)設(shè)計(jì)相符合的展示形式。

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

包括一些資訊類(lèi)產(chǎn)品，在標(biāo)題上也會(huì)做限制，以滿(mǎn)足最大化呈現(xiàn)且不使用省略號(hào)。意思是：假設(shè)界面上文案范圍定了 30 個(gè)字符，那么配置的時(shí)候就必須 30 個(gè)字符以?xún)?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ì)這類(lèi)產(chǎn)品功能時(shí)，也要注意到這一點(diǎn)，而不是隨意說(shuō)一個(gè)「字符不能超過(guò) 50 吧」。

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

這類(lèi)形式一般出現(xiàn)在營(yíng)銷(xiāo)號(hào)發(fā)的文章里，多是營(yíng)銷(xiāo)人員自己為了文章點(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ò)這類(lèi)內(nèi)容的設(shè)計(jì)已經(jīng)讓用戶(hù)開(kāi)始反感，所以如果不是特殊情況，最好少這樣去做。

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

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

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

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

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

比如下圖：

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

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

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

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

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

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

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

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

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

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

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

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

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

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

歡迎關(guān)注作者的微信公眾號(hào)：「呆呆U理」