常態(tài)：元素在頁面上始終顯示；
暫態(tài)：元素需要鼠標(biāo)懸浮，點(diǎn)擊，或者聚焦等事件，才能觸發(fā)其顯示；當(dāng)事件發(fā)生改變時(shí)，比如鼠標(biāo)移出或者焦點(diǎn)消失，則元素可以再次隱藏；

生活中的人們不斷地遇到這樣那樣的問題，然后就會(huì)萌生各種各樣的感覺，比如“為什么不告訴我”，“現(xiàn)在應(yīng)該怎么做”，或者“原來是這樣，我以前不知道的”，繼而還有“我已經(jīng)知道了，你都說了很多遍了”等等。這些感覺都表達(dá)了一個(gè)意愿，那就是大家希望生活能變得更加簡單，讓所有的問題都不再成為問題。
問題產(chǎn)生根源于兩類，一類是因?yàn)樾畔⒉粚ΨQ造成的，例如不知在哪里購買演唱會(huì)的門票；另一類是因?yàn)槭录旧淼拿?，例如同樣的現(xiàn)金在支付演唱會(huì)門票后，可能就沒有足夠的余額購買手機(jī)了。本文討論頁面元素表達(dá)形式，主要圍繞信息不對稱這部分原因，分析如何讓頁面元素以恰到好處的形態(tài)展示出來，使用戶了解網(wǎng)站的用意，達(dá)到信息對稱，消除疑惑的目的。
其實(shí)讓信息對稱最簡單的方法是復(fù)制，遺憾的是人腦即使通電也沒法變成電腦，所以溝通成為唯一的方式，語言是人與人的溝通方式，網(wǎng)頁便是服務(wù)器與用戶的溝通方式。
我們切入主題——怎樣的溝通能夠讓信息對稱？

一. 哪些東西總是需要的——從工具和材料說起

上圖中，幾位廚師在烹飪不同的菜肴，所有的材料都擺在了臺(tái)子上，沒人會(huì)問醬油在哪里，蔥花有備用么？甚至刷把和各種瓢鏟，都放在人眼所及的地方，也許這便是生活中的“所見即所得”？
推論一：需要完成任務(wù)，就提供充分的工具和材料。

【頁面分析】
一直困惑于善用網(wǎng)站搜索條件篩選的用戶太少，也把原因100%歸咎于條件篩選操作太復(fù)雜，用戶門檻高，但通過istockphoto網(wǎng)站，發(fā)現(xiàn)了另外一個(gè)原因：工具在開始任務(wù)之前就提供，也許更加有效：

繼續(xù)深入istockphoto這個(gè)網(wǎng)站，在導(dǎo)航區(qū)域有了疑惑：到底哪些是執(zhí)行動(dòng)作的工具，哪些是進(jìn)行條件選擇的工具？。看來在同一區(qū)域，執(zhí)行動(dòng)作的工具越多，用戶理解起來就會(huì)越困難。

當(dāng)瀏覽到搜索列表主體時(shí)，發(fā)現(xiàn)每個(gè)單元都是“圖片+icon+編號(hào)”的形式，卻奇怪地發(fā)現(xiàn)點(diǎn)擊圖片，或者編號(hào)，或者相機(jī)icon，進(jìn)到的頁面都是同一個(gè)圖片詳情頁面，殊途同路，用戶意料之外的事情就不是太好的結(jié)果。

【交互建議】1. 工具最好是常態(tài)的，且在開始任務(wù)之前提供，而不是完成任務(wù)之后再提供；
2. 過多的工具以常態(tài)顯示，對于用戶來講就不易理解了，按邏輯和條件進(jìn)行梳理是非常重要的。
3. 作為常態(tài)顯示的材料需要具備單一性，不同的材料應(yīng)有不同的用途，盡量減少不同樣式的元素用于同一目的。

二. 重要的東西，也不要太嘮叨——關(guān)于提示，狀態(tài)和結(jié)果：

這是片場必須使用的道具，開拍和結(jié)束，總會(huì)有那么“咔咔”的兩下。但也就僅此兩下而已，它的出場機(jī)會(huì)并不多。提醒固然重要，卻并不代表時(shí)時(shí)刻刻的提醒都是必要的。

推論二：提醒也許是有用的，但時(shí)刻提醒卻讓人厭倦。
【頁面分析】
拿比較經(jīng)典的yahoo注冊作為例子：

上圖展示的網(wǎng)頁，當(dāng)鼠標(biāo)焦點(diǎn)聚在具體某一項(xiàng)表單時(shí)，才會(huì)展示這一項(xiàng)的填寫說明，當(dāng)焦點(diǎn)移開，說明又會(huì)消失。
這種說明性質(zhì)的提醒并不表示狀態(tài)和結(jié)果，只是一種幫助信息。

上圖為填寫格式不正確和正確的表現(xiàn)：只有當(dāng)填寫不正確的時(shí)候，才會(huì)出現(xiàn)紅色警示，而填寫正確時(shí)，不會(huì)出現(xiàn)任何的提示來打斷用戶。（記得以前yahoo的做法是填寫格式正確，就出現(xiàn)一個(gè)綠色的小勾，然后慢慢消失掉?？磥磉@里yahoo覺得用小勾漸隱都打擾到了用戶，既然填寫正確，干脆就不用任何東西去干擾用戶了。）

再拿一個(gè)簡單的登錄作為例子：提醒用戶賬號(hào)密碼錯(cuò)誤是必須的，因?yàn)檫@個(gè)結(jié)果會(huì)造成用戶無法進(jìn)行下一步操作。但提醒就是提醒，把提醒變成操作，需要去“確定”，總會(huì)給人畫蛇添足的感覺。
那么有沒有需要“畫蛇添足”的情形呢？是有的，比如不可逆操作的二次確認(rèn)，在這種情況下會(huì)犧牲易用性來達(dá)到操作穩(wěn)定可控的目的。

【交互建議】
1. 幫助性質(zhì)的提醒應(yīng)是暫態(tài)的：盡量在用戶操作的同時(shí)出現(xiàn)，避免影響頁面主體元素；
2. 對后續(xù)操作產(chǎn)生影響的結(jié)果：顯示出來；對后續(xù)操作不會(huì)產(chǎn)生影響的結(jié)果：可以忽略；
3. 對于結(jié)果，永遠(yuǎn)不會(huì)有“選擇”這種情形：結(jié)果是不需要用戶“確定”的，所有的“確定”和“取消”，在產(chǎn)生結(jié)果之前才有意義；

三. 人類天生會(huì)關(guān)聯(lián)和引申——物品的操作與屬性

當(dāng)深圳東門的優(yōu)衣庫實(shí)體店開張時(shí)，饒有興致地去逛了。驚奇于那么大一個(gè)門面店，卻只有3名工作人員。仔細(xì)觀察，發(fā)現(xiàn)優(yōu)衣庫對這種經(jīng)營模式很自信，源于優(yōu)化了商品陳列方式，所以將員工數(shù)量減少到比超市還少：雖然懸掛的只是少量樣品，卻能讓買家找到不同顏色，不同尺碼，不同質(zhì)地的相關(guān)商品。優(yōu)衣庫將相關(guān)商品折疊，打包陳列在樣品的周圍，買家可以通過標(biāo)簽找到合適的尺碼，再將他們?nèi)〕?，展開，進(jìn)一步觀察。
想想，如果將這些服裝全都如同樣品一樣懸掛起來，不僅會(huì)占用大量空間，買家的尋找的過程也比較吃力。

推論三：做到信息對稱，需要善用人類與生俱來的關(guān)聯(lián)和引申能力。

【頁面分析】
針對郵件，gmail有很多種操作，將主要的操作放出，使用較少的操作隱藏，是比較常用的方法：

在hulu，視頻單元顯示的都是標(biāo)題，圖片，頻道等一些視頻關(guān)聯(lián)的屬性，這些屬性與視頻播放的內(nèi)容有關(guān)，會(huì)讓用戶知曉是否初步感興趣。而當(dāng)鼠標(biāo)懸浮的時(shí)候，會(huì)詳細(xì)列出視頻的長度，時(shí)間，用戶評分等，這些額外的屬性，會(huì)讓用戶進(jìn)一步明確：是否真的需要點(diǎn)擊這個(gè)視頻？

再來看看樂天，cjmall等站點(diǎn)中的商品形態(tài)，很詫異并沒有太多的操作按鈕，例如“查看詳情”和“購買”，比如下圖左上角的toysrus，寧愿用大量的空間去表現(xiàn)核心屬性和關(guān)聯(lián)屬性，卻沒有一個(gè)操作按鈕。

【交互建議】
1.常用的操作建議直接展示（常態(tài)），不常用的可以通過鼠標(biāo)事件觸發(fā)顯示（暫態(tài)）；
2.物品的核心屬性（物品是什么）需要展示（常態(tài)），關(guān)聯(lián)屬性（物品怎么樣）可以通過鼠標(biāo)事件觸發(fā)顯示（暫態(tài)）。
3.物品的核心屬性比操作更為重要，因?yàn)槲脩舻氖俏锲繁旧?，而不是操作按鈕。所以屬性一定要是常態(tài)，而操作可以為暫態(tài)。

綜述

頁面的元素雖然紛繁復(fù)雜，但我們可以將其表現(xiàn)形式歸納為常態(tài)，暫態(tài)。工具和材料性質(zhì)的元素最好在頁面以常態(tài)顯示，用來幫助用戶輕松地完成任務(wù)；幫助和提示在動(dòng)作進(jìn)行中以暫態(tài)出現(xiàn)，可以及時(shí)提供給用戶充足的信息以便避免出錯(cuò)；結(jié)果如會(huì)影響到后續(xù)操作，則應(yīng)以暫態(tài)提醒和強(qiáng)調(diào)，若不會(huì)影響到后續(xù)操作，就可以忽略；物品的“屬性”比“操作”更為重要，因?yàn)槲脩舻氖俏锲繁旧?，因物品的“屬性”才能引發(fā)對物品的“操作”，所以物品的“屬性”更多以常態(tài)顯示，“操作”的自由度則更大，以常態(tài)和暫態(tài)顯示均不會(huì)造成大的問題。

原文：http://www.xso.name/blog/2010/05/expression/