上海網(wǎng)站建設(shè)?上海網(wǎng)站設(shè)計(calnewiltshire.com)
本文內(nèi)容接著上篇內(nèi)容繼續(xù)。
5?建立一個清晰的視覺層次
網(wǎng)站游客大概掃一眼文章內(nèi)容。他們不仔細(xì)閱讀文章內(nèi)容。抓住他們的注意力,用一個清晰的,經(jīng)過深思熟慮的視覺層次,讓他們先看到最重要的信息。一個深思熟慮的設(shè)計?
-?網(wǎng)站>頁>部分?-?引導(dǎo)用戶按照你想要的方式,瀏覽該頁面,并在一瞬間了解它。
看看下面的例子,你會發(fā)現(xiàn)你的眼睛很難發(fā)現(xiàn)內(nèi)容是關(guān)于什么且是從哪里開始的!

下面是我在頁面上做了一些改變,通過以下方式,創(chuàng)建了一個更清晰的視覺層次:
1?文章的標(biāo)題應(yīng)該是在頁面上最突出的元素。之前的頁面標(biāo)題字體偏小,不夠醒目!所以我增加了文章標(biāo)題的字體大小。
2?從內(nèi)容上看,各內(nèi)容之間感覺被斷開了,所以我減少了標(biāo)題內(nèi)容的距離,讓用戶知道這是段落標(biāo)題與標(biāo)題下方內(nèi)容的間距,而留下的空間。
3?我也把標(biāo)題的圖片從左邊移動右邊,這樣,當(dāng)用戶瀏覽的時候,文章的標(biāo)題會被第一眼看到。
4?我刪除里面的藍(lán)色邊框和圖標(biāo),所以它們不再與標(biāo)題爭鋒。緊跟著標(biāo)題放個灰色塊,這樣看起來整體視覺舒服。
5?我也刪除了說明這是個轉(zhuǎn)載的文章,令人分散注意力的文本內(nèi)容,以及一些空段落和
<HR>標(biāo)簽。

我有意忽略了所有的廣告,假設(shè)它們是這個頁面中的一個重要組成部分。
6??保持一致?
不要混淆你的用戶。您選擇使用的圖標(biāo),照片和插圖,確保它們的感覺是屬于一個風(fēng)格,不然會分散用戶的注意力,從而忽略您的消息。?不要使用超過
3個字體?
-?它們最好的是一個同一個系列里,比如都是方正字庫里的字體。顏色限制到5-6
種(注:該標(biāo)志可以使用不同的字體,而且往往應(yīng)該是是不同的)。
7 ?打破規(guī)則(必要時)
如果有什么需要特別突出或很重要的,你可以“
打破規(guī)則”,你可以使用一個或兩個對比色,以幫助該元素脫穎而出。例如英國網(wǎng)站強調(diào)的稅率,這是一個使用流行的顏色,并且元素面積更大。
8?不要過度使用噱頭
使您的設(shè)計帶有趣味性,但是要確保這些元素能夠在網(wǎng)站上有條理的出現(xiàn)。例如的
Inze網(wǎng)站看起來很美,但在我的桌面電腦看時,我迷路了。原來這個導(dǎo)航開始是隱藏的,當(dāng)我開始滾動時候,我的眼睛會往下看,因此我忽略了在隨著滾動,在頁面頭部出現(xiàn)的導(dǎo)航?!?span style="font-family: 宋體;">隱藏
”導(dǎo)航會有一個整潔的效果,但
“設(shè)計”將讓我沒有興趣繼續(xù)往下看。最后,它傳達(dá)了一個令人困惑的,不注重細(xì)節(jié)的品牌形象。
9??測試/測量/改善
網(wǎng)站在不斷演變發(fā)展中。設(shè)計具有更加靈活性和適應(yīng)性。收集和分析測試數(shù)據(jù),將推動網(wǎng)站不斷發(fā)展。請記住,這是以滿足你的目標(biāo)前提下,進(jìn)行關(guān)于創(chuàng)新的設(shè)計。

通過仔細(xì)測量分析到原來的登陸頁面(左)信息,我們想出了一個新的設(shè)計(右),就是在原先基礎(chǔ)上增加了注冊內(nèi)容60
%的空間,讓主次更加分明!
溫馨提示
有效的圖形設(shè)計需要情感連接用戶與品牌,而在同一時間讓他們做你想讓他們做的。這是可以做到的。
以上是關(guān)于“設(shè)計
=情緒+可用性”的全部內(nèi)容。