在上一章節(jié)中我們主要就網(wǎng)站視覺的第一要素:色彩而展開了較為詳盡的討論,今天開始我們將從布局上來對(duì)網(wǎng)站的視覺進(jìn)行一些探討。
但是上篇文章中還是遺漏了一些東西,我們?cè)诒疚拈_頭前先對(duì)上一章進(jìn)行一些補(bǔ)充。
就色彩方面來說,可是一門大學(xué)問,色彩在視覺中究竟占有多大的分量?
補(bǔ)充:關(guān)于網(wǎng)站視覺之色彩的延續(xù)思考
我想很多人并沒有足夠的重視色彩,因此他們也就不可能將色彩的運(yùn)用發(fā)揮到極致。
人永遠(yuǎn)不要嘗試著抗?fàn)幣c違背天性,設(shè)計(jì)也是如此。我們都知道視覺究竟是通過啥來傳遞給大腦的,如果你不知道的話,那就真的無語了。世界上的一切物體都是以色彩的形式來傳輸進(jìn)我們的大腦的,而這些色彩也包括了點(diǎn)、面、線、明暗分界線、陰影等等,正是因?yàn)檫@些色彩的奇妙組合,才使得我們眼中的世界是立體的、繽紛的、多彩的。請(qǐng)不要嘗試著去反駁我的觀點(diǎn),那會(huì)讓我們的探討變得很無趣。
視覺是通過色彩來傳達(dá)給我們最基本的信息,一個(gè)東西美不美,能不能給我們?cè)斐梢曈X上的沖擊,在很大程度上其實(shí)都取決于色彩。
正是因?yàn)樯适且曈X表現(xiàn)的最基本要素,所以才會(huì)有了繪畫藝術(shù)。所謂的繪畫就是通過色彩的變化及組合來帶給人以視覺美感的表現(xiàn)形式。色彩是客觀存在的,而構(gòu)圖等因素則是主觀的,這或許也是有些朋友反駁的最大理由。好吧!我們都見過抽象畫吧?為啥毫無構(gòu)圖、具象的一幅畫能夠帶給人以足夠的美感及視覺沖擊?那還不是因?yàn)樗囆g(shù)家們對(duì)色彩的領(lǐng)悟及把握已到達(dá)了爐火純青的地步?色彩對(duì)于藝術(shù)家來說代表的是修養(yǎng)、是功力,擴(kuò)展至整個(gè)視覺領(lǐng)域這話也是無可厚非的。
色盲患者與普通人眼中的世界是不同,不同審美觀的人在視覺上對(duì)色彩的敏感度及喜好也是不同的,不同年齡層次的人對(duì)色彩的感受也不是同的,不同心情下、不同環(huán)境中對(duì)色彩的感受也不會(huì)相同,這就要求我們?cè)诒憩F(xiàn)色彩時(shí)一定注意這一點(diǎn),尤其在網(wǎng)站視覺上,因?yàn)辇嫶蟮臑g覽人群,在色彩的表現(xiàn)上,我們最先要考慮的還是色彩的通用性。
有一個(gè)最簡(jiǎn)單的測(cè)試你的網(wǎng)站在視覺上表現(xiàn)上究竟好不好的方法,你可以將網(wǎng)站整個(gè)截圖下來,然后轉(zhuǎn)成黑白單色,如果在黑白色下,你的頁面層次感不強(qiáng)、各個(gè)組成部分辨識(shí)度不高,整個(gè)頁面都給人灰蒙蒙的感覺,那就證明你做的還遠(yuǎn)遠(yuǎn)不夠。一個(gè)對(duì)色彩領(lǐng)悟能力較高的設(shè)計(jì)師設(shè)計(jì)出來的東西,即使在去色的黑白狀態(tài)下應(yīng)該也是美麗動(dòng)人、層次分明、依然可以給人以視覺震撼的,并不能將色彩的應(yīng)用僅僅局限在簡(jiǎn)單的色彩搭配上。
除了將圖片轉(zhuǎn)為黑白色外,你還需要將截圖編程很小的隨略圖,如果縮略圖中你的層次結(jié)構(gòu)根本看不出來,顏色辨識(shí)度也不高,那么你就需要改進(jìn)了。像是很多站點(diǎn)正常看上去還行,但一旦做成了縮略小圖便編程了滿幅文字,密密麻麻的毫無美感而言。
關(guān)于色彩的問題我們就將到這里了,再胡侃下去就顯得多余了,況且色彩的把握本身就是一種只可意會(huì)不可言傳的東西,究竟能把握到什么程度完全需要設(shè)計(jì)者各種經(jīng)驗(yàn)的長(zhǎng)年沉淀。
第二步布局篇
說完了色彩,我們就來看一下布局結(jié)構(gòu)了。
一、好的網(wǎng)站布局應(yīng)該是透氣的
在布局結(jié)構(gòu)上的處理,我們大多數(shù)人(并不只是設(shè)計(jì)師)總是希望在頁面上表現(xiàn)更多的東西,這不得不說也算是一種大國(guó)情結(jié)的延續(xù),或者更準(zhǔn)確的說我們國(guó)人對(duì)網(wǎng)站的概念應(yīng)該是大而全的那種,我們都門戶站點(diǎn)的偏好很厲害……甚至有相當(dāng)一部分的人認(rèn)為內(nèi)容越豐富、欄目越多,才越能證明網(wǎng)站的實(shí)力,才能算的上是正規(guī)運(yùn)營(yíng)的網(wǎng)絡(luò)公司。
顯然這種想法是極其錯(cuò)誤的,這只能證明你對(duì)網(wǎng)絡(luò)現(xiàn)狀并不了解、對(duì)網(wǎng)站領(lǐng)域還缺乏一個(gè)深度的了解,除此之外再也無法去證明其他什么東西。
話多必失這四個(gè)字也是古人總結(jié)的,你表現(xiàn)出來的東西越多,越就暴露了你的缺點(diǎn)和弱點(diǎn),畢竟沒有一個(gè)人是全能和完美的,即使是全能和完美的,你也不可能有那么大的精力將方方面面都照顧到。
好吧,我承認(rèn)很多朋友還是有著清醒認(rèn)識(shí)的,也有越來越多的朋友都注意到了大而全的站點(diǎn)很難取得成功的現(xiàn)實(shí),因此也有越來越多的朋友開始找尋特色的東西作為網(wǎng)站的主題。這個(gè)認(rèn)識(shí)似乎與我們現(xiàn)在所將的網(wǎng)站布局關(guān)系不大,但你要承認(rèn)正是因?yàn)槟欠N潛意識(shí)下的東西在作怪,才導(dǎo)致了我們的頁面擁擠而凌亂,很多瀏覽者進(jìn)去之后常常會(huì)心煩氣悶、無所適從。
看看很多站點(diǎn)吧!整個(gè)頁面都是密密麻麻的東西,貌似設(shè)計(jì)者恨不得將所有的東西在一個(gè)頁面上全展現(xiàn)出來。這種設(shè)計(jì)理念是錯(cuò)誤的,即使是cms也把握一個(gè)度,沒有了這個(gè)度的把握,頁面便會(huì)失控,便會(huì)應(yīng)了那句成語:“畫蛇添足”!
為啥我們不能畫龍點(diǎn)睛呢?為啥我們不能錦上添花呢?
我承認(rèn)自己有密集恐懼癥,而且我知道大多數(shù)瀏覽者對(duì)太過密集的東西都沒有好感。頁面堆砌太多的東西容易讓人產(chǎn)生擁擠、壓抑、淺薄、狹隘、凌亂、緊張、茫然等等一些不好的感受,在這一點(diǎn)上我們應(yīng)該好好的去分析和比較一些國(guó)外很多優(yōu)秀站點(diǎn)的做法,即使是內(nèi)容較多的cms頁面,人家做的也是寬松透氣、多而不亂、井然有序、條目分明、重點(diǎn)突出。
素描是一種很見實(shí)力而且神奇的藝術(shù)表現(xiàn)形式,藝術(shù)家們僅通過一支鉛筆及灰度的變化便能表現(xiàn)出任何復(fù)雜的畫面和物體,而我們的網(wǎng)站也就是這個(gè)道理,我們無非就是通過一些圖片和文字的組合來帶給瀏覽者以視覺上的沖擊和閱讀的快感。素描講究透氣性,即使是再密集的線條也不能囫圇不清、密不透風(fēng),網(wǎng)站也是如此,你就是內(nèi)容再多,也不能密密麻麻的排布一起,失去了透氣性只能帶給人壓抑之感。
現(xiàn)在有越來越多的網(wǎng)站開始在布局結(jié)構(gòu)上做文章了,一個(gè)寬松舒暢的頁面布局絕對(duì)會(huì)讓瀏覽者身心舒暢、大大延長(zhǎng)停留在頁面上的時(shí)間。
二、頁面布局的視覺打造應(yīng)符合人的生理機(jī)能
就網(wǎng)站大的布局方面來說,無外乎也就幾種:?jiǎn)螜凇㈦p欄、三欄、多欄、瀑布流等等。就人的視覺上來講,我們?cè)跒g覽時(shí)看到第一眼是整個(gè)頁面,而這第一眼是模糊了,僅僅會(huì)讓網(wǎng)站瞬間給我們一個(gè)初始的印象。如果這個(gè)站點(diǎn)的配色及結(jié)構(gòu)很出色的話,應(yīng)該會(huì)讓瀏覽者立時(shí)為之振奮,從而迫不及待的定睛去仔細(xì)看頁面,甚至還會(huì)出于被視覺打動(dòng)的緣故而多翻幾個(gè)頁面,甚至?xí)堄信d趣的嘗試頁面上的一些特效或者小互動(dòng)游戲,這時(shí)若是再碰到了很有意思的文章的話,我想這個(gè)網(wǎng)站就從此扎根在這個(gè)瀏覽者的腦海里了,毫無懸念的他以后還會(huì)再次光臨這個(gè)站點(diǎn),這也就是因?yàn)橐曈X而增加的用戶粘度。但如果這個(gè)站點(diǎn)的配色及結(jié)構(gòu)很普通,并沒有任何出彩的地方呢?那瀏覽者的眼睛就會(huì)略略停頓模糊一秒鐘的時(shí)間,然后瞳孔收縮轉(zhuǎn)為定焦,定焦后的目光最先還是在頁面的地方,這時(shí)他看到的就是頁面的結(jié)構(gòu)了,通過頁面的結(jié)構(gòu)的判斷,眼睛會(huì)將視覺感受傳達(dá)至大腦,然后瀏覽者就自己該怎么樣去瀏覽眼前的這個(gè)頁面。那么這個(gè)時(shí)候單欄的好處也就體現(xiàn)出來了,因?yàn)樗茉诘谝谎劬鸵呀?jīng)盡收瀏覽者眼底,那種視覺感受會(huì)很舒服的,因?yàn)闉g覽者并不需要扭頭眨眼、完全是順應(yīng)著自然本能就很輕松的看到了主體內(nèi)容。
新聞熱點(diǎn)
疑難解答
圖片精選