成都網(wǎng)站建設(shè)公司

視噪，又稱視覺噪音。我們每天接受來自外界的大量信息，這些信息有將近70％是通過視覺感知獲得的。視噪會(huì)干擾我們對(duì)信息的判斷，影響到產(chǎn)品的易用性和可用性，與用戶體驗(yàn)的好壞息息相關(guān)。

（克勞德香農(nóng)圖演示了噪音如何影響信息的傳遞）

（這是模仿克勞德香農(nóng)圖畫一張視噪影響用戶界面?zhèn)鬟f信息的圖）

那么什么是視覺噪音呢？簡(jiǎn)單來說，視噪就是在視覺信息傳遞的過程中，對(duì)信息的傳遞、理解產(chǎn)生負(fù)面作用的視覺因素；如同我們無法忍受生活在嘈雜的環(huán)境中一樣，視覺噪音也會(huì)干擾我們對(duì)信息的判斷，影響到產(chǎn)品的易用性和可用性，與用戶體驗(yàn)的好壞息息相關(guān)。

類似下面這樣的網(wǎng)頁相信你一定感覺熟悉，有時(shí)候我們不得不面對(duì)這樣熱鬧非凡的頁面并從中找到我們需要的信息和內(nèi)容，譬如說一個(gè)下載按鈕或者一個(gè)重要的鏈接，但糟糕的是我們很容易迷失其中；

1.色彩

提到視覺設(shè)計(jì)，不能不提色彩。色彩在界面設(shè)計(jì)中扮演著非常重要的角色：區(qū)分信息模塊、暗示控件功能（如藍(lán)色文字通常代表鏈接，灰色按鈕表示不可點(diǎn)擊等）、突出重點(diǎn)信息（越重要?jiǎng)t越醒目）等和諧的配色與適當(dāng)?shù)谋壤�搭配能夠讓整個(gè)界面看上去清晰舒適，反之，則會(huì)給用戶帶來過重的視覺負(fù)擔(dān)，容易形成視覺疲勞，影響體驗(yàn)。

（如圖，鏈接文字、不可點(diǎn)擊文字，通過色彩的劃分而一目了然；）

（某網(wǎng)站設(shè)計(jì)；不同區(qū)域使用不同色彩劃分信息；）

（個(gè)人網(wǎng)站設(shè)計(jì)；橙色文字在灰色底圖上被很好的展現(xiàn)了出來；）

（色彩在區(qū)分信息模塊時(shí)的運(yùn)用；）

2.布局

界面中的信息能否被有效的傳達(dá)，離不開良好的組織和布局；這需要考慮以下這幾個(gè)要素：

a.層次（層級(jí)關(guān)系，段落關(guān)系）

在信息的視覺展現(xiàn)中，信息之間層級(jí)關(guān)系的表達(dá)非常重要，如一個(gè)界面中導(dǎo)航區(qū)域與內(nèi)容區(qū)域的關(guān)系、一篇帖子下的所有評(píng)論之間的關(guān)系、一篇文章中的段落關(guān)系等等……恰當(dāng)?shù)囊曈X設(shè)計(jì)，能夠通過對(duì)視覺元素的展現(xiàn)來暗喻信息之間的層級(jí)關(guān)系；如果視覺層級(jí)關(guān)系展示不當(dāng)，會(huì)使用戶產(chǎn)生困惑，造成理解障礙；

（左：信息的層次劃分；右：信息的段落劃分）

b.對(duì)齊

在內(nèi)容排版的設(shè)計(jì)中，把內(nèi)容對(duì)齊，會(huì)形成一種良好自然的邊界；該邊界沿著這一組對(duì)象延伸（利用了格式塔原則——連續(xù)性原則），這樣帶來的好處是加強(qiáng)了邊界引導(dǎo)讀者的眼光平滑延伸，有助于形成良好的視覺流。

（在表單設(shè)計(jì)中，也是如此。操作區(qū)域?qū)�齊，將大大提升用戶的完成任務(wù)的效率。表單元素居中對(duì)齊后，用戶的視線沿著中線下移，能夠快速閱讀標(biāo)簽并找到相對(duì)應(yīng)的輸入框。）

c.分組

將原本零散無序的信息分組展示，是揭示信息之間的內(nèi)在聯(lián)系、幫助用戶理解和記憶的有效手段；在視覺的表現(xiàn)上，分組就是讓每組信息在視覺表現(xiàn)上具有相關(guān)聯(lián)或相似的地方；

（如;區(qū)域劃分、間隔劃分、色彩劃分、形/符號(hào)的劃分、層級(jí)劃分tab）

（元素的區(qū)域劃分）

（元素的間隔劃分）

（元素的色彩劃分）

3.視覺特效

這里提到的視覺特效包括靜態(tài)的圖形效果和動(dòng)畫效果；設(shè)計(jì)精美的圖形界面和優(yōu)雅適度的動(dòng)畫效果能夠給人帶來愉悅的享受；但是想想網(wǎng)頁上那些閃動(dòng)不停的廣告條幅和屏幕中飛來飛去的彈出框吧它們是否一度將你惹惱？四處充斥的造型復(fù)雜的圖標(biāo)、一連串的水晶效果的按鈕、各種為炫技而堆疊的軟件特效是否讓你心生反感？有如糖果般誘人的圖形界面，或許并不一定適用于信息的傳遞和展示；圖形元素如果濫用過度，反成冗余和累贅，也就成為了視噪；

（華麗的色彩和背景圖，底紋、水晶、眩光特效，但整個(gè)網(wǎng)站帶給人的體驗(yàn)并不佳；過度的裝點(diǎn)使網(wǎng)站的可讀性變差，導(dǎo)航和視覺焦點(diǎn)都變得混亂；）

（一個(gè)網(wǎng)頁的頁頭部分，被各種閃爍的廣告所破壞）

4.視覺權(quán)重

這里提到的視覺權(quán)重，指的是界面元素在視覺表現(xiàn)上的“輕”與“重”，也就是信息之間的主次關(guān)系；良好的界面設(shè)計(jì)能夠通過對(duì)視覺信息的表現(xiàn)和把握，明確告知用戶哪些信息是主要的，哪些是輔助的；讓用戶很快把握重點(diǎn)，提綱挈領(lǐng)；