❶ 網頁設計中頁面尺寸標准
對於固定寬度的網站布局,設計師常用的解析度有:760px、780px、920px、950px等,如今大尺寸、寬屏幕的顯示器越來越多,越來越普及,有些設計師也開始採用1000px、1003px這樣的解析度。
頁面最大化、滿屏化的網站看著的確是舒服,但過高的解析度在設計師顯示器上合適,並不代表在瀏覽者的顯示器上也合適。現在用的最多的解析度還是1024×768,在這種解析度下,含滾動條的頁面最大寬度應不超過994px,所以一般頁面寬度定位在990px以內比較適宜。
這一講主要來說說網頁設計的標准尺寸
一、在800×600解析度下,頁面寬度應在778px以內,這樣不會出現橫向滾動條,高度可以依據版面和內容而定。
二、在1024×768解析度下,頁面寬度應在1003px以內,如果僅一屏顯示的頁面,高度在612px~615px之間,這樣橫向和縱向滾動條都不會出現。
三、在photoshop中做800×600解析度下僅一屏的網頁時,尺寸可以設為740×560左右。
頁面標准按800×600解析度製作,尺寸為778px×434px
頁面長度一般不要超過三屏,寬度不宜出現橫向滾動條為宜
每個標准頁面為A4幅面大小,即8.5×11英寸
全尺寸banner為468px×60px,半尺寸banner為234px×60px,小banner為88px×31px
小圖標的標准尺寸還有120px×90px、120px×60px等
每個非首頁靜態頁面含圖片位元組不超過60K,全尺寸banner不宜超過14k
標准網頁廣告尺寸規格
1、120×120,這種廣告規格適用於產品或新聞照片展示。
2、120×60,這種廣告規格主要用於做LOGO使用。
3、120×90,主要應用於產品演示或大型LOGO。
4、125×125,這種規格適於表現照片效果的圖像廣告。
5、234×60,這種規格適用於框架或左右形式主頁的廣告鏈接。
6、392×72,主要用於有較多圖片展示的廣告條,用於頁眉或頁腳。
7、468×60,應用最為廣泛的廣告條尺寸,用於頁眉或頁腳。
8、88×31,主要用於網頁鏈接,或網站小型LOGO。
廣告形式 像素大小 最大尺寸 備注
BUTTON 120×60(必須用gif) 7K
215×50(必須用gif) 7K
通欄 760×100 25K 靜態圖片或減少運動效果
430×50 15K
超級通欄 760×100 to 760×200 共40K 靜態圖片或減少運動效果
巨幅廣告 336×280 35K
585×120
豎邊廣告 130×300 25K
全屏廣告 800×600 40K 必須為靜態圖片,FLASH格式
圖文混排 各頻道不同 15K
彈出窗口 400×300(盡量用gif) 40K
BANNER 468×60(盡量用gif) 18K
懸停按鈕 80×80(必須用gif) 7K
流媒體 300×200
(可做不規則形狀但尺寸不能超過300×200) 30K 播放時間小於5秒60幀(1秒/12幀)
網頁中的廣告尺寸
1.首頁右上,尺寸120×60
2.首頁頂部通欄,尺寸468×60
3.首頁頂部通欄,尺寸760×60
4.首頁中部通欄,尺寸580×60
5.內頁頂部通欄,尺寸468×60
6.內頁頂部通欄,尺寸760×60
7.內頁左上,尺寸150×60或300×300
8.下載地址頁面,尺寸560×60或468×60
9.內頁底部通欄,尺寸760×60
10.左漂浮,尺寸80×80或100×100
11.右漂浮,尺寸80×80或100×100
以上幾種說法可能有點小的出入,大家可以探討一下。
拓展閱讀:網頁設計防止頁面被撐開的方法
一、直接在網頁里設置圖片大小,比如代碼:img src="/uploads/allimg/200907/20090701160532188.jpg" width="600" height="500" border="0",這樣雖然可以限制了圖片大小,但是需要在上傳圖片之前手動修改圖片大小,否則上傳的圖片就會變形。
二、使用如下代碼:img src="/uploads/allimg/200907/20090701160532188.jpg" onload="javascript:if(this.width600}{this.resized=true;this.style.width=600;}"
這種方法會在調用圖片的時候,自動按比例縮小到指定的寬度,不會引起圖片的變形,並且也不會撐破表格,但是缺點是,如果圖片太大,在圖片下載過程中,也就是圖片顯示過程中,會先以圖片原大小顯示,這時就會撐破表格,頁面很難看,二當圖片完全顯示後,圖片又會自動縮小。
三、我們可以針對表格的'屬性來限制大小防止被撐開,比如在table width="600" border="0" cellpadding="0" cellspacing="0"里添加代碼「」,其中「table-layout:fixed; 」是為了將表格布局固定住,就可以有效地防止表格被撐開,「word-wrap:break-word; 」是控制換行的,也就是強制執行換行,這個在文本內容較多的情況下需要使用到,特別是重復的內容出現,不執行換行的話,表格就被撐開了;而「word-break: break-all; 」可以解決IE的框架被英文(非亞洲語言文本行)撐開的問題,但是不會強制換行,只顯示表格寬度里的內容。一般情況下只要用到「」就可以。當然,上面調用的語句可以定義在css里,比如
table {
table-layout: fixed;
word-wrap:break-word;
}
四、用css控制圖片自適應大小,代碼如:
img {
max-width: 600px;
width:expression(this.width 600 ? "600px" : this.width);
overflow:hidden;
}
其中 max-width:600px; 在IE7、FireFox等其他非IE瀏覽器下最大寬度為600px,但在IE6中無效;width:600px; 在所有瀏覽器中圖片的大小為600px,當圖片大小大於600px,自動縮小為600px,在IE6中有效;而 overflow:hidden; 指將超出設置大小的部分隱藏,避免控制圖片大小失敗而引起的表格撐開變形。
五、最後總結一下最實用的代碼:
如果是表格,請用:
table {
table-layout: fixed;
word-break: break-all;
}
如果是div層,請用:
div {
table-layout: fixed;
word-wrap: break-word;
width: 加上寬度;
overflow: hidden; (讓多出來的不顯示。)
}
❷ 網頁設計合適的頁面尺寸是多少
網頁設計選用的解析度是72像素,使用的畫布尺寸1920px*1080px。但是並不意味著在整個畫布上進行設計,一般採用全屏展示和兩側留白的方式。
全屏展示,是整個網站看起來大氣一些,但是布局要合理安排,不然看起來有些傻大的感覺。
兩側留白是為了適配不同電腦屏幕的尺寸,能夠確保網站只是電腦站的時候一些筆記本電腦也能顯示全面網站的內容區域,內容限時區域在好控制在1000px-1200px。
❸ Web網頁設計尺寸,到底選哪個
很多新手設計師都會面對一個問題,Web頁面尺寸寬度到底選哪個?
其實答案並不是固定的,可以做成1920,也可以做1280。黑客認為最重要的決定因素在於你自己的工作電腦解析度。
這是廣告公司AdDuplex送出的統計大數據
市面上的電腦屏幕尺寸多種多樣,不過大部分都集中在這幾種:
1920-1080:目前常用設備中最大的尺寸(Mac 5K屏除外)
1440-900:15寸MacBook Pro為代表,很多UI設計師首選
1366-768:普通的PC電腦
1280-800:13寸MacBook Pro為代表
在以上設備中,13寸和15寸Mac Book,雖然實際解析度非常大,但由於是Retina屏幕,視覺展示上還屬於以上范圍。
所以,網站的內容顯示寬度大部分都在1200px以內,確保小的電腦屏幕能顯示全網頁內容。更早的時候很多都是960px,不過由於屏幕越來越大,目前比較少。
在了解過電腦屏幕尺寸後,網頁設計尺寸(本文專指寬度,高度不限)選哪個也很清楚了:選哪個都不會錯。
事實上很多設計師是這么做的:用小於1920的屏幕去設計1920的網頁。
這樣設計沒錯,而且是很多培訓機構、學校的標準定義:網頁設計寬度尺寸是1920。
但是如果你用了這個神器的Sketch插件,就不會按照之前的結論來設計了。
以前黑客有介紹過。 點擊查看
設計師在做界面的過程中需要經常查看設計稿,以便及時修改設計細節。除非你用1920的屏幕可以設計1920尺寸,否則我們的設計尺寸和屏幕尺寸不相同,就會導致預覽的界面偏移,需手動調節居中。
如果設計的尺寸和屏幕尺寸保持一致,那麼插件預覽的效果就會完美,不用每次都要去調節。
本質上網頁設計尺寸選哪個都是正確的,關鍵在於怎麼方便、快捷地幫助我們預覽、展示設計稿。
在利用sketch插件頻繁預覽的前提下,黑客建議網頁設計尺寸等於你的工作電腦屏幕尺寸,這會節約你很多時間。在設計後台類的界面時,這個方法的優勢會更加明顯。
最後有一點需要注意,在進行切圖的時候,如果遇到全屏的圖,需要把切圖修改成1920,否則在1920電腦中切圖寬度會不足。不過到了切圖這一步,就屬於設計工作的後期了,我們只需要花點時間把對應切圖改成1920即可。
更多UI設計干貨文章請關注UI黑客
微信公眾號 uihacker
UI黑客官網 http://www.uihacker.com/
UI黑客論壇 http://bbs.uihacker.com/
❹ 一般做網頁設計背景尺寸定多大
網頁的背景多大要看對網頁的要求的。
網頁設計標准尺寸:
1、800*600下,網頁寬度保持在778以內,就不會出現水平滾動條,高度則視版面和內容決定。
2、1024*768下,網頁寬度保持在1002以內,如果滿框顯示的話,高度是612-615之間,就不會出現水平滾動條和垂直滾動條。
為了做到主題鮮明突出,要點明確,應該使配色和圖片圍繞預定的主題;調動一切手段充分表現網站點的個性和情趣,辦出網站的特點。
專業的網頁設計,需要經歷以下幾個階段:
需要根據消費者的需求、市場的狀況、企業自身的情況等進行綜合分析,從而建立起營銷模型。
以業務目標為中心進行功能策劃,製作出欄目結構關系圖。
以滿足用戶體驗設計為目標,使用axure rp或同類軟體進行頁面策劃,製作出交互用例。
以頁面精美化設計為目標,使用PS、AI等軟體,調整,使用更合理的顏色、字體、圖片、樣式進行頁面設計美化。
根據用戶反饋,進行頁面設計調整,以達到最優效果。
以上內容參考:網路-網頁設計
❺ 一般網頁的尺寸規范是多少
網站 首頁頁面寬度 px
Yahoo! 950
淘寶 950
MySpace 960
新浪 950
網易 960
Live Search 958
搜狐 950
優酷 960
AOL 960
隨著電腦的發展,顯示器是越來越大,解析度也是越來越高,為了照顧所有不同顯示器的用戶,把網站的製作尺寸規范就定在1024*768下,網頁寬度保持在1002-1004以內,高度還是以根據需要製作的內容在定,如果只想網頁只在一屏內顯示,不要上下滾動條, 一般高度是600-635像素之間, 就不會出現垂直滾動條。
在ps裡面做網頁可以在1003*600狀態下顯示全屏,頁面的下方也不會出現滑動條,尺寸為1003*650像素左右 。
1、在IE6.0下,寬度為顯示器解析度減21,比如1024的寬度-21就變成1003。但值得注意的是IE6.0(或更低)無論你的網頁多高都會有右側的滾動條框。
2、在Firefox下,寬度的分率辨減19。比如1024的寬度-19就變成1005
3、在Opear下,寬度的分率辨減23。比如1024的寬度-23就變成1001
網站頁面大小其實並沒有一個統一的標准,不過網站建設好之後要記得測試各瀏覽器的兼容性,很可能在IE沒問題的情況下,其他瀏覽器出現錯位的情況。
❻ 網頁設計最合適的頁面尺寸是多少
尺寸是沒有最合適一說的,主要就是看需求,目前主流是1000像素,這樣基本上可以兼容各種電腦屏了。
如果為了滿屏,可以在製作的時候讓網頁元素寬按照百分比設置
❼ web端最小圖標是多大
web端最小圖標是16×16。
web端指的是電腦端的網頁版。
❽ Web 頁面採用多大的寬度最合適
Web 頁面採用多大的寬度最合適
網頁設計標准尺寸:
1. 800×600下,網頁寬度保持在778以內,就不會出現水平滾動條,高度則視版面和內容決定。
2. 1024×768下,網頁寬度保持在1002以內,如果滿框顯示的話,高度是612눯之間,就不會出現水平滾動條和垂直滾動條。
3. 在ps裡面做網頁可以在800×600狀態下顯示全屏,頁面的下方又不會出現滑動條,尺寸為740×560左右。
網頁設計在初始要界定出網頁的尺寸大小.就像繪畫給出一塊畫版來.這樣才能方便設計.
網頁的尺寸受限於兩個因素:一個是顯示器螢幕.顯示器現在種類很多,以17寸為主流, 正在朝19寸及寬屏的方向發展.但目前也有為數不少的15寸顯示器.另一個是瀏覽器軟體,就是我們常用的IE,遨遊,Friefox等.
高度:
高度是可以向下延展的,所以一般對高度不限制. 對於一屏來說,一般沒有一個固定值,因為每個人的瀏覽器的工具欄不同,我見過有的瀏覽器工具欄被外掛佔了半個螢幕,所以高度沒有確切值。
寬度:
1、在IE6.0下,寬度為顯示器解析度減21,比如1024的寬度-21就變成1003。但值得注意的是IE6.0(或更低)無論你的網頁多高都會有右側的滾動條框。
2、在Firefox下,寬度的分率辨減19。比如1024的寬度-19就變成1005
3、在Opear下,寬度的分率辨減23。比如1024的寬度-23就變成1001
註:Firefox或Opear在內容少於瀏覽器高度時不顯示右側滾動條。
所以如果是1024的解析度,你的網頁不如設成1000安全一點。設成900兩側空白更大,視覺上更舒服一點.也方便做一些浮動層的設計.
如果是800的解析度一般都設成770。但也有設成760的.
這些需要明白並且牢記,不然很可能做出來不符合瀏覽器要求,不過一般我們都回設定的再稍微小一點,應為有些瀏覽器加了外掛或者其他的東西寬度會有變化所以 800的解析度一般設定760左右,1024的設定990左右.
網頁設計標准尺寸:
1、800*600下,網頁寬度保持在778以內,就不會出現水平滾動條,高度則視版面和內容決定。
2、1024*768下,網頁寬度保持在1002以內,如果滿框顯示的話,高度是612-615之間.就不會出現水平滾動條和垂直滾動條。
3、在ps裡面做網頁可以在800*600狀態下顯示全屏,頁面的下方又不會出現滑動條,尺寸為740*560左右
4、在PS里做的圖到了網上就不一樣了,顏色等等方面,因為WEB上面只用到256WEB安全色,而PS中的RGB或者CMYK以及LAB或者HSB的色域很寬顏色范圍很廣,所以自然會有失色的現象.
頁面標准按800*600解析度製作,實際尺寸為778*434px
頁面長度原則上不超過3屏,寬度不超過1屏
每個標准頁面為A4幅面大小,即8.5X11英寸
全尺寸banner為468*60px,半尺寸banner為234*60px,小banner為88*31px
另外120*90,120*60也是小圖示的標准尺寸
每個非首頁靜態頁面含圖片位元組不超過60K,全尺寸banner不超過14K
標准網頁廣告尺寸規格
一、120*120,這種廣告規格適用於產品或新聞照片展示。
二、120*60,這種廣告規格主要用於做LOGO使用。
三、120*90,主要應用於產品演示或大型LOGO。
四、125*125,這種規格適於表現照片效果的影象廣告。
五、234*60,這種規格適用於框架或左右形式主頁的廣告連結。
六、392*72,主要用於有較多圖片展示的廣告條,用於頁首或頁尾。
七、468*60,應用最為廣泛的廣告條尺寸,用於頁首或頁尾。
八、88*31,主要用於網頁連結,或網站小型LOGO。
廣告形式 畫素大小 最大尺寸 備注
BUTTON 120*60(必須用gif) 7K
215*50(必須用gif) 7K
通欄 760*100 25K 靜態圖片或減少運動效果
430*50 15K
超級通欄 760*100 to 760*200 共40K 靜態圖片或減少運動效果
巨幅廣告 336*280 35K
585*120
豎邊廣告 130*300 25K
全屏廣告 800*600 40K 必須為靜態圖片,FLASH格式
圖文混排 各頻道不同 15K
彈出視窗 400*300(盡量用gif) 40K
BANNER 468*60(盡量用gif) 18K
懸停按鈕 80*80(必須用gif) 7K
流媒體 300*200(可做不規則形狀但尺寸不能超過300*200) 30K 播放時間 小於5秒60幀(1秒/12幀)
網頁中的廣告尺寸
1.首頁右上,尺寸120*60
2.首頁頂部通欄,尺寸468*60
3.首頁頂部通欄,尺寸760*60
4.首頁中部通欄,尺寸580*60
5.內頁頂部通欄,尺寸468*60
6.內頁頂部通欄,尺寸760*60
7.內頁左上,尺寸150*60或300*300
8.下載地址頁面,尺寸560*60或468*60
9.內頁底部通欄,尺寸760*60
10.左漂浮,尺寸80*80或100*100
11.右漂浮,尺寸80*80或100*10
1.65主頻的cpu用多大的 顯示卡 最合適 還有 多大的記憶體 最合適
您好。 建議您 用128MB的顯示卡 和1G記憶體 本身您的CPU主頻就不是很高 如果用好點的顯示卡 和高點的記憶體 就浪費了
櫥櫃拉籃寬度選擇多大最合適?
櫥櫃拉籃一般是根據您家櫥櫃吃尺寸來定做的,深度42cm的常用櫥櫃拉籃尺寸:600櫃體為52.3*14cm,700櫃體為62.3*14cm,750櫃體為66.6*14cm,800櫃體為72.3*14cm等,深度45.5cm的常用櫥櫃拉籃尺寸(:600櫃體為56.5*20cm,700櫃體為66.5*20cm,750櫃體為71.5*20cm,800櫃體為76.5*20cm等
淘寶手機詳情頁面寬度到底多少最合適咧?
手機螢幕尺寸有大有小,寬度480 – 620畫素會比較合適。格式為JPGGIFPNG。當需要在圖片上新增文字時,中文字型大於等於30號字,英文和阿拉伯數字大於等於20號字。
4.2米寬的客廳用多大的電視最合適
電視距離適宜在3米左右,根據沙發到電視的距離來決定。
1.7米使用26英寸
2米使用32英寸
2.4米使用37英寸
2.5米使用40英寸
2.7米使用42英寸
3米使用46英寸
3.3米使用52英寸
用多大的魚缸養銀龍最合適
按尺寸來說 最小尺寸是一米 寬40 銀龍體長不得超過40 如果銀龍體長超過50 就建議一米二寬50以上的缸子養了 一米五 一米八 兩米都能養 越大越好唄
金毛用多大的狗窩最合適
如果你養的是金毛犬,那就更該如此了,要讓它知道,白天當然不用說,夜晚這就是它睡覺的地方,不許它想在哪兒睡就在哪兒睡。
對於金毛犬來說,給它指定了一個住處,讓它在想躺的時候也能隨便在那兒伸伸腰,也算比較自在。
狗屋沒必要十分講究,只要寬敞就好。其實用個紙箱子或者木箱子在上面鋪塊毛巾也行。若買商店裡賣的狗屋,則有條件在客人來訪前,事先將金毛犬關起來,的確很方便。
狗屋應放置在安靜、偏暗點兒的地方,最好選在冬暖夏涼、通風避曬之處,可能的話冬季和夏季應選在不同的地方。
也可以用鐵籠子代替狗屋
要是你們家足夠敞的話,也可以在屋裡准備一個鐵籠子,裡面同時可以放上便器和金毛犬睡覺的窩。有一種能摺疊的鐵籠子,可以很方便地拆運安裝,天氣好時還可以把金毛犬連籠子挪到院子里曬曬太陽。
中星九號用多大的鍋最合適
目前用小鍋接收中星9號的人佔百分之九十九以上,因為它上面有免費的46套央視及省級衛視節目。其它衛星如亞太5號、新天11符和韓星5號上面節目少,也沒有多大的收看價值。最小的小鍋直徑35厘米左右。 中星9號位於西南方向.應該影響不大。
86用多大輪胎最合適
1.抓地力增加。2。增加車身高度,3增加行車穩定性。4.油耗增加。5。對輪轂,內襯,轉向角度,有影響!
❾ Web和Ui設計尺寸規范有哪些
WEB端
必備元素:logo、培並做menu(導航)、banner(動效【flash、H5】)、內容區(新聞、企業簡介、產品展示...)、版權信息(版權所有、聯系方式)
可選元素:搜索、電話、在線客服、流量統計...
用戶體驗習慣:左:瀏覽區域、列表區域
右:功能區域、內容區域
字體:最小12px,最黑#333333
字體12px、14px、16px效果選擇無,其他字型大小則用銳利配衡、犀利、渾厚等
標題部分字體:14px~24px(盡可能採用雅黑)
正文部分字體:12px、14px(雅黑或者宋體),字行距一般為1.5~2倍之間。
尺寸規范:在解析度1024px*768px的情況下,滿屏寬度為1003px,通常定義可視范圍為920px~1000px之間。常見:寬960px、980px、1000px,一屏高度650px。
UI方面
iOS
iphone字體、字蔽團號標准
字體:中文:蘋方;英文:舊金山
字型大小:正文最小24px;常駐欄icon20px
Andriod字體:中文:思源黑體;英文:roboto
字型大小:注釋最小:24px;文本:28px;文章標題或圖標名稱:32px;導航標題:36px(在這里為720px*1280px的尺寸下設計規范,註:1sp=2px)
界面尺寸
圖標尺寸
以上內容希望可以幫到你!