三、網(wǎng)頁(yè):將眾多的信息形成視覺層次感是最大的關(guān)鍵 Men.style.com 的網(wǎng)頁(yè)中包含了眾多的信息,下圖共有 9 張圖片,還有很多大小標(biāo)題,所形成的區(qū)域數(shù)量也非常多――有重點(diǎn)的封面報(bào)道,有一些是比較次要的新聞,還有其它的搜索功能等等。但你在看這個(gè)網(wǎng)頁(yè)的時(shí)候,卻并不會(huì)讓你的眼睛無所適從眼花繚亂,相反,整個(gè)版面安排得非常漂亮及吸引人。為什么有這種效果?關(guān)鍵是他們?cè)谂虐嫔蠌?qiáng)調(diào)了層次感。整個(gè)版面大元素與小元素之間,通過淺色及暗色及組織形成了協(xié)調(diào)的對(duì)比。

一眼望去,電影明星蓋倫霍爾( Gyllenhaal )是這個(gè)版面當(dāng)之無愧的視覺焦點(diǎn)。他為什么有這種力量: 1 、他是這個(gè)網(wǎng)頁(yè)中最大的一個(gè)元素; 2 、他的身體輪廓與那些矩形的直線邊框形成了對(duì)比; 3 、他超出了區(qū)域一部分; 4 、以黑色為主的肖像與周圍白色區(qū)域形成了對(duì)比。 5 、在這么多圖片中,他的面孔是大家最熟悉的,而且,他還直視著你。從下面的示意圖你或許看到更清楚:

A 是最主要的區(qū)域。( 1 )該版面被分成三個(gè)主要區(qū)域;( 2 )而每一個(gè)區(qū)域又再細(xì)分為各個(gè)小區(qū)域;( 3 )這些小區(qū)域里面還有更小的區(qū)域。而 A 區(qū)域給人顏色厚重的感覺,使它輕易地與其它兩個(gè)區(qū)域分開。而 A 中的小區(qū)域之間的對(duì)比則較為低調(diào),并沒有象大區(qū)域的對(duì)比那樣強(qiáng)烈。這樣的劃分,使到網(wǎng)頁(yè)可以包含很多的信息。特別注意其中標(biāo)題的樣式,在不同區(qū)域中一些主要標(biāo)題的字體及樣式都是一樣的,使到整個(gè)版面在視覺上形成一個(gè)整體。