DIV CSS 佈局教程網

以前經常吃公司旁邊的食堂，人多，排隊。夏天的時候，我們總要找一個靠窗口通風好的地方坐，沒有空調只有風扇，風扇很多，開關都集中在一個地方，應該是方便操作人員統一管理，有時自己頭上的風扇沒開，當我要去開這個風扇時，麻煩來了，很多排的風扇開關，到底哪個是我頭上的呢？

生活中有很多總讓我們感覺莫名其妙，或者停下來需要思考的情況，有時不得不求助，到了互聯網上，可能很多情況發生了也沒什麼求助的方法，只能自己猜，不猜了就只好關掉。

網頁上每項內容都有可能迫使我們停下來，進行不必要的思考。比如內容信息看不懂，操作功能不明確。例如，文案。常見的罪魁禍首是那些很酷或者自以為很聰明的名字、帶有營銷傾向的名字、和具體公司有關的名字以及生僻的技術名詞。（Don’t Make Me Think第一章）

當我們訪問Web的時候，每個問號（讓用戶不明白的地方）都會加重我們的認知負擔，把我們的注意力從要完成的任務上拉開。這種干擾也許很輕微，但它們會累積起來， 有時候這樣的干擾不用太多，就足以讓我們抓狂。況且，人們通常不喜歡苦苦思索背後的原理。建造網站的人沒有讓它們明白易懂（而且容易使用）會讓我們對這個網站以及網站的發布者失去信心。
按用戶心智模型去設計產品，下面列出一大堆訪問者在訪問網站時不應該花時間思考的事，例如：

• 我在什麼位置？

• 我該從哪裡開始？

• 他們把××放在什麼地方了？

• 這個頁面上最重要的是什麼？

• 為什麼他們給它取這個名字？
不讓用戶思考過多，原則上就是設計符合用戶心智模型。大致可以從下面幾個方面來講：

1文案：需要讓人容易理解，快速記憶。根據不同產品定位，找到恰當的切入點，文案過長或者使用用戶不理解的情景，如技術用詞，營銷用詞等，都會使人不知所雲。

省略多余的文案，比如過分修飾，歡迎語，多余指示性語句，這些羅嗦的詞語會影響用戶對關鍵信息的閱讀理解和判斷，必須干掉。

2圖形：好的圖形表達是優於文字的，但是圖形沒有把內容表示明確，反而適得其反，給用戶造成理解上的困擾。

很多情況下，我們好像都很喜歡做一些很炫的icon來表達某些內容，這些是會起到吸引性，但要記住一點，你的圖形是不是很好的闡釋了內容，如果做不到，那就去掉吧。不如放大標題來的更好。
每個網站需要有它的獨特性來吸引用戶，但表達這些獨特性的元素，例如圖形，一定不能對用戶理解內容產生干擾。很重要的一點，我們設計是要表達什麼，為了什麼，怎樣更好的幫助用戶來理解這些表達，是我們一定要做到的。
網站不是炫技場，設計要為內容服務。

3信息：信息其實是文案、圖形等形式的混合體。信息之間，是否建立了相應的關聯度，不相關聯的信息之間是否產生了干擾。

大量的信息是否進行了合理的分類，以減輕用戶的尋找時間。信息分類處理上，有個深廣度問題，廣度站點因為層級少，可以讓用戶不需要點擊過多就可以到達底層；深度站點需要點擊更多次，但它在每一層次上可以做到讓人的思考最小化。關於信息的深廣度，詳細見這裡。
所以，有效合理的信息分類可以幫助用戶快速准確浏覽和完成任務。

4引導：通過菜單，導航，面包屑等手段有效引導用戶行為路徑，讓用戶方便去他想去的地方，回他想回的地方。

在路邊，我們希望有路牌指示；在雜志上，我們希望前面有目錄，在每頁我們還希望有頁碼，在網站設計中，我們引導好用戶需要浏覽的內容；在用戶需要的時候給予網站工具來方便完成任務，在這點上，很多時候我們總是希望上新功能，把功能做的突出，殊不知用戶是不是也這樣想，他到底在這裡需要什麼。

5操作方式：充分順應用戶的心理思維，來設計功能的操作，可以使用戶快速上手。

汽車方向盤往左打，汽車就往左開；插排電源按下去燈亮；相關內容旁邊放置相關操作，操作尖頭朝下說明有下拉內容，等等。這些操作方式都是要符合用戶心智模型的。

6一致性：設計在同產品（甚至同類產品）中保持一致性，可以大大降低用戶理解成本，使用戶快速上手，增加用戶的使用率。

這裡的一致性包括顏色，形狀，內容，操作方式。比如紅綠燈如果各地都不一樣，外地人來了豈不會導致交通混亂。同一個網站也應該有這樣的一致性，有些都可以保持行業的一致性，比如頁面上使用一樣的翻頁等，既可以降低制作成本，又對用戶的使用有良好的認知幫助。到一定程度，也會提升一個品牌的認知，比如阿迪達斯到處使用的三道槓。

下面看個例子：這個是某期寶貝傳奇的宣傳頁面，進來以後甚是讓人看不懂！沒有很好的根據用戶心裡預知和相關內容的合理放置來設計。這只是一個活動，如果是一個長期產品，用戶接受程度可想而知。

我們都知道別讓我思考最經典的頁面是google首頁：logo起到網站認知作用，搜索框緊跟logo並最大化使其最容易被使用，其他信息按歸類放置，並根據等級高低依次減弱。雖然大多產品都有其他商業性需求考慮，但設計師不能被這些沖昏頭腦，機械性的表現內容。多花心思把繁雜信息理清楚，要知道，設計師都不是很清楚信息的關系，用戶就更不會明白。