[James Mitchell]

Often I have read various articles about the pros and cons of designing for different screen resolutions. So I thought I'd put it to everyone here to openly discuss what they do and why.

I believe that the screen resolution you design for should be based on your audience (for fixed width sites). For example if you are designing a site for a client whose target audience is senior citizens, you'll likely be designing a site at 800x600. Where as if you are working on a site design for web designers and developers you might be designing it for 1024x768.

With that said I still design for 800x600 (as a general rule) regardless of the audience for 2 main reasons.

1. It is still a fairly common and safe resolution to design for.
2. The majority of people using higher screen resolutions do not browse with a maximized browser window.

For an interesting read and to get your mental gears running you should check this article out.

Design for Browser Size - Not Screen Size

This post has been edited by JPMitchell: 06 September 2006 - 01:03 PM

[Catalyst]

I think 1024 is pretty safe now. I still do a lot of site at 800 though as I think many people don't use their browsers at full window size now that they're running at high rez.

[sypher]

I try and do all my sites fluid, altho design implications sometimes make it impossible. But in the site plan i either choose 800x600 or 1024x768 depending on how busy the page design is.

[marcamos]

When designing a fixed-width layout (which is rare), I'll always go for 800x600 (but I technically set it up for about 770px in width).

90% of the time though, I'm doing everything fluid with percentages and ems, then setting a min-width of about 700px, and a max-width of about 1300px. I know IE6 doesn't support that, but a: I don't care, and b: IE7 isn't very far away.

[sypher]

Herk i hear IE7 has some kind of anti aliasing on normal text? Making problem with display.

[marcamos]

sypher, on Sep 6 2006, 06:03 PM, said:

Herk i hear IE7 has some kind of anti aliasing on normal text? Making problem with display.

IE7 has some sort of ClearType built right into it. I personally welcome it and I think it looks decent. It's a tiny bit softer than os x (which has a slight anti-aliasing on everything), and I honestly haven't seen IE7 do anything funky with the old display I use it on at work.

[Karl Buckland]

Yes, it's very similiar to the anti-aliasing used on Mac and Linux. It isn't a bad thing and shouldn't effect your sites. If anything, it should make using text much easier as it'll look more like a graphic.

[James Mitchell]

herkalees, on Sep 6 2006, 05:48 PM, said:

When designing a fixed-width layout (which is rare), I'll always go for 800x600 (but I technically set it up for about 770px in width).

Is your designing for fluid layouts more a common practice because of the browser window not typically maximized?

Which in turn is that why you are using the max-width as well?

[marcamos]

JPMitchell, on Sep 7 2006, 08:52 AM, said:

Is your designing for fluid layouts more a common practice because of the browser window not typically maximized?

Which in turn is that why you are using the max-width as well?

I never particularly have that in mind (whether a browser is max/minimized). I make the sites fluid so that they scale on different resolutions (and inherently, browser sizes).

As far as using max-width, I like to have my sites scale up to a certain point (typically about 1300px) for one main reason; it's absurd to imagine a few paragraphs of text word-wrapping at a resolution that high, assuming the viewer maximizes his or her browser window. In the rare cases that this happens, I don't want my site's content to get too wide. The viewer can simply deal with their maximized browser window still showing left-and-right whitespace after my site stops scaling up on the x-axis (around 1300px).

[moojoo]

It all boils down to demographics. 800x600 in some cases, 1024x768 + in others such as gaming sites blah blah.

[BigMike Sidelka]

Ive had this proublem. Im on a 1280 res so ive made things and people tell me, 'YOUR IMAGES ARE HUGE"

although usually if i do numerical table widths the highest i got is 800px

tho im trying to use percents now, its harder to design for, but the final output will look nice.

[marcamos]

NewAge.Mike, on Sep 13 2006, 08:41 PM, said:

Ive had this proublem. Im on a 1280 res so ive made things and people tell me, 'YOUR IMAGES ARE HUGE"

although usually if i do numerical table widths the highest i got is 800px

tho im trying to use percents now, its harder to design for, but the final output will look nice.

Designing in percenteges and/or ems is a hard transition to make; I remember doing it myself. But let me assure you, like anything else new, the discomfort goes away, and before you know it, you'll be buzzing along and happy that all your sites are fitting as they should on many different resolutions.

[webia]

The best way to find out what resolution to use when you are creating a new website, is to look in the logs at your own websites that have related content with the new website, and see what percentages are there.

If you are redesiging is way easier. Look just for that website, and make the most so that the majority of your visitors feel great.

[Karl Buckland]

Webia - what do you mean? Webserver logs will not record client resolution information as this is not sent in the client's request. It can usually only be recorded with the assistance of Javascript.

[marcamos]

Sirkent, on Sep 14 2006, 04:30 AM, said:

Webia - what do you mean? Webserver logs will not record client resolution information as this is not sent in the client's request. It can usually only be recorded with the assistance of Javascript.

I believe Webia is referring to add-on scripts for the admin of a site (likely in cPanel, Plesk, etc.) such as Awstats; It does a very good job tracking the screen resolution of your visitors and turns them into a pie chart graph.

[James Mitchell]

I think it all goes back to what Marc said on Post #4 of this thread. Design it right from the beginning to be compatible with all and you don't have to worry about it. Thanks!

This post has been edited by JPMitchell: 14 September 2006 - 08:24 AM

[BigMike Sidelka]

herkalees, on Sep 14 2006, 01:22 AM, said:

Designing in percenteges and/or ems is a hard transition to make; I remember doing it myself. But let me assure you, like anything else new, the discomfort goes away, and before you know it, you'll be buzzing along and happy that all your sites are fitting as they should on many different resolutions.

The worst part with %'s is a low resolution with a non maximized screen, and text becomes badly aligned and backgrounds can get messed up that way, other than the hardest part is have to slice image even furher, make alot of background images and corner images. As you said the end result is worth it.

EDIT: heres a simple web site immaking for a client
hes hard to work with, the only colors he wants me to uses is red and green
and he wants it real simple, heres what i have
http://www.shark-flash.com/beta

This post has been edited by NewAge.Mike: 14 September 2006 - 10:58 AM

[marcamos]

NewAge.Mike, on Sep 14 2006, 11:57 AM, said:

The worst part with %'s is a low resolution with a non maximized screen, and text becomes badly aligned and backgrounds can get messed up that way..

To resolve this issue, I typically use the CSS property 'min-width', like so:

div#wrapper {min-width:650px;}

I know IE 6 and under does not support this property, but that will change soon. For those currently using IE6 on a small monitor and not maximized... tough luck.