Poll: If you had to optimize for 1 screen resolution, which would it be and why?

14 points by marcamillion ↗ HN
Place your vote and explain why in the comments.

I would love for people with enough traffic to make a statistically significant recommendation (i.e. 10K uinques/mo+), to look at their Google Analytics and use that information as their vote.

As an aside, my target market is designers.

47 comments

[ 3.1 ms ] story [ 101 ms ] thread
Sampling from 500,000 unique visits from 2010 that I randomly selected, I note that roughly 2% of visits were from iPhone-sized displays and 2% of visits were from 800x600 or 1024x600. At most 2-3 additional percent of visitors might have had resolutions worse than 1024x768. (I am uncertain because in the long tail of atypical screen resolutions, a few are lower than 1024x768 but most are actually atypically high. So this is a ballpark.)

Roughly 90-95% of visits had resolutions at least as good as 1024x768, with the modal resolution being 1280x800 (30% of all visitors).

We have about 13k uniques/month. Here is our break down for the last 30 days:

1920x1200: 19.98%

1280x800: 14.38%

1440x900: 13.25%

1680x1050; 13.03%

1920x1080: 7.20%

1280x1024: 6.31%

2560x1440: 5.08%

1024x768: 4.69%

1366x768: 2.24%

2560x1600: 2.16%

Important caveat: our market is professional photographers, which have larger than average monitors.

EDIT TO ADD: If it helps, our OS breakdown is 58% Mac, 39.5% Win, and the remaining mobile/linux.

That is...interesting. What are the aspect ratios on those monitors?
Computer monitors generally use square pixels, so it's trivial to calculate the aspect ratios using the resolutions.
wow, yeah 1920x1200 usually corresponds to a 24" monitor, which regular moms and pops aren't likely to have
Agreed. Looking at the same 500,000 uniques that I peeked at above, only 2% of our visitors have 1920x1200.
This is very interesting because it is highly likely that my target market (designers) has a similar screen resolution as yours.

Also interesting.....1280 x 800 is your second highest - i.e. 13" Macbook Pro.

That's very, very interesting.

our market is professional photographers

Here is data for an audience of amateurs and professionals (Steve's Digicams). 1 million unique visitors/month.

  1280x800 16.45%	
  1024x768 14.09%	
  1280x1024 13.02%	
  1680x1050 10.34%	
  1440x900 9.53%	
  1920x1200 6.03%	
  1366x768 5.08%	
  1920x1080 4.62%	
  1600x900 1.79%	
  1152x864 1.63%
80% Windows, 15% Mac
Am I the only person who has and uses a 1600x1200 monitor? People and their widescreen! ;)
It is getting harder and harder to find 4:3 monitors, so for me it's not my first choice that i now have a 1920x1080 as main screen. (I start drooling thinking of a 1920x1440 screen)
This is true and I'm looking forward to getting a 1920x1440 or higher monitor too.

I actually got a 4:3 monitor on purpose though, since at the time, big widescreen monitors were too expensive and I wasn't willing to settle for fewer vertical pixels (for programming, height is more important than width for me) and I didn't want the hassle of flipping a widescreen monitor sideways.

While high res screens seem relatively popular, I'm hoping that nobody is running their browser window maximized with 2560x1600 screen. I'm running 1680x1050, but still my browser window is 1085x1050 atm, with tab-bar taking 200px from the side.
I'm using 2048x1152, but my browser window is only 1161x1069. I sometimes maximize, but using HN with a maximised window is not an option :-)
A large part of the customer base for our premium web app is corporate. That means a lot (about 30%) run at 1280 x 1024, which I don't see in the poll as an option.
Regardless of which screen I happen to be using, my browser windows are usually 800 to 1000 px in width. If there's content beyond that width then it's probably just ad space.
I design so that people can use a display of any resolution to read my content. Why guess and be wrong 90% of the time when you can not guess and always be right?

The web is not print.

So what does that mean? What resolution do you design for? 800 x 600?

Also, if you design for 'the lowest common denominator', how does your site look when people view it in a 1920 x 1200 monitor?

Do you ever consider spoiling the experience for them?

Not being rude, but seriously curious.

It's not that difficult to optimize your page for several different screen sizes. A mobile view, small, med and large without having to create any new components. Also fluid design looks pretty decent even large if you do it right.
Well...as a general rule, I would agree with you. However, I am having a particular issue with some dimension issues of some of my elements and images.

I would like to have a very fluid design for all resolutions, i.e. % based, but I am running into many problems.

In an attempt to just get it fixed and launched, I started this poll to get an idea as to what the popular resolutions are.

See Manifold's comment above, there is much more that you can do than just using %'s. Looking for one true resolution is a straw man.
http://www.alistapart.com/articles/responsive-web-design/ is a useful reference point for creating fluid design. Essentially you can specify different css depending on the width of the browser window, which means you can cater to multiple types of user.

For a real example: http://hicksdesign.co.uk/journal/ implemented a 4-column layout at the end of June that looks great on both my 1920 monitor, and my mobile. Try resizing your browser window to see the effect in action.

I'm not a designer, simply a consumer. I have a 24" monitor, consider myself a gamer so I run at 1920 x 1200 and I'm not blind so my vote is 1920 x 1200 as I value the real estate on my desktop. I'm surprised to not see 1600 x 1200.
Did you read the post?

> I would love for people with enough traffic to make a statistically significant recommendation (i.e. 10K uinques/mo+), to look at their Google Analytics and use that information as their vote.

I don't think he wants to know what you personally prefer as a desktop resolution. He wants to know what is the best to optimize for his audience, which isn't gamers.

Nope, had no clue. Got lucky when I decided to talk about resolutions.
Did you comprehend the post?

The way the question was stated, he has a preference but it was never limited to only designers. I was surprised to not see 1600 x 1200 myself and so I posted. I didn't think that my comment affected things very much but since you took it upon yourself make condescending comments to me, everything has taken a turn to the worse.

If you don't have hardware acceleration, 640x480x16color. That's what God told me. You try full-screen 60FPS graphics at higher resolutions using a corei7 with no GPU, wiseass.
Optimizing for one screen resolution is a bad idea: people do have different screen resolutions, and will want the application to fit their needs, whether they live on a 1024x768 screen and pull the application window to 860 width because they want room for Skype/AIM/... alongside it or whether they have a 1900x1200 screen and just pull it up to 1400 pixels wide.

It's important to note that most people will not use your application full-screen - if you buy a larger screen, you usually do that because you want to fit more onto it (in the worst case: more Photoshop/Illustrator pixels when you're doing print stuff). Assuming that you can just design for one particular screen size, fullscreen, and stick out your tongue at anyone else, will cost at least some potential customers.

http://www.w3counter.com/globalstats.php

I produce that report each month from a couple dozen million visits. Targeting 1024x768 will make your site/app/whatever fit on well over 80% of screens.

I haven't run a viewport size report in a while but even when people run browsers non-maximized on large screens, they tend to be at least 1000 pixels wide.

I'd suggest a max of 1024px target because that can fit in an iPad's screen when held in landscape. Thinking about tablets now means that you can probably get the website to work with the iPad and the income tsunami of Android tablets with relative ease.
This leads to the next question of does the average user usually have their browser maximized (assuming you're developing a web app).

sqrt17 already touched on this - It's important to note that most people will not use your application full-screen

My gut feeling is that he's wrong as most users I've watched tended to immediately full screen their browser or have it open virtually full screen.

Just the other day I watched two people I consider fairly tech savvy get annoyed at IE opening with a small window, which they immediately maximized. They even asked me why it did that, as if it had been an ongoing annoyance.

2560x1600 with multiple monitors, preferably at least one portrait
(comment deleted)
I have had just over 10k uniques last month on my blog http://blog.dispatched.ch

Here's Google Analytics on screen resolution:

1. 1280x800 1,853 20.25%

2. 1440x900 1,337 14.61%

3. 1680x1050 1,186 12.96%

4. 1920x1200 1,071 11.70%

5. 1280x1024 749 8.18%

6. 1920x1080 451 4.93%

7. 1024x768 334 3.65%

8. 1366x768 317 3.46%

9. 768x1024 298 3.26%

10. 320x480 256 2.80%

Note: The current votes lead to believe that 1024*768 is the best resolution. I wouldn't concur. It doesn't even make 4% of my hits - besides: who would own such a monitor? Maybe house wifes or older people. If those are your target market, then go with it. If not: pick some resolution that was not hip 10a ago.

1024x600 to benefit most common desktop/laptop users and the netbook users too.
=> 1024x768. I run 1920x1200 on my primary monitor but it can be really hard to read large articles in a maximised browser, so I usually have a floating window that takes up about half of the desktop width.

This means that it will be netbook friendly too. Won't be long before mobiles can do 1024 in landscape either.

[Yes I do use instapaper text view but not for everything]

Why all the hate? That's an arrow → not greaterthanorequal
http://isitnormal.com has a pretty ordinary internet audience. Certainly not designers or developers. Regular folks.

Here's the resolution data from GA for the last month (roughly 1 million visits):

1280x800: 19.62%

1024x768: 16.88%

1366x768: 9.54%

1440x900: 7.45%

1280x1024: 6.75%

320x396: 5.24%

1680x1050: 4.30%

320x480: 3.56%

1920x1080: 2.10%

1024x600: 2.01%

Resolution stats aren't incredibly useful. The majority of users running high resolutions don't run their apps (including browsers) fully maximized.
Find the user's true window resolution via javascript and then dynamically resize based on that true resolution.
Speaking of which ... does anyone know of a good way to tell from inside an iframe if it's visible on screen? I want to sync some javascript to the point in time in which it becomes visible.

(I can sort-of-estimate that on Firefox 3.6 with mozInnerScreenY, but I found no way to do it on other browsers or older Firefox)