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

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

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

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

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

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

1.色彩

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

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

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

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

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

2.布局

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

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

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

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

b.對齊

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

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

c.分組

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

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

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

（元素的間隔劃分）

（元素的色彩劃分）

3.視覺特效

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

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

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

4.視覺權(quán)重

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