Designing Layout - Screen Resolution Minimum?

[tech_support]

I've seen sites such as electricpulp.com, darklightart.com, and many more than can't fix a 800x600 screen now.

Is it considered a good idea to make a website design that doesn't look very good in 800*600?

Yeah, I know... fluid layouts... one problem - doesn't work for images, We can't have stretched computers and bodies, way too ugly ;)

Is there some sort of an accessibility issue with this?

It seems to me that you can only have a good design and not so good coding, and vice versa.

Yeah, does are very nice websites :)

[Hope I'm posting in the right area... "HTML" looks like the right section]

[boogyman]

yes images do create a problem, however at the same time you need to consider your audience and scope of the website. and 800x600 resolution will give you usually somewhere in the range of 780x580 viewport (viewable non-scrolling window) which is still a good size image for the web. now on that note there are alot of times that images can be 1500 - 2000 pixels wide, but those are used for background images which are okay because only what is necessary will show.

comprimise is the key... there are many ways of creating good design with good coding, and remember that sometimes elegance looks better then extravagence. there is such a thing as going overboard in either direction, and usually that is what happens. graphic designers wont make their site scalable, and coders wont make their design accessible. that is why when I see a site that is visually appealing I test the accessibility of it as well. take a look at Bark Huff (http://www.barkhuff.com)

[tech_support]

and 800x600 resolution will give you usually somewhere in the range of 780x580 viewport (viewable non-scrolling window) which is still a good size image for the web.

And now we create a problem where the widescreen/almost-a-tv-screen-size users (*cough*Macs*cough*) will see a puny tube. :p

I think I should make it look good in 1024*768 and above, to suit the widescreen /almost-a-tv-screen-size users. 800*600 is almost extinct now.


take a look at Bark Huff (http://www.barkhuff.com)

Nice site, but bad coding skills. See what I mean? You can't have both, it's one or the either it seems.

[boogyman]

I think I should make it look good in 1024*768 and above, to suit the widescreen /almost-a-tv-screen-size users. 800*600 is almost extinct now.
thats not true. I know many people that have 800x600 browsers... but regardless of regular comptuers... you also need to think of PDA and other cell phone like utilities, which will definitely have a very small screen size... (eg iPhone) just something else to think of

[Twey]

I have a 1600×1200 screen, but usually browse with a roughly 1024×768 or 800×600 window depending on what else I've got open.

I usually consider it acceptably accessible if it works (even if it doesn't look quite as good; remember, images should be optional) at 640×480. Users with windows smaller than this, if you've developed your website correctly, should be able to disable images anyway and view your page as text only, which should be designed to fit any size.

Roll on SVG support and CSS proportional sizing!

[tech_support]

thats not true. I know many people that have 800x600 browsers... but regardless of regular comptuers... you also need to think of PDA and other cell phone like utilities, which will definitely have a very small screen size... (eg iPhone) just something else to think of

Isn't that why we have a separate mobile stylesheet?


I usually consider it acceptably accessible if it works (even if it doesn't look quite as good; remember, images should be optional) at 640×480.

:eek: That's so small. How would the 30" widescreen users feel when their page is like a skinny tube?

And images optional? Not the best looking site without images. An image is worth a thousand words...

Oh, and BTW, Your site menu doesn't look very well on 640*480 :p

[Twey]

How would the 30" widescreen users feel when their page is like a skinny tube?The site should expand. It's one thing to have a minimum size in pixels, but a maximum size in pixels is another altogether. Theoretically, a high enough resolution would see only a character or two per line in such a design.
And images optional? Not the best looking site without images.Like I said, users being able to actually access your content is more important than the site looking good. Certainly it's nice to have a good-looking site, but the user should be able to disable all the extras (images &c.) and still be able to use it if necessary. This doesn't just apply to small resolutions, but also to user agents like search engines and screen readers.
Oh, and BTW, Your site menu doesn't look very well on 640*480But it is usable. My site does have some major updates in the offing, by the bye. I've rewritten the whole thing but for now have nowhere to host the new site, which uses Django. I'm hoping to kill several birds with one stone by renting a dedicated server soon; at that point the new site will go up.

[tech_support]

The site should expand. It's one thing to have a minimum size in pixels, but a maximum size in pixels is another altogether. Theoretically, a high enough resolution would see only a character or two per line in such a design.

Banners can't expand :p

[djr33]

They can, actually.

http://boards.theforce.net

[jscheuer1]

I've been experimenting on my most recent project. All of the pages are set to a width in em's that will just barely fit in an 800x600 screen's browser at normal font size. But since a 800x600 user usually has their default text size one step smaller than normal, it works out fine for them. Users with much larger screens/browser ports can increase the font-size. For intermediate sizes, the default settings are fine. I've even expressed image dimensions in em's so that they can shrink and grow with the text size changes on the user's end.

[djr33]

That will scale the images poorly, though, because it uses the browser to render sizes.

[tech_support]

They can, actually.

http://boards.theforce.net
That's just two images.

http://www1.theforce.net/jc/images/main_oct_2007/back.jpg
http://www1.theforce.net/jc/images/main_oct_2007/main.jpg

[djr33]

Yep. It is. Works well, though.

[jscheuer1]

That will scale the images poorly, though, because it uses the browser to render sizes.

I'm finding that it depends upon the image and upon the browser. Safari 3 win is especially adept at smoothing out the images. One image I have is a jpg with pastel colors that just shows the outlines of figures and objects. It scales well in all browsers. I use it as a sort of pseudo background (absolutely positioned behind the page). Some of the images aren't scaled, they don't need to be. Others are not because I doubt that they would do well by it, or really need it in most view ports.

In the example you gave (star wars), there are problems at 800x600. But the overall look is nice in larger view ports and fluid enough given at least 987px port width. It does seem to depend upon how much 'sizzle' you want. As Twey says, images should be optional.

[djr33]

Well, the example site may or may not work at various resolutions, but the idea of an expanding banner is a solid one.

Some images may scale properly, true. I thought you meant that all of the images were like that, and that sounds like asking for trouble. With a few select images, though, it could work out.

[jscheuer1]

With any complex layout, and even with some fairly simple ones, the concept employed is one thing. The actual implementation is another. The expanding banner concept is a good one, but has limitations. If you have a monitor that is truly 800x600 res - not just a smaller browser window to simulate it, you will see that the banner takes up an inordinate amount of vertical screen real estate. On really wide and tall high res screens, one would need more expansion capability, and the banner would become increasing shorter in apparent height, and therefore legibility/viewability.

Scaling images has its limitations as well. You are relying on the user to set the proper text size for his/her screen. This is generally the case, but not always. And many images will become distorted when scaled by most browsers. Unfortunately the best images to scale in this way are also usually those with the highest resolution/bandwidth. Some compromises may be made. Using images that are small enough to flow (somewhat like text) with the layout is a better choice where applicable.

So, if I remember how this thread or one recent thread like it started, the answer really is yes. There are various things that you can do to accommodate different sized screens and resolutions, but any design will break down under any particular (usually extreme) set of circumstances unless it is fairly simple and doesn't rely upon its images being rendered.

[Twey]

Well, the example site may or may not work at various resolutions, but the idea of an expanding banner is a solid one.The solution is to have that second image be something that can expand off infinitely: either a tileable image or a solid colour.