網(wǎng)頁一屏有多大?_網(wǎng)頁設(shè)計(jì)教程
推薦:書簽效果的優(yōu)化一葉千鳥的blog:http://www.rexsong.com/blog/傳說IBM筆記本的小紅帽TrackPoint有個小秘密:鼠標(biāo)指針在移動過程中,當(dāng)手指離開小紅帽的瞬間,指針會向相反方
網(wǎng)站設(shè)計(jì)時,有一個最常用的指導(dǎo)性原則:頁面長度原則上不超過3屏,寬度不超過1屏。這個原則明顯是從用戶的體驗(yàn)出發(fā),非凡是寬度不超過一屏,其最基本的表現(xiàn)是瀏覽器不出現(xiàn)橫向滾動條,這幾乎是目前的設(shè)計(jì)準(zhǔn)則。那么這里的一屏到底是多大呢?
普通用戶通常瀏覽網(wǎng)頁時,其瀏覽網(wǎng)頁的有效面積會受到下面幾個方面的影響:
- 顯示器的分辨率
這個由科技發(fā)展和用戶購買力及喜好決定,其數(shù)據(jù)取決于統(tǒng)計(jì)。 - 操作系統(tǒng)
毫無疑問目前是Windows的天下,其中WindowsXP占絕大多數(shù)。 - 網(wǎng)頁瀏覽器
IE依舊份額最高,但是Firefox、Opera和Safari等也有一定市場。 - 個人定制
主要是用戶定制操作系統(tǒng)的樣式、操作系統(tǒng)任務(wù)欄是否隱藏和瀏覽器的樣式,但是總體上這部分應(yīng)該屬于高級用戶,絕大部分用戶依舊會使用操作系統(tǒng)和瀏覽器的默認(rèn)樣式。
下面是關(guān)于瀏覽器和屏幕分辨率的統(tǒng)計(jì)數(shù)據(jù):

W3Counter于2006.11.12發(fā)布的全球統(tǒng)計(jì)數(shù)據(jù)

某知名站點(diǎn)2006年10月份的數(shù)據(jù)
由上面的數(shù)據(jù)可以得出:
- 基本上用戶分辨率都在800×600以上,絕大部分都在1024×768以上,從全球情況來看,800×600的分辨率會越來越少。
- 國內(nèi)瀏覽器依舊是IE6的天下,這將會持續(xù)較長的時間。從全球市場來看,國內(nèi)的Firefox2.0和IE7會逐步增長,非凡當(dāng)IE7的中文版推出和Windows自動更新的推廣開始以及隨Vista上市,IE7增長會更快。
所以計(jì)算一屏大小應(yīng)基于以下原則:
- 一屏指絕大部分用戶的瀏覽器顯示網(wǎng)頁的有效可視區(qū)域。
- 一屏的計(jì)算環(huán)境是Windows XP和瀏覽器均處于默認(rèn)樣式。
- 由于IE無論是否超過一屏都存在縱向滾動條的位置,F(xiàn)irefox和Opera是在頁面超過一屏的時候出現(xiàn)縱向滾動條,且瀏覽絕大部分網(wǎng)頁都有縱向滾動條的存在,所以一屏大小的計(jì)算都基于瀏覽器有縱向滾動條的狀態(tài)下。
- 由于Firefox2.0在只瀏覽一個網(wǎng)頁時不出現(xiàn)多窗口的控制欄,而其它的多窗口瀏覽器都出現(xiàn)多窗口控制欄且使用時都會同時瀏覽多個網(wǎng)頁,所以一屏大小在Firefox中指多窗口的控制欄存在時。
下面是基于上面的原則得到常用瀏覽器和分辨率下的的數(shù)據(jù)結(jié)果:
| 有效可視區(qū)域(單位:px) | ||||||
|---|---|---|---|---|---|---|
| 屏幕 | 一 | 二 | 三 | |||
| 800 | 600 | 1024 | 768 | 1280 | 1024 | |
| IE6.0 | 779( 21) | 432( 168) | 1003( 21) | 600( 168) | 1259( 21) | 856( 168) |
| IE7.0 | 779( 21) | 452( 148) | 1003( 21) | 620( 148) | 1259( 21) | 876( 148) |
| Firefox2.0 | 783( 17) | 417( 183) | 1007( 17) | 585( 183) | 1263( 17) | 841( 183) |
| Opera9.0 | 781( 19) | 461( 139) | 1005( 19) | 629( 139) | 1261( 19) | 885( 139) |
關(guān)于上面數(shù)據(jù)的解釋和一些其他事實(shí):
- 在800×600分辨率和Windows XP下定制Windows的經(jīng)典樣式IE6的有效可視區(qū)域是780×445,Windows98、Windows 2000和Windows2003均采用經(jīng)典樣式切IE5.0、IE5.5、IE6.0的布局上相似,所以相同分辨率下應(yīng)該比Windows XP默認(rèn)的樣式要大。
- 知道瀏覽器型號和屏幕的分辨率能夠很輕易的推算出可視區(qū)域面積,比如1024×768下IE7.0的可視面積是(1024-21)×(1024-148)
綜合上面所有的數(shù)據(jù),結(jié)論如下:
- 最保守而最有兼容性的一屏大小是:779×432
- 最廣泛的一屏大小是:1003×600
- 適合目前國內(nèi)的情況,一屏大小是779×600
分享:做網(wǎng)站的一些定律1.250定律拉德認(rèn)為:每一位顧客身后,大體有250名親朋好友。假如您贏得了一位顧客的好感,就意味著贏得了250個人的好感;反之,假如你得罪了一名顧客,也就意
- 中國互聯(lián)網(wǎng)黑色產(chǎn)業(yè)人數(shù)近10萬 5分鐘1起網(wǎng)絡(luò)入侵
- 馬云最后的發(fā)布會:打假,打出阿里的新未來
- 實(shí)踐分享:ACCESS數(shù)據(jù)庫導(dǎo)入mysql數(shù)據(jù)庫
- ACCESS數(shù)據(jù)庫轉(zhuǎn)ORACLE數(shù)據(jù)庫分享
- CDN.net免費(fèi)CDN申請使用教程:100GB流量香港日本新加坡節(jié)點(diǎn)
- WordPress 教程:為插件自定義數(shù)據(jù)表
- 如何使用查找我的iPhone教程
- 微信公眾平臺教程(二) 消息管理與群發(fā)
- 中國IPv4地址今年將告罄 IPv6期待打破政策局
- 移動廣告野蠻成長:75%投放在iOS平臺
- 災(zāi)難面前,互聯(lián)網(wǎng)公司可以如何做的更好?
- 富士康500萬部iPhone遭蘋果退貨 損失10億元
- 相關(guān)鏈接:
- 教程說明:
網(wǎng)頁設(shè)計(jì)教程-網(wǎng)頁一屏有多大?
。