Axure 設(shè)計(jì)網(wǎng)站原型時(shí)，網(wǎng)站寬度和高度怎么設(shè)置比較好呢？

時(shí)間：2024-02-14 19:35:01 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2024-02-14 19:35:01 來(lái)源：網(wǎng)站運(yùn)營(yíng)

Axure 設(shè)計(jì)網(wǎng)站原型時(shí)，網(wǎng)站寬度和高度怎么設(shè)置比較好呢？：推薦網(wǎng)站：尺寸ChiCun-為設(shè)計(jì)，做更好的標(biāo)準(zhǔn)


我也在搜尋“做原型時(shí)，頁(yè)面寬度設(shè)置成多少，最適宜？”的答案，得此文，順帶分享，供參考。

自己一般左右留白50~100px，中間頁(yè)面設(shè)為1000px，方便得出內(nèi)容or布局比例。


原文如下：

原型設(shè)計(jì)工具中，設(shè)計(jì)元素?zé)o外乎都差不多，只是哪個(gè)工具操作更容易、視覺(jué)上效果更好。使用過(guò)VISIO的朋友們，如果用AXURE畫原型上手應(yīng)該也不是太困難，只是里面一些交互的東西需要研究研究。AXURE可以生成HTML，如果做得專業(yè)一些，可以直接拿來(lái)當(dāng)DEMO版演示用。這段時(shí)間我將研究如何將網(wǎng)站原型做得更專業(yè)。



【頁(yè)面尺寸】網(wǎng)頁(yè)的尺寸受限于兩個(gè)因素：一個(gè)是顯示器屏幕（顯示器現(xiàn)在種類很多，17寸為主流，正在朝19寸及寬屏的方向發(fā)展，但目前也有為數(shù)不少的15寸顯示器）另一個(gè)是瀏覽器軟件（我們常用的IE、遨游、Friefox等）


【頁(yè)面高度】高度是可以向下延展的，所以一般對(duì)高度不限制。對(duì)于一屏來(lái)說(shuō)一般沒(méi)有一個(gè)固定值，因?yàn)槊總€(gè)人的瀏覽器的工具欄不同，所以高度沒(méi)有確切值。


【頁(yè)面寬度】
1、在IE6.0下，寬度為顯示器分辨率減21，比如1024的寬度-21就變成1003。但值得注意的是IE6.0(或更低)無(wú)論你的網(wǎng)頁(yè)多高都會(huì)有右側(cè)的滾動(dòng)條框。
2、在Firefox下，寬度的分率辨減19。比如1024的寬度-19就變成1005
3、在Opear下，寬度的分率辨減23。比如1024的寬度-23就變成1001
如果是1024的分辨率，你的網(wǎng)頁(yè)不如設(shè)成1000安全一點(diǎn)。設(shè)成900兩側(cè)空白更大,視覺(jué)上更舒服一點(diǎn)。也方便做一些浮動(dòng)層的設(shè)計(jì)。如果是800的分辨率一般都設(shè)成770。但也有設(shè)成760的。這些需要明白并且牢記，不然很可能做出來(lái)不符合瀏覽器要求。不過(guò)一般我們都會(huì)設(shè)定的再稍微小一點(diǎn)，因?yàn)橛行g覽器加了插件或者其他的東西寬度會(huì)有變化，所以 800的分辨率一般設(shè)定760左右，1024的設(shè)定990左右。

網(wǎng)頁(yè)設(shè)計(jì)標(biāo)準(zhǔn)尺寸參考：
1、800*600下，網(wǎng)頁(yè)寬度保持在778以內(nèi)，就不會(huì)出現(xiàn)水平滾動(dòng)條，高度則視版面和內(nèi)容決定。
2、1024*768下，網(wǎng)頁(yè)寬度保持在1002以內(nèi)，如果滿框顯示的話，高度是612-615之間，就不會(huì)出現(xiàn)水平滾動(dòng)條和垂直滾動(dòng)條。
3、頁(yè)面長(zhǎng)度原則上不超過(guò)3屏，寬度不超過(guò)1屏，每個(gè)標(biāo)準(zhǔn)頁(yè)面為A4幅面大小，即8.5X11英寸。
4、全尺寸banner為468*60px，半尺寸banner為234*60px，小banner為88*31px （另外120*90，120*60也是小圖標(biāo)的標(biāo)準(zhǔn)尺寸 ）
5、每個(gè)非首頁(yè)靜態(tài)頁(yè)面含圖片字節(jié)不超過(guò)60K，全尺寸banner不超過(guò)14K


【網(wǎng)頁(yè)廣告尺寸】
1、120*120，這種廣告規(guī)格適用于產(chǎn)品或新聞?wù)掌故尽?
2、120*60，這種廣告規(guī)格主要用于做LOGO使用。
3、120*90，主要應(yīng)用于產(chǎn)品演示或大型LOGO。
4、125*125，這種規(guī)格適于表現(xiàn)照片效果的圖像廣告。
5、234*60，這種規(guī)格適用于框架或左右形式主頁(yè)的廣告鏈接。
6、392*72，主要用于有較多圖片展示的廣告條，用于頁(yè)眉或頁(yè)腳。
7、468*60，應(yīng)用最為廣泛的廣告條尺寸，用于頁(yè)眉或頁(yè)腳。
8、88*31，主要用于網(wǎng)頁(yè)鏈接，或網(wǎng)站小型LOGO。


【廣告形式 像素大小 最大尺寸】
BUTTON 120*60(必須用gif) 7K；215*50(必須用gif) 7K
通欄 760*100 25K 靜態(tài)圖片或減少運(yùn)動(dòng)效果；430*50 15K
超級(jí)通欄 760*100 to 760*200 共40K 靜態(tài)圖片或減少運(yùn)動(dòng)效果
巨幅廣告 336*280 35K；585*120
豎邊廣告 130*300 25K
全屏廣告 800*600 40K 必須為靜態(tài)圖片，F(xiàn)LASH格式
圖文混排 各頻道不同 15K
彈出窗口 400*300(盡量用gif) 40K
BANNER 468*60(盡量用gif) 18K
懸停按鈕 80*80(必須用gif) 7K
流媒體 300*200（可做不規(guī)則形狀但尺寸不能超過(guò)300*200） 30K 播放時(shí)間 小于5秒60幀(1秒/12幀)


【網(wǎng)頁(yè)中的廣告尺寸】
1.首頁(yè)右上，尺寸120*60
2.首頁(yè)頂部通欄，尺寸468*60
3.首頁(yè)頂部通欄，尺寸760*60
4.首頁(yè)中部通欄，尺寸580*60
5.內(nèi)頁(yè)頂部通欄，尺寸468*60
6.內(nèi)頁(yè)頂部通欄，尺寸760*60
7.內(nèi)頁(yè)左上，尺寸150*60或300*300
8.下載地址頁(yè)面，尺寸560*60或468*60
9.內(nèi)頁(yè)底部通欄，尺寸760*60
10.左漂浮，尺寸80*80或100*100
11.右漂浮，尺寸80*80或100*100



本文轉(zhuǎn)自 “我的需求我做主” 2011年的博客，讓我們的原型更加專業(yè)化【頁(yè)面規(guī)格設(shè)置】