與用戶進(jìn)行交流

      通過拼接不同的信息碎片,不用任何的交流信息來說明，UI就可以在用戶頭腦中形成一個信息鏈。看看流行的設(shè)計網(wǎng)站Abduzeedo是怎么設(shè)計的：頭部是占一大塊區(qū)域的分類信息，特色內(nèi)容在中間部分，細(xì)小分類則在頁腳部分。

      不要錯誤地把你的網(wǎng)站僅僅當(dāng)做一個呆板的工具。網(wǎng)站也能與用戶建立情感上的聯(lián)系，如果你不這樣做，你的競爭可是會的。事實上，如果你做出一個有積極情感的網(wǎng)站，用戶更容易原諒你界面上的缺陷。MailChimp就是一個完美的例子，它的界面使用起來令人心情愉悅，使用起來更是一種享受。

      人的視覺具有傾向性

      有時，似乎你的眼睛也有他們自己的思想。經(jīng)過多年的進(jìn)化，眼睛有了發(fā)現(xiàn)我們認(rèn)為重要的對象和動作的能力，不管是某個人以性感的身姿穿過馬路或是可愛的卡通熊的蜂蜜廣告都能吸引我們的注意。當(dāng)然在每個人心中所謂的“重要性”是不一樣的，因人而異，唯一不變的是他們的行為傾向。通常在瀏覽一個網(wǎng)頁時大部分人的行為傾向是一樣的。

      所謂“行為傾向”有兩個，我們將詳細(xì)討論。99Designs作家Alex Bigman的文章《6principles of visual hierarchy for designers》展示了那些有從左往右閱讀習(xí)慣的用戶群，當(dāng)設(shè)計一個網(wǎng)站布局時有兩個非常通用和有效的設(shè)計模式。

      第一是F-模式，常用于文本（當(dāng)然也可以用于其它用途）。第二是Z-模式，可用于任何視覺布局。我們將在下面分別解釋他們各自的優(yōu)點和缺點。

      F-模式

      F-模式的頁面往往包含大量文本，比如博客、新聞資訊、文章等站點頁面。

      當(dāng)面對成段的大量文字信息的時候，大多數(shù)讀者會縱向地先瀏覽每段左邊的文本，特別是在段落開始的幾個句子中尋找關(guān)鍵詞或者他們的興趣點。最終讀者找到他們喜歡的東西,再開始正常地橫向閱讀。最終的結(jié)果是看起來像字母F或E。

      Nielson Norman團(tuán)隊中的Jakob Nielson發(fā)起了一個基于232人瀏覽成千上萬個網(wǎng)站可讀性研究。通過他的研究，他記錄了他認(rèn)為的“F-模式”的實際意義：

      用戶很少會認(rèn)真地讀文本的每一個字；前兩個段落是最重要的，它應(yīng)該包含你的要點；

      但F型并不是一個定式——沒有事實說明它是最好的，但更像是由大部分用戶的行為習(xí)慣而總結(jié)出來的一些松散的規(guī)律。請牢記這一點，因為F-模式在開始幾行后就失去了它的有效性。

      Kickstarter使用一張卡片來展示特色項目，這使得用戶不會在瀏覽完開始的500像素后就變得視覺疲勞。

      另一方面，iZettle在主頁上采用了一種更傳統(tǒng)、遵循F-模式的方法。不管怎樣，它通過在背景圖片的上層疊加主文本（使用iZettle來增長您的業(yè)務(wù)）和“用戶行為號召”來設(shè)法避免過于模板化的外觀。我們認(rèn)為這是適應(yīng)這種閱讀模式最基本簡潔的方法。

       Z-模式

      此外，Z-模式是最簡單、最通用的模式,普遍用于任何基于文本的網(wǎng)頁。讀者首先橫向的瀏覽頂部，接著回到左邊，然后再橫向地瀏覽整個底部。

      理解通用的Z-模式很重要，因為它解決了網(wǎng)站的核心需求：層次結(jié)構(gòu)、品牌化和用戶行為號召。它的美在于既簡單又具有“用戶號召”型網(wǎng)站的理想布局。當(dāng)然，對于更復(fù)雜的或包含大量內(nèi)容的網(wǎng)站，Z-模式可能過于簡單。

      考慮一下Z-模式是否適合你的網(wǎng)站？下面有一些最佳實踐可以更好的優(yōu)化該模式:

      背景：保持背景在它應(yīng)該處于的位置：隱蔽在內(nèi)容之下。不讓它分散讀者的注意力。

      要點1：作為第一個要點，將Logo放置在固定位置。

      要點2：雖然主要的用戶號召應(yīng)該放在后面，這對二級用戶號召來說是一個好位置，可強調(diào)或突出導(dǎo)航條（一個漂亮的圖形或圖像滑塊將有助于分割頁面的頂部和底部，鼓勵讀者按照Z模式所期待的方式來瀏覽）。

      要點3：選取最佳位置來吸引讀者對其它鏈接的注意，或者吸引讀者的目光到網(wǎng)站的最終目標(biāo)：要點4。

      要點4——作為“終點”，這是一個完美的放置主要用戶號召的地方。

      首先你需要做的是把頁面上的元素按照重要性進(jìn)行排序。然后，從結(jié)果中挑選出適當(dāng)?shù)摹盁狳c”就會變得很簡單。

      此外，Z-模式可以重復(fù)和擴展到整個頁面。我們來看看Evernote是如何按“之”字型向下放置他們的“用戶號召”和賣點的。

      DropBox沒有使用任何背景圖片，很簡單地實現(xiàn)了這種“曲折”的模式。相反的，更多功能型的設(shè)計內(nèi)置在了布局中，比如用戶號召“瀏覽更多”，當(dāng)用戶瀏覽整個網(wǎng)頁時，它幫助用戶鏈接進(jìn)入每一板塊的細(xì)節(jié)部分。這也有助于通知讀者點擊到下一個相關(guān)頁面，而不需要先去通讀頁面所有內(nèi)容。

      設(shè)計趨勢預(yù)測

      能敏銳地把握細(xì)節(jié)，對任何頁面布局來說都是一個優(yōu)勢。這些模式可以讓用戶感覺是為他們提供一些相關(guān)建議，而不是強迫他們接受。