Design for what screen resolution?

9 Jun 2010 - 6:56pm
3 years ago
5 replies
1624 reads
Shraddha Sorte
2007

What screen resolution should a Rich Internet Application be designed for?


The following table from http://www.w3schools.com/browsers/browsers_display.asp suggests that most computers are using a screen resolution higher than 1024 X 768.


While designing an web solution, should be consider the majority percentage from the statistics below or should we go with a median?

 

Display Resolution

Date

Higher

1024x768

800x600

640x480

Unknown

January 2010

76%

20%

1%

0%

3%

January 2009

57%

36%

4%

0%

3%

January 2008

38%

48%

8%

0%

6%

January 2007

26%

54%

14%

0%

6%

January 2006

17%

57%

20%

0%

6%

January 2005

12%

53%

30%

0%

5%

January 2004

10%

47%

37%

1%

5%

January 2003

6%

40%

47%

    2%

5%

January 2002

 6%

34%

52%

3%

5%

January 2001

 5%

29%

55%

6%

5%

January 2000

 4%

25%

56%

11%

4%

 

 

With the breakdown of “Higher” that maps to

The following table is a breakdown of the resolutions higher than 1024x768 from our Brower Display Statistics:

January 2010

Resolution

% of Total

1280x1024

18.2 %

1280x800

17.3 %

1440x900

10.5 %

1680x1050

10.0 %

1920x1200

4.6 %

1366x768

3.6 %

1920x1080

2.3 %

1152x864

2.1 %

1600x1200

1.4 %

1280x768

1.2 %

Other

4.8 %

These statistics are based on W3Schools users.

Comments

9 Jun 2010 - 10:31pm
Simon Setterstrom
2009

I've found the following link to be pretty useful: http://browsersize.googlelabs.com

If you want to know more about it: http://googlecode.blogspot.com/2009/12/introducing-google-browser-size.html

10 Jun 2010 - 2:05am
burlapdesign
2010

displays should be adaptive especially for internet applications. what the results also show are the wide variability in screen sizes.
Here is a good primer on the technique of adaptive layouts: http://www.smashingmagazine.com/2009/06/09/smart-fixes-for-fluid-layouts/

On Wed, Jun 9, 2010 at 9:29 PM, Shraddha Sorte <shraddha.sorte@gmail.com> wrote:

What screen resolution should a Rich Internet Application be designed for?


The following table from http://www.w3schools.com/browsers/browsers_display.asp [1] suggests that most computers are using a screen resolution higher than 1024 X 768.


While designing an web solution, should be consider the majority percentage from the statistics below or should we go with a median?

 

-------- DISPLAY
       RESOLUTION ----------------------------------------------------------

*Date*

*Higher*

*1024x768*

*800x600*

*640x480*

*Unknown*

January 2010

76% [2]

20%

1%

0%

3%

January 2009

57%

36%

4%

0%

3%

January 2008

38%

48%

8%

0%

6%

January 2007

26%

54%

14%

0%

6%

January 2006

17%

57%

20%

0%

6%

January 2005

12%

53%

30%

0%

5%

January 2004

10%

47%

37%

1%

5%

January 2003

6%

40%

47%

   
2%

5%

January 2002

 6%

34%

52%

3%

5%

January 2001

 5%

29%

55%

6%

5%

January 2000

 4%

25%

56%

11%

4%

 

 

With the breakdown of
“Higher” that maps to

The following table is a breakdown
of the resolutions higher than 1024x768 from our
Brower Display
Statistics
:

*January
2010*

*Resolution*

*% of
Total*

1280x1024

18.2 %

1280x800

17.3 %

1440x900

10.5 %

1680x1050

10.0 %

1920x1200

4.6 %

1366x768

3.6 %

1920x1080

2.3 %

1152x864

2.1 %

1600x1200

1.4 %

1280x768

1.2 %

Other

4.8 %

These statistics are based on
W3Schools users.

(((Please leave a
11 Jun 2010 - 8:22am
Dasbender
2009

Agreed.  Two words: Liquid Layout.

That said, we obviously have to design within a certain range, before the size/proportion becomes so out of whack that the design should totally change, e.g., it's unrealistic to expect a UI optimized for 1280 x 768 to be just as effecive on my cellphone's 1" display.

11 Jun 2010 - 8:25am
Dasbender
2009

I guess it's also worth saying that it depends on what demographic you're designing for.  Those w3schools stats show what resolutions are most commonly used by people who visit the w3schools site.

I think my parents are still running 800 x 600, so you may want to optimize for a smaller resolution if you're selling something to retirees :)

13 Jun 2010 - 6:07am
Petra Quilitz
2009

 

I prefer sites like this: http://www.screenresolution.org/ for a more realistic insight. You can never get everyone to see your site the way it is intended. 

But if the designer or IA is deciding the screen resolution, there is something off in the project. Because it's not a design decision but a marketing decision.

 Usually you'd have a Senior Concepter  present the client with a selling strategy (on how the site will increase sales, boost brand performance, or increase partner relations) . In it, there would be a section titled "Target Audience" There you would sum up the information the client has given you (on request) about the demographical and biological but also technical aspects of the brand's audience.

 After this presentation, ideally, you have a client sign off on the most critical technical aspects: what resolutions, processor speeds and, most importantly, which browser versions to ignore when getting into the next phase, the design execution

 Often, a client will sign off on ignoring any percentage below 10%, which, for some brands can still be hundreds of thousands of users that won't be able to see the site properly. So this is a decision you don't want on your hands as a designer. This is better left to the client's marketing department. 

 If you don't have a client sign off on screen resolution and browser version, you can easily end up in deep trouble at the end of the project, when the client receives user feedback (people with the slowest computers, darkest monitors and oldest browsers are the ones to complain the first). If you don't have the sign off you can then look forward to the wonderful task of adapting the site to different screen resolutions and browser versions, for free.  (I don't know about you but I have other things to do in my free time than cleaning up after easily avoidable negotiation mistakes.)

As a general rule for many e-commerce sites (which are the ones that usually want to get as many people as possible): width: 1024 minus 20-30 pixel for browser frame and scroll bar = pretty much 1000 pixel,  height: 768 minus 80-100 pixel for bottom browser bar and possible app desktop bars on user computers = pretty much 680.

 

Syndicate content Get the feed