When designing a website, there is one of the most common guiding principles: in principle, the page length should not exceed 3 screens, and the width should not exceed 1 screen. This principle is clearly based on the user experience, especially the width of a screen, the most basic manifestation is that the browser does not show a horizontal scroll bar, which is almost the current design principle. How big is one screen?
When a common user browses a webpage, the valid area of the webpage will be affected by the following aspects:
Display resolution
This is determined by the technological development and user purchasing power and preferences. The data depends on statistics.
Operating System
There is no doubt that Windows is the world, where Windows XP Accounts for the vast majority.
Web Browser
Ie still has the highest share, but Firefox, opera and Safari also have a certain market.
Customization
It is mainly used to customize the operating system style, whether the operating system taskbar is hidden, and the Browser style. However, this part should belong to advanced users, most users still use the default Operating System and Browser style.
The following are statistics on browser and screen resolution:
From the above data, we can conclude that:
Basically, the user resolution is above 800x600, and most of them are above 1024x768. from the global perspective, the resolution of 800x600 will be fewer and fewer.
Browsers in China are still the world of Internet Explorer 6, which will last for a long time. From the global market, firefox2.0 and IE7 in China will gradually grow. Especially when the Chinese version of IE7 is launched, windows auto update is promoted, and IE7 will grow faster with Vista.
Therefore, the size of a screen should be calculated based on the following principles:
One screen refers to the effective visible area of web pages displayed in browsers of most users.
The computing environment of one screen is Windows XP and the browser is in the default style.
Because IE has a vertical scroll bar no matter whether the screen is exceeded or not, Firefox and opera have a vertical scroll bar when the page is larger than a screen, and most web pages have vertical scroll bars, therefore, the size of a screen is calculated based on the browser's vertical scroll bar.
Firefox2.0 does not display the control bar of multiple windows when only one web page is browsed, while other multi-window browsers have the control bar of multiple windows, and multiple web pages are browsed simultaneously when used, therefore, when the size of a screen exists in the control bar of multiple windows in Firefox.
The following figure shows the data results of common browsers and resolutions based on the above principles:
Valid visible area (unit: Px)
Screen 1, 2, 3
800 600 1024 768 1280 1024
Ie6.0 779 (+ 21) 432 (+ 168) 1003 (+ 21) 600 (+ 168) 1259 (+ 21) 856 (+ 168)
Ie7.0 779 (+ 21) 452 (+ 148) 1003 (+ 21) 620 (+ 148) 1259 (+ 21) 876 (+ 148)
Firefox2.0 783 (+ 17) 417 (+ 183) 1007 (+ 17) 585 (+ 183) 1263 (+ 17) 841 (+ 183)
Opera9.0 781 (+ 19) 461 (+ 139) 1005 (+ 19) 629 (+ 139) 1261 (+ 19) 885 (+ 139)
Explanations of the above data and other facts:
The valid visible area of customized windows classic style IE6 in 800 × 600 resolution and Windows XP is 780 × 445, in Windows 98, Windows 2000, and windows, the layout of ie5.0, ie5.5, and ie6.0 is similar in the classic style. Therefore, the default style of Windows XP should be larger in the same resolution.
Knowing the browser model and screen resolution can easily calculate the visible area, for example, the visible area of ie7.0 under 1024 × 768 is (1024-21) × (1024-148)
Based on all the above data, the conclusions are as follows:
The most conservative and compatible screen size is: 779x432
The widest screen size is 1003x600.
Suitable for the current domestic situation, the size of one screen is 779 × 600