首頁 web前端 css教學 網頁佈局設計的標準尺寸_經驗交流

網頁佈局設計的標準尺寸_經驗交流

May 16, 2016 pm 12:06 PM

1、800*600下,網頁寬度維持在778以內,就不會出現水平捲軸,高度則視版面和內容決定。
2、1024*768下,網頁寬度保持在1002以內,如果滿框顯示的話,高度是612-615之間.就不會出現水平滾動條和垂直滾動條。
3、在ps裡面做網頁可以在800*600狀態下顯示全屏,頁面的下方又不會出現滑動條,尺寸為740*560左右 
4、在PS裡做的圖到了網上就不一樣了,顏色等等方面,因為WEB上面只用到256WEB安全色,而PS的RGB或CMBK以及LABBBBB3BBBBBBB的顏色>頁面標準以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                              必須為靜態圖片,FLASH格式 
圖文混排                                                                       40K 
BANNER          468*60(盡量使用gif) 18K 
懸停按鈕           80*80(必須使用gif)                 300*200(可做不規則形狀但尺寸不能超過300*200) 30K 播放時間 小於5秒60幀(1秒/ 12格)
網頁中的廣告尺寸
1.首頁右上,尺寸120*60       2.首頁上方通欄,尺寸468*60       3.首頁上方欄位,尺寸760*60
7.內頁左上,尺寸150*60或3000*300 ,尺寸560*60或468*60
9.內頁底部通欄,尺寸760*60      10.左浮,尺寸80*80或100*100
11.右漂浮,尺寸80*80或100 *100以上幾種說法可能有點小的出入,大家可以探討一下。


IAB和EIAA發布新的網路廣告尺寸標準
 在這6種格式中,除了去年iab發布的4種「通用廣告包」中的格式:160x600, 300x250, 180x150及728x90,還包括新公佈的468x60 及120x600(擎天柱)2種。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

VUE 3 VUE 3 Apr 02, 2025 pm 06:32 PM

它的出局!恭喜Vue團隊完成了完成,我知道這是一項巨大的努力,而且很長時間。所有新文檔也是如此。

使用Redwood.js和Fauna構建以太坊應用 使用Redwood.js和Fauna構建以太坊應用 Mar 28, 2025 am 09:18 AM

隨著最近比特幣價格超過20k美元的攀升,最近打破了3萬美元,我認為值得深入研究創建以太坊

您可以從瀏覽器獲得有效的CSS屬性值嗎? 您可以從瀏覽器獲得有效的CSS屬性值嗎? Apr 02, 2025 pm 06:17 PM

我有人寫了這個非常合法的問題。 Lea只是在博客上介紹瞭如何從瀏覽器中獲得有效的CSS屬性。那樣的是這樣。

在CI/CD上有點 在CI/CD上有點 Apr 02, 2025 pm 06:21 PM

我說的“網站”比“移動應用程序”更合適,但我喜歡Max Lynch的框架:

帶有粘性定位的堆疊卡和一點點的雜物 帶有粘性定位的堆疊卡和一點點的雜物 Apr 03, 2025 am 10:30 AM

前幾天,我發現了科里·金尼文(Corey Ginnivan)網站上的這一點,當您滾動時,彼此之間的卡片堆放集。

在WordPress塊編輯器中使用Markdown和本地化 在WordPress塊編輯器中使用Markdown和本地化 Apr 02, 2025 am 04:27 AM

如果我們需要直接在WordPress編輯器中向用戶顯示文檔,那麼最佳方法是什麼?

比較瀏覽器的響應式設計 比較瀏覽器的響應式設計 Apr 02, 2025 pm 06:25 PM

這些桌面應用程序中有許多目標是同時在不同的維度上顯示您的網站。因此,例如,您可以寫作

為什麼Flex佈局中的紫色斜線區域會被誤認為是'溢出空間”? 為什麼Flex佈局中的紫色斜線區域會被誤認為是'溢出空間”? Apr 05, 2025 pm 05:51 PM

關於Flex佈局中紫色斜線區域的疑問在使用Flex佈局時,你可能會遇到一些令人困惑的現象,比如在開發者工具(d...

See all articles