資訊歸類,提高版面的閱讀性

 

許多人在安排版面資訊時常常會發生的錯誤就是,常常誤認為版面上的每一項資訊都很重要,而每一個資訊都擺放在使用者很容易閱讀到的位置、賦予相同的視覺強度。

但其實使用者是無法同時間接收太多各種不同的資訊的,在無法為版面上的資訊安排其重要性的情況下,最後反而讓版面的閱讀性大打折扣。

以下我們都將在每項資訊的「視覺強度」都相同的前提下來、來討論資訊擺放位置跟閱讀性的關係。如下圖左,我們將資訊位置分散擺放,雖然整體畫面較有均衡感,但是四筆資訊沒有區分出重要性,甚至使用者在閱讀的時候會無所適從,不知道該從哪一筆資訊開始讀起。而當我們歸納出版面上最重要的資訊,並將其獨立出來後,版面資訊的重心被提升出來了,並且很容易的就可以瞭解版面資訊閱讀的順序:

可以發現的是,雖然每項資訊的視覺強度跟比重都一樣,但是由於資訊擺放時的「留白」較多,因而在閱讀的時候反而更為顯眼突出

留白是指畫面上沒有配置重要視覺元素的區域,在一般的邏輯中,這是「多餘的」、「浪費掉的」區域,但是在視覺設計中,留白是一個很重要的視覺元素

另外,將屬性相似的物件做歸類擺放也一個是很重要的提升畫面閱讀性的技巧,如上圖右,由於底部資訊被擺放得更接近了,在閱讀上就更容易將其歸類為同一個的區塊,將這些具有相同屬性的資訊擺放在一起,也可以提升使用者的閱讀效率。這是由於人在看到一項資訊時,並不會將其當成獨立的要素,而是將其認為是某個更大整體中的一個小部分,這種現象叫做「完形心理 ( Gestalt ) 」。

最常見使用這個方法歸類資訊的例子就是名片了。如下圖,在編排名片時,就必須考慮將性質相近的元素編排的靠近一些,例如姓名跟職稱會歸類在一起,而電話、傳真、手機號碼等則是區分為另外一組歸類,如此來不僅版面上的資訊得到了明確的整理與歸類,版面視覺也簡潔了許多。

 

延伸閱讀

留白也是一種空間的利用

完形心理學的視覺法則

幫 UI 分類,我們是如何記憶的?

 

Images via DavidSpinks, cc License.

對設計師而言,準確地掌握作品最後呈現在觀賞者眼前的效果是控制品質很重要的一個環節,如果是平面設計,從一開始的設計、選紙、打樣調整、輸出…都是為了讓最...
世界上大約有 8% 的男性人口擁有某種形式的色盲,女性約 0.5%。以這比例去推算,臺灣的色盲者將近 116 萬人。可以說是一個相當龐大的族群。 這些人不只在網...
清單視圖(List view)為一常見又方便的介面控制元件,它主要是利用清單的方式來呈現一堆具有相似格式的資訊, 使用者可以輕鬆透過它預覽大量資訊,找尋有興趣的...
個人圖示(也可稱為 Avatar)是手機應用程式及社群網路服務不可或缺的元素,它可以幫助我們快速地辨識出使用者的身份。隨著社群網站的發展,人們可以透過各大社群帳...
「如果你不夠小心,在 Photoshop 中旋轉圖像時,可能會毀了你辛苦完成的作品!」 ~ Marc Edward 在 Photoshop 中旋轉圖像時(這邊指...
資訊圖表(Infographic)是最近一個非常流行的話題,其主要目的是把大量的資訊整理成一張好用的圖表,加上有趣的視覺或故事效果,可以讓讀者可以快速的吸收大量...
© 2013 Desiring Clicks. All Rights Reserved.
Top