小圓點(diǎn)有助于分割大段文字，使得復(fù)雜的文章和博客更容易消化，突出關(guān)鍵信息。如何運(yùn)用好無序列表？這篇文章提出了7個注意點(diǎn)。

有時候，最好的信息展現(xiàn)方式就是無序列表。無序列表能吸引注意、便于瀏覽、簡化文本，并且表達(dá)出項目之間的關(guān)系。

網(wǎng)站不是一個適合長篇大論的地方。相比之下，網(wǎng)站的讀者更喜歡文案以某種易于瀏覽的形式組織起來，能讓他們輕松跳過大段文字，直達(dá)自己感興趣的部分。

有許多種網(wǎng)頁文本格式的技巧，能夠分割大段內(nèi)容。無序列表和加粗、縮進(jìn)、行間距、彩色文字，都是輔助網(wǎng)頁內(nèi)容高效閱讀的重要手段。

區(qū)區(qū)幾個小圓點(diǎn)能夠吸引視線，并且讓復(fù)雜的概念易于理解。小圓點(diǎn)能讓讀者感知到內(nèi)容的簡明和重要。這并不奇怪，在可用性研究中，我們觀察到讀者對無序列表滿懷熱情。網(wǎng)頁的讀者希望快速消化內(nèi)容。

我們可以對比下面這兩個版本。你會發(fā)現(xiàn)第2個版本中的內(nèi)容更易閱讀。這是因為它以縱向列表的形式展現(xiàn)。相比之下，在第1個版本中，讀者只能在結(jié)構(gòu)不太清晰的段落中尋找。

版本1：

我們的Spa度假套餐包含了2晚住宿，2次50分鐘的任選spa項目，1頓兩人份的上門早餐，到達(dá)時還有禮品籃相贈。

版本2：

我們的Spa度假套餐包含：

• 2晚住宿
• 2次50分鐘的任選spa項目
• 1頓兩人份的上門早餐
• 到達(dá)時贈送禮品籃

不必?fù)?dān)心版本2占了更大的縱向版面。如果（或者說除非）用戶對內(nèi)容感興趣，隨著視線的下移，他們完全不介意往下滾動。事實(shí)上，相比那些用長篇大論嚇退用戶的網(wǎng)站，恰當(dāng)?shù)厥褂昧藷o序列表的網(wǎng)站，會更加親切易懂，用戶也會更有動力向下滾動。

使用無序列表的7條建議

1. 每一項的長度要比較接近

無序列表在展示相關(guān)內(nèi)容時會達(dá)到最佳效果。其中的每一項都應(yīng)該有同等的重要性。可能的話，讓每一項的長度保持接近，就不會有明顯的主次之分。保持統(tǒng)一的外觀能讓眼睛更舒適，使列表顯得不那么雜亂。

錯誤用法

請帶上以下物品參加露營：

• 睡袋
• 去瀑布徒步旅行時要用到的洗浴套件
• 防曬霜
• 防水夾克應(yīng)對可能的雨天。我們可能會遇到強(qiáng)烈的暴風(fēng)雨

長度上的差異，使得列表項顯得雜亂、不統(tǒng)一。

建議用法

請帶上以下物品參加露營：

• 睡袋
• 洗浴套件
• 防曬霜
• 防水夾克

2. 除非順序很重要，否則不要使用有序列表

有序列表的使用場合，通常是列表項必須按照某個特定順序排列，例如程序步驟?；蛘邤?shù)量很重要時才能使用，比如前十名的榜單。

如果列表項的順序和數(shù)量不重要，那就不需要數(shù)字序號。這么做會使人困惑：我們在用戶研究中發(fā)現(xiàn)，人們會錯誤地認(rèn)為他們必須完成有序列表中的每一項，但其實(shí)他們只需要選擇其中一項即可。

錯誤用法

請通過下列任何一種方式聯(lián)系我們：

1. 在線聯(lián)系登記表
2. 在線聊天
3. 致電
4. 親自上門

這些數(shù)字序號，讓列表項顯得好像是要按照順序步驟來執(zhí)行，而不是幾個獨(dú)立選項。

建議用法

請通過下列任何一種方式聯(lián)系我們：

• 在線聯(lián)系登記表
• 在線聊天
• 致電
• 親自上門

3. 在列表項中使用相似的句子結(jié)構(gòu)

每一項都要有統(tǒng)一的措辭風(fēng)格。多變的措辭影響句子通順，會阻礙讀者閱讀（甚至導(dǎo)致困惑）。

用相同的方式組織每一項。確保無序列表的每一項以相同的語法元素開頭（例如名詞、動詞），要么都是詞組，要么都是完整的句子。

錯誤用法

在公園中請遵守以下規(guī)則：

• 將垃圾投入指定的垃圾桶。
• 巨大噪音會嚇壞動物。
• 應(yīng)該站在黃色的標(biāo)記線區(qū)域。
• 保持公園干凈，人人有責(zé)。

在這個例子中，4條語句都以不同的詞語開頭。

建議用法

在公園中請遵守以下規(guī)則：

• 將垃圾投入指定的垃圾桶。
• 不要發(fā)出巨大噪音。
• 站在黃線區(qū)域內(nèi)。
• 盡量保持公園清潔。

第二個列表的閱讀更順暢，因為每個短語的開頭都用了同一類詞語——本例中是動詞。

4. 避免在每一項開頭重復(fù)相同的詞語

如果可以的話，請省略“一個”、“是”、“這個”這樣的詞語，去掉每一項開頭的重復(fù)詞語。每個列表項開頭的詞語有所區(qū)分，能讓列表更加容易分辨。

錯誤用法

如何挑選菠蘿：

• 用聞的。它聞起來要甜。
• 用按的。它應(yīng)該按下去結(jié)實(shí)但柔軟。
• 用看的。它最好是金黃色。

建議用法

如何挑選菠蘿：

• 聞。它聞起來要甜。
• 按。按下去應(yīng)該結(jié)實(shí)但柔軟。
• 看。最好是金黃色。

5. 使用清晰的、描述性的句子和詞語來說明列表

引語（或者說說無序列表之前的那句話）很重要，因為它讓讀者知道列表的內(nèi)容大概是什么，為什么重要。引語不必是完整的句子，也可以和列表的每一項組合成完整有意義的句子。

錯誤用法

不列顛哥倫比亞省的假期：

• 徒步旅行
• 藝術(shù)博物館
• 在湖上劃獨(dú)木舟

引語（不列顛哥倫比亞的假期）沒有充分描述列表。而且，列表中包含了假期要完成的事項，但藝術(shù)博物館并不是一個動作。

建議用法

我們在不列顛哥倫比亞省的假期行程包括：

• 上山徒步旅行
• 參觀藝術(shù)博物館
• 在湖上劃獨(dú)木舟

6. 保持格式一致

關(guān)于大小寫和標(biāo)點(diǎn)有一些基本準(zhǔn)則：

• 如果列表項是句子，那么每一項的首字母就要大寫，并且以句號結(jié)尾。
• 如果列表項是詞組，不需要任何標(biāo)點(diǎn)結(jié)尾，也不是一定要首字母大寫。但是我們還是建議首字母大寫，這樣更易于瀏覽。

錯誤用法

如果發(fā)現(xiàn)霸凌行為：

• 支持受害者
• 將事情告知成年人
• 鼓勵受害者向成年人反映
• 通過表示關(guān)心來提供幫助

這些句子沒有首字母大寫【譯者注：當(dāng)然中文沒這個問題】，而且結(jié)尾沒有標(biāo)點(diǎn)。

建議用法

如果發(fā)現(xiàn)霸凌行為：

• 支持受害者。
• 將事情告知成年人。
• 鼓勵受害者向成年人反映。
• 通過表示關(guān)心來提供幫助。

錯誤用法

你可以通過____來保護(hù)環(huán)境：

• 回收紙張和塑料產(chǎn)品。
• 少用一次性物品。
• 捐贈舊衣服和閑置物品。
• 騎車與步行替代開車。

列表項是詞組，因此不需要標(biāo)點(diǎn)符號結(jié)尾。

建議用法

你可以通過____來保護(hù)環(huán)境：

• 可回收紙張和塑料產(chǎn)品
• 少用一次性物品
• 捐贈舊衣服和閑置物品
• 騎車與步行替代開車

7. 不要濫用無序列表，會導(dǎo)致它們喪失效果

就像所有的視覺設(shè)計技巧一樣，過度使用都是有害的。如果看到滿是小圓點(diǎn)和縮進(jìn)的頁面，你會嚇傻的。明智地選擇需要強(qiáng)調(diào)的內(nèi)容。（如果你沒發(fā)現(xiàn)本文中的無序列表是前后對比的案例，你就會覺得有點(diǎn)使用過頭了。）

在有3項或更多重要信息時，縱向列表是最好的展示方式。如果項目更少，那就殺雞用牛刀了，直接放在句子中通常效果更好。

避免嵌套使用列表，這樣就很難理解了。如果一定要表現(xiàn)多層級的列表，每一級都要用不同樣式的小圓點(diǎn)。

注意：這些只是一般規(guī)范。但是每個公司或組織可能會采用不同的格式。如果你的公司在遵循某套風(fēng)格指南，你應(yīng)該先了解指南，然后才決定是否遵循以上規(guī)范。文案撰寫有一個重要的方面，就是在整個文檔和網(wǎng)頁中保持內(nèi)容統(tǒng)一格式。

結(jié)論

縱向列表吸引視線，能使列表每一項各自獨(dú)立。因此，它比行內(nèi)的列表更有效，能讓人更有效地瀏覽、參考和理解關(guān)鍵要點(diǎn)。

原文作者：HOA LORANGER

原文地址：https://www.nngroup.com/articles/presenting-bulleted-lists/

#專欄作家#

可樂橙，微信公眾號：可樂橙（colachangreen）。人人都是產(chǎn)品經(jīng)理專欄作家，UI/UX設(shè)計師，關(guān)注互聯(lián)網(wǎng)，關(guān)注科技?，F(xiàn)居杭州，與小伙伴們正在創(chuàng)業(yè)途中?；蛟S不是一名優(yōu)秀的設(shè)計師，至少是個快樂的設(shè)計師。

本文翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，不得轉(zhuǎn)載。