Standard Dimensions for webpage layout design-Experience Sharing

Source: Internet
Author: User
Tags color gamut
Many webpage designs are confused when designing the webpage layout, and the width and size of the webpage are 800*600 and 1024*768, how many pixels should a webpage be designed? The horizontal scroll bar will appear when it is too wide. Next we will explain the standard size of the webpage design. 1. If the webpage width is within 800 for 600*778, the horizontal scroll bar will not appear. The height is determined by the layout and content.
2. In the case of 1024*768, the webpage width is kept within 1002. If the box is full, the height is between 612-615. the horizontal and vertical scroll bars will not appear.
3. In ps, a webpage can be displayed in full screen in the 800*600 status, and no slide is displayed at the bottom of the page. The size is about 740*560.
4. The pictures made in PS are different from those made on the Internet, in terms of color and so on, because only WEB security colors are used on the WEB, however, the color gamut of RGB, CMYK, LAB, or HSB in PS is very wide, so it is naturally eclipsed.
The page is made in a standard resolution of 800*600. The actual size is 778 * 434px.
In principle, the page length cannot exceed 3 screens, and the width cannot exceed 1 screen.
Each standard page is an A4 size, that is, 8.5X 11 inch
The full-size banner is 468 * 60px, the half-size banner is 234 * 60px, and the small banner is 88 * 31px.
In addition, 120*90,120*60 is also the standard size for small icons.
Each non-homepage static page contains no more than 60 K image bytes, and the full size banner cannot exceed 14 K

Standard webpage advertisement size
I. 120*120. This advertisement type is applicable to product or news photos.
Ii. 120*60. This advertisement type is mainly used for LOGO use.
3. 120*90, mainly used for product demonstration or large LOGO.
Iv. 125*125. This type is suitable for image advertisements that show the photo effect.
5. 234*60. This specification is applicable to ad links on the frame or homepage.
6. 392*72. It is mainly used for AD strips with a large number of images and for headers or footers.
Seven, 468*60, the most widely used advertising bar size, used for the header or footer.
8. 88*31, mainly used for webpage links or small website logos.
Ad format, pixel size, maximum size, remarks
BUTTON 120*60 (must use gif) 7 K
215*50 (must use gif) 7 K
760*100, K static images or reduced Motion
430*50 15 K
Super topic 760*100 to 760*200 a total of 40 K static images or reduce motion effect
Huge advertisement: 336*280 35 K
585*120
Vertical ad 130*300 25 K
Full Screen advertisement 800*600 40 K must be a static image, FLASH format
Different channels are arranged in a text-and-image manner for 15 K
Pop-up window 400*300 (try to use gif) 40 K
BANNER 468*60 (use gif whenever possible) 18 K
Hover button 80*80 (must use gif) 7 K
Streaming media 300*200 (irregular shape, but the size cannot exceed 300*200) 30 K playback time less than 5 seconds 60 frames (1 second/12 frames)
Advertisement size in Webpage
1. the upper right corner of the home page. The size is 120*60. 2. The top navigation bar of the home page. The size is 468*60. 3. The top navigation bar of the home page. The size is 760*60.
4. Middle navigation bar on the home page. Size: 580*60 5. Top navigation bar on the inner page. Size: 468*60 6. Top navigation bar on the inner page. Size: 760*60
7. Top left of the inner page. Size: 150*60 or 300*300 8. Page. Size: 560*60 or 468*60
9. The middle column at the bottom of the inner page. The size is 760*60 10. Float left. The size is 80*80 or 100*100.
11. Right float. The size of 80*80 or 100*100 may be slightly different. You can discuss it.


IAB and EIGA release new online advertisement size standards
In these 6 formats, except for the four generic ad packages released by iab last year: 160x600,300x250,180 x150 and 728x90, it also includes two new types: 468x60 and 120x600 (Optimus Prime.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.