專題技巧淺析(2)_網(wǎng)頁設(shè)計(jì)教程
推薦:免費(fèi)的響應(yīng)式Bootstrap模板 - CodesterCodester是一個(gè)基本的個(gè)人作品集Bootstrap模板,幫助設(shè)計(jì)師,攝影師,圖形藝術(shù)工作者搭建高度可定制的網(wǎng)站。擁有自定義包和相關(guān)的javascript,css和組件,相信大家肯定喜歡
首先第一個(gè)問題首屏高度:
分析一下常見分辨率及瀏覽器下高度數(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。
綜合上面表中個(gè)分辨率及瀏覽器下的統(tǒng)計(jì)數(shù)據(jù),我們很容易畫出兩條首屏線,分別是580PX和710PX,對(duì)應(yīng)不同的分辨率。
再來看下不同分辨率用戶的占比情況:

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

總結(jié)起來就是注意首屏高度。
建議將最主要的信息顯示在580PX高度的范圍以內(nèi) 讓用戶打開網(wǎng)頁第一屏就可以直接看到不用向下滾動(dòng)
分享:“懶人”設(shè)計(jì)思維設(shè)計(jì)師總會(huì)說設(shè)計(jì)是一件很累人的事,但這部分原因可能是你自找的。時(shí)間與設(shè)計(jì)出來的效果也并不一定成正比。平面設(shè)計(jì)師或許應(yīng)該培養(yǎng)一種“懶人”設(shè)計(jì)思維,面對(duì)一個(gè)設(shè)計(jì)時(shí),
- 中國(guó)互聯(lián)網(wǎng)黑色產(chǎn)業(yè)人數(shù)近10萬 5分鐘1起網(wǎng)絡(luò)入侵
- 馬云最后的發(fā)布會(huì):打假,打出阿里的新未來
- 實(shí)踐分享:ACCESS數(shù)據(jù)庫導(dǎo)入mysql數(shù)據(jù)庫
- ACCESS數(shù)據(jù)庫轉(zhuǎn)ORACLE數(shù)據(jù)庫分享
- CDN.net免費(fèi)CDN申請(qǐng)使用教程:100GB流量香港日本新加坡節(jié)點(diǎn)
- WordPress 教程:為插件自定義數(shù)據(jù)表
- 如何使用查找我的iPhone教程
- 微信公眾平臺(tái)教程(二) 消息管理與群發(fā)
- 中國(guó)IPv4地址今年將告罄 IPv6期待打破政策局
- 移動(dòng)廣告野蠻成長(zhǎng):75%投放在iOS平臺(tái)
- 災(zāi)難面前,互聯(lián)網(wǎng)公司可以如何做的更好?
- 富士康500萬部iPhone遭蘋果退貨 損失10億元
- 相關(guān)鏈接:
- 教程說明:
網(wǎng)頁設(shè)計(jì)教程-專題技巧淺析(2)
。