Web design dimensions and rules for advertising design on web pages

Web design dimensions and rules for advertising design on web pages

1. Under 800*600, if the width of the web page is kept within 778, there will be no horizontal scroll bar. The height depends on the layout and content.
2. Under 1024*768, the width of the web page should be kept within 1002. If it is displayed in full frame, the height should be between 612-615. No horizontal scroll bar or vertical scroll bar will appear.
3. When making a web page in PS, it can be displayed in full screen at 800*600, and there will be no sliding bar at the bottom of the page. The size is about 740*560
4. The pictures made in PS will be different when they are posted on the Internet, in terms of color, etc., because the WEB only uses 256 WEB safe colors, while the color gamut of RGB or CMYK and LAB or HSB in PS is very wide, so there will naturally be a phenomenon of color loss.
The page is made with a standard resolution of 800*600, and the actual size is 778*434px
In principle, the page length should not exceed 3 screens, and the width should not exceed 1 screen. Each standard page is A4 format, i.e. 8.5X11 inches. 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 and 120*60 are also standard sizes for small icons. Each non-homepage static page containing images should not exceed 60K bytes, and the full-size banner should not exceed 14K.
Standard web page advertising size specifications <br />1. 120*120, this advertising specification is suitable for product or news photo display.
2. 120*60: This advertising specification is mainly used for LOGO.
3. 120*90, mainly used for product demonstration or large LOGO.
4. 125*125: This specification is suitable for image advertisements with photo effects.
5. 234*60: This specification is suitable for advertising links on framed or left-right homepages.
6. 392*72, mainly used for advertising strips with more pictures, used for headers or footers.
7. 468*60, the most widely used advertising banner size, used for headers or footers.
8. 88*31, mainly used for web links or small website LOGOs.
Ad format Pixel size Maximum size Remarks
BUTTON 120*60 (must use gif) 7K
215*50 (must use gif) 7K
Full-width 760*100 25K static image or reduce motion effect
430*50 15K
Super banner 760*100 to 760*200 40K in total Static image or reduced motion effect Large advertisement 336*280 35K
585*120
Vertical Advertisement 130*300 25K
Full screen advertisement 800*600 40K Must be a static image, FLASH format mixed text and graphics, different for each channel 15K
Pop-up window 400*300 (use gif as much as possible) 40K
BANNER 468*60 (use gif as much as possible) 18K
Hover button 80*80 (must use gif) 7K
Streaming media 300*200 (can be made into irregular shapes but the size cannot exceed 300*200) 30K Playback time is less than 5 seconds 60 frames (1 second/12 frames)
Ad size on the page
1. Top right of home page, size 120*60
2. The top bar of the home page, size 468*60
3. The top bar of the home page, size 760*60
4. The middle column of the home page, size 580*60
5. Top column of inner page, size 468*60
6. Top column of inner page, size 760*60
7. Inner page, top left, size 150*60 or 300*300
8. Download address page, size 560*60 or 468*60
9. The bottom column of the inner page, size 760*60
10. Left floating, size 80*80 or 100*100
11. Right floating, size 80*80 or 100*100. The above statements may have slight discrepancies, you can discuss it.
IAB and EIAA release new online ad size standards <br />Among these 6 formats, in addition to the 4 formats in the "Universal Ad Package" released by IAB last year: 160x600, 300x250, 180x150 and 728x90, there are also 2 newly announced formats: 468x60 and 120x600 (Optimus Prime).

<<:  Vue state management: using Pinia instead of Vuex

>>:  Baidu Input Method opens API, claims it can be ported and used at will

Recommend

Sample code for CSS dynamic loading bar effect

Using the knowledge of CSS variables, I will dire...

HTML is the central foundation for the development of WEB standards

HTML-centric front-end development is almost what ...

MySQL incremental backup and breakpoint recovery script example

Introduction Incremental backup means that after ...

...

Detailed explanation of persistent storage of redis under docker

In this chapter, we will start to operate redis i...

Write a simple calculator using JavaScript

The effect is as follows:Reference Program: <!...

MySQL index usage instructions (single-column index and multi-column index)

1. Single column index Choosing which columns to ...

Ubuntu20.04 VNC installation and configuration implementation

VNC is a remote desktop protocol. Follow the inst...

Solution to CSS anchor positioning being blocked by the top fixed navigation bar

Many websites have a navigation bar fixed at the ...

A method of making carousel images with CSS3

Slideshows are often seen on web pages. They have...

MySQL series: redo log, undo log and binlog detailed explanation

Implementation of transactions The redo log ensur...

How to implement HTML Table blank cell completion

When I first taught myself web development, there...

Detailed explanation of scheduled tasks and delayed tasks under Linux

at at + time at 17:23 at> touch /mnt/file{1..9...

Detailed explanation of Linux netstat command

Table of contents Linux netstat command 1. Detail...