功能前面的小圖標有什麼用，和沒有這些圖標相比有什麼不同？

01-29

單色圖標在文字前最主要的作用是以區隔為手段（手段），協助用戶視覺定位（目的）

你眼睛看到的是這個

但實際上人腦對視覺的認識是基於模式(pattern)的，所以在你腦中建立的印象其實是類似於這樣的

主要是在橫排時，

豎排情況下區隔作用的需求就不大。彩色圖標的色彩則還有「表性」、分類的作用

題主舉例的這幾個設計，要分開來分析：

1. 先看「問題功能按鈕」：

這一排圖標都採用了約定俗成的圖標形狀來表示按鈕功能。除了最後一個由「Flag」引申到「沒有幫助」，可能要非英語為母語的瀏覽者稍微繞個圈子，其它都體現了各自圖標通用的含義。這樣做的好處是，對於這一排小字，用戶不需要讀完 Label ，就能迅速反應出自己該點哪個按鈕。
除了表意功能，圖標在這裡還起到了視覺分割的作用。由於按鈕是水平排列的，如果不使用圖標，也需要使用分割線或加大間距等設計方法，使每一個文字按鈕與旁邊的區分開。

2. 「分享組建」和「修改按鈕」也可以採用類似的分析，比較特殊的一點是：

分享組建的排列是蠻有講究的。排序應該體現了設計師對用戶分享途徑的重視程度，所以我們假設這個順序最好不要改變。單獨「微博」兩個字存在一定歧義，雖然 http://weibo.com 是某浪家的，但是咱們也要體諒使用其它微博的用戶，所以「微博」前面的大眼睛圖標就起到了很重要的消除歧義的作用。那為什麼不改成純文字的「新浪微博」呢？這樣就產生了字數分別為 4，2，4 的文字塊，看起來有點糾結，所以還是採取了用圖標表意的方案。

（以上純屬個人YY，非常事後諸葛亮，知乎設計師見諒……）

3. 最後到縱向的這一列首頁的「導航組建」：

個人認為這一列圖標，在提高用戶認知上的作用是最低的。

除了「我的收藏」使用了約定俗成的「書籤」圖標，「邀請」使用了加好友的圖標，其他的圖標或多或少存在一定學習成本。尤其是「我的草稿」和「我關注的問題」在其他語境下更通常表示「新建文件」和「待辦事項」。
縱向的導航菜單，不需要像橫向列表那樣需要特別的區隔。我揣測，即使去掉這列圖標，瀏覽者獲知鏈接功能的速度也不會收到太大影響。
這個導航中用到的圖標，在整個網站中極少重複出現（除了收藏），因此也沒有讓用戶留下特別深刻的印象。

但是，整體看首頁，發現整個右邊欄的列表結構都是「[圖片] + 文字」。這裡，為導航設計圖標或許是為了取得視覺的統一感？好吧，這種純粹耍嘴皮子的事後諸葛亮很沒意思，要是不放圖標也能解釋成「視覺上變化帶來呼吸感啦、突出視覺重點啦」之類的。所以動手做個圖對比下：

看著哪個舒服？如果還是不能決定，並且一定要糾結這個問題的話，乾脆做個 A/B 測試吧。看看去掉圖標後，首頁的跳出率有沒有顯著增加，導航這幾個頁面的訪問有沒有顯著降低。因為這個問題已經超出個人對細節的糾結能決定的範圍了。P.S. 非常抱歉，剛剛發現左側截圖中，導航的分割線被抹掉了。

亂七八糟亂起八糟亂七八糟亂起八糟

方便用戶快速定位

亂七八糟亂起八糟
亂七八糟亂起八糟

亂七八糟亂起八糟亂七八糟亂起八糟

所以題主喜歡這樣的？

方便識別。

一般來說人們對圖形、顏色、方位等信息的識別速度度高於文字內容。

對於一個新用戶，當用戶剛開始使用這個功能的時候會去讀文字。

但當用戶已經很熟悉這個功能的時候，你會把文字及其對應的視覺元素建立關聯，在很熟悉之後就不需要讀文字了，只需要掃一眼，瞄到圖形對應的按鈕就點擊了。

這可能是很多人都沒意識到的現象。

類似的做法應用其實很廣。比如當你第一次用淘寶購物的時候，肯定是看了按鈕上的文字才決定點哪一個的。但當你熟悉了之後，會略過看文字這一環節，直接想著「左邊購買，右邊購物車」「咖啡色購買，紅色購物車」就去點擊了。

贊同圖形更加吸引注意力的觀點，所以圖標使用要更慎重，因為簡單的圖形並不容易表達含義複雜的複合詞語，所以圖標使用不當更容易適得其反，對用戶視線產生干擾影響效率。解決這種橫嚮導航的劃分問題，圖形能夠直觀快速的表現功能時自然要比單純文字更加易於定位接受，如果圖標無法做到這一點，那麼他在這裡就沒有存在的價值，寧可使用顏色甚至基本的幾何圖形點線來分割引導也要比引起歧義來的要好

你看到文字並解意的速度，比看到圖標解意的速度要慢。

但是，在你剛接觸圖標時，很難快速理解並記住圖標的意義。

所以在使用一段時間後，就可以做到只看圖標不看後面的文字來識別其功能。

這樣就起到了提高使用效率和使用舒適度的作用。

因為好看。

我覺得吧，造成這一困惑的原因是——

知乎的功能圖標太不顯眼了！

應該做得更醒目、更飽滿！
另外，首頁的這些功能，也可以橫排的呀——

在這個設想中，圖標應該變大佔據主體，Badge 就在圖標角上，而文字則是輔助信息

圖文並茂，更容易理解。對於新用戶來說看了圖標可能不懂什麼意思，結合文字一起理解，對於老用戶來說很多時候不用看文字，看圖標就知道是什麼意思了，比如郵件圖標。

其次，如果把圖標去掉，頁面看起來會枯燥很多。

圖形比文字更容易入眼，也更容易入腦

同一種東西從不同設計師出來之後會有不同的名字，留言、站內信、私信、豆郵……管他什麼名字呢，一個圖標擺平

個人感覺，其實只要字體、顏色排的漂亮，不用問題也不大。

用PPT或者WORD中就有針對每一段話前都帶一個數字，字母，或者符號，表示分段區隔之意，我覺得問題中的小符號同樣也是「分段區隔」的意思，也就是說表明：「到這裡是一個不同/相同的部分」。

而不同的內容或者功能就對應不同的小符號，與其說是為了識別功能是什麼，不如說是為了美觀的間隔各個功能模塊，形成一個「此處是個單獨的模塊，有可以點擊的功能」的提示，至於符號本身只要簡潔美觀即可，到底是什麼其實差異倒不大。譬如把每個答案下面的「分享」和「沒有幫助」按鈕前面的小符號對換一下，其實大多數人還是不會特別在意的。

也就是說，所謂的小符號，其實是一個按鈕的變相顯示，我們識別一個功能的時候需要在邊界上做出範圍來明確「這裡可以點擊」。譬如傳統的按鈕「發布答案」

而如果每個答案下面都放一排按鈕就太不好看了，也形成臃腫的感覺，於是改用了文字，但為了表明這是一個可以點擊的功能鍵，所以加上了小符號起到區隔的作用。使人直接意識到「這裡可以點擊」。同時又比較美觀。

聽說過「圖文並茂」嗎?

而非「文圖並茂」！

其實設計有時候就那麼點事