
先以CP設(shè)計的的這個奧運專題為例分析專題設(shè)計中常遇到的一些問題。

這個頁面存在的問題很多,我們來一個個分析。
首先第一個問題首屏高度:
分析一下常見分辨率及瀏覽器下高度數(shù)據(jù):

在window XP常見分辨率1024×768下我們除掉任務(wù)欄,瀏覽器菜單欄以及狀態(tài)欄后剩下的網(wǎng)頁首屏高度平均值是584。
Win7下是574。在window XP常見分辨率1440×900下我們除掉任務(wù)欄,瀏覽器菜單欄以及狀態(tài)欄后剩下的網(wǎng)頁首屏高度平均值是716。Win7下是706。
綜合上面表中個分辨率及瀏覽器下的統(tǒng)計數(shù)據(jù),我們很容易畫出兩條首屏線,分別是580PX和710PX,對應(yīng)不同的分辨率。
再來看下不同分辨率用戶的占比情況:

通過對大于30W臺客戶端用戶進(jìn)行測試,得到的測試數(shù)據(jù)如下:
即當(dāng)首屏高度大于580時有44.64的人看不到;大于720時有82.64%的人看不到;
大于800時有92.27%的人看不到。
我們將這個數(shù)據(jù)轉(zhuǎn)化成3條線直觀的顯示在專題頁面上:

總結(jié)起來就是注意首屏高度。
建議將最主要的信息顯示在580PX高度的范圍以內(nèi) 讓用戶打開網(wǎng)頁第一屏就可以直接看到不用向下滾動
這個第二個專題的第二個問題:標(biāo)題夠顯眼么?

檢驗一個專題頭圖標(biāo)題是否夠顯眼其中的一個方法就是將網(wǎng)頁去色,站在遠(yuǎn)處看看標(biāo)題是否還看得清。
我們有這個方法來檢驗一下這個專題:

是不是就可以看出頭圖文字跟背景混在一起不夠清晰。

50張美麗的動物攝影作品欣賞動物攝影2014-01-01

Brandnew:2013年最佳LOGO更換榜單VI設(shè)計2013-12-27

優(yōu)秀包裝設(shè)計精選集(45)包裝設(shè)計2013-12-22

用戶體驗設(shè)計遇見色彩情感網(wǎng)頁理論2013-12-22

網(wǎng)頁設(shè)計趨勢淺析網(wǎng)頁理論2013-12-22

設(shè)計師如何通過顏色來影響消費者網(wǎng)頁理論2013-12-03