網(wǎng)站的頁面設計是讓人掃貓的,不是閱疆的!
建立清楚的網(wǎng)站視覺階層
設計的網(wǎng)站頁面要易于在一瞬間看清楚,就必須讓頁面上的每一樣東西外觀的視覺表現(xiàn)都能簡潔表達,并傳達出頁面上每一件東西之間的關系:
哪些東西有關系,哪些東西屬于其他事物的一部份。換句話說,每一頁都應該要有清楚的視覺階層。
有清楚視覺階層的頁面,會有三種不同的特征:
越重要的東西,就應該要越明顯。例如,最重要的標題,若非放大,就是 要加粗、使用不同顏色、多留些空白面積,或者放在頁面頂端一也可以將 上述方法組合使用。
視覺上的「巢狀」階層,顯示事物屬于哪一部份。
例如,小標就應該放在某本此類書籍的書名之上,在視覺上包圍整個頁面的內容,因為這本書是屬于這類書籍。在書名底下,接著加入敘述該書的內容。
「視覺階層」并不是什么新玩意兒。例如報紙上的每一頁,都使用了凸顯、分 組與巢狀架構,讓我們還沒讀進任何一個字,便能先了解關于這一頁內容的 有用資訊。這張照片和這篇報導是在一起的,因為他們都放在這個標題底 下。這段報導最重要,因為標題字體最大、欄位最寬,也占用了頁面上最顯 著的位置。
我們每天都要解讀各種視覺階層一在網(wǎng)站上或者紙上,但是這個過程實在太快了,所以我們只有在無法一眼了解的情況下,才會去被迫思考。
良好的視覺階層,可以為我們預先處理網(wǎng)站頁面,節(jié)省我們的心力,還可以將內 容管理排序,讓我們能夠立即了解。
但是當頁面上并沒有清楚的視覺階層一例如每一件東西看起來都一樣重要, 那我們必須改用較慢的步驟,開始掃瞄頁面、解讀文字,并嘗試以自己的方 式來判斷內容的重要性與組織方式。這就費事多了。
此外,我們在網(wǎng)站上也希望能和其他媒體一樣有編輯準則。出版商比任何人 都知道網(wǎng)站內容中什么東西最重要、最有價值或者最受歡迎,所以何不把這 些東西標示出來,幫我們省去麻煩?
解讀視覺結構有瑕疵的頁面時一例如標題下的東西并不屬于同一篇文章,就 像是閱讀一個沒寫好的句子廣他扶著桌子站立,因為腳不太穩(wěn)」)。
即使我們通常可以猜出這個句子的意義,但我們仍然會暫時感到疑惑,迫使我們作非必要的思考。