Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What the typical viewport size on a 1024x768 screen?

Tags:

I am designing a web application, and I wish to know the largest size (x and y) that I can design for.

As of January 2008, about half of users are using 1024x278 screens, and probably less than 10% are using smaller screens. (Phone and palmtop users are an exception here.) So we are designing for minimum screen size of 1024x768.

However, that's the screen size, and when we are laying out our content we need to know the viewport size. There is evidence that most users have the browser maximized, but one still must subtract out space for OS decorations and browser chrome. People customize their chrome, so there is no single "right" answer; I am going for a reasonable bound that will accommodate the majority of users.

I see plenty of designers who say that they use a width of 960 pixels because it has many factors and can be divided up evenly -- but before deciding on this I want to know the maximum size that I can get away with, then I might choose to use somewhat less. I have seen max widths of 960, 974 or even 990 quoted... my own experiments seem to show a width of 1000 works OK.

Heights are even more difficult to come by: I find I can fit a vertical viewport height of 595 pixels works on the browsers that I've tried, with typical default OS and chrome settings. But I haven't tried very many, and I would rather see a more authoritative source. Surely someone else has done this research and done it better than me.

So my real question is this: What is the largest viewport size I can design for and expect it to fit without scrollbars for 80-90% of all users?

like image 898
mcherm Avatar asked Jan 15 '09 16:01

mcherm


People also ask

What does it mean by a 1024x768 resolution?

It is usually quoted as width × height, with the units in pixels: for example, 1024 × 768 means the width is 1024 pixels and the height is 768 pixels. This example would normally be spoken as "ten twenty-four by seven sixty-eight" or "ten twenty-four by seven six eight".

What ratio is 1024x768?

If you divide 1024 by 768, the result is 1.33, so the 1024x768 computer resolution can be described as having an aspect ratio of 1.33:1.

What is the average viewport height?

1280×743 was the average viewport, 1280×721 was the median.


1 Answers

Today I just came across a site which is HIGHLY relevant to this old question of mine. Apparently Google is willing to share their knowledge about browser window sizes. Their new service is at http://browsersize.googlelabs.com/ and it basically just shows you their data on typical browser portal sizes.

Note: The Google Labs browsersize is now very out of date (the image is titled 2009-11-18-day_google_com_100_donate_example.png) and will be shut down soon. Google suggests that Google Analytics can be used to determine browser size distribution for your own site: http://analytics.blogspot.ca/2012/06/new-feature-conduct-browser-size.html

like image 186
mcherm Avatar answered Sep 28 '22 03:09

mcherm