Available browser space for different screen resolution

[quantum]

Any good web designer designs his website with a minimum common denominator in mind. So that the website looks at least decent in the worst case scenerio. Screen resolution is one such important factor, that, if you you fail to take into account, can completely ruin your beloved, toiled website. Develop it in one resolution and then go to another computer and..shock shock...it looks just rediculously horrible in there. Very annoying. More and more computers are moving towards 1024 by 768 resolution each day. Which is a very good thing. The more space you have to play around the better it looks. Not only can you put more content, it also looks better for all the empty spaces around, if you design the layout carefully. But still a majority of the people use 800 by 600 screen resolution!? Which is just pathetic, in my opinion. But we, web designers, have to live by that. What to do? We must create the most user friendly interfaces as humanly possible. Equality for every one.

But anyway, it is important to know how much space you really have to spare for your design and layout. Here is a list:

Available spaces for content in different resolution:
640x480 - 600x300
800x600 - 760x420
832x624 - 795x470
1024x768 - 955x600

This just excludes space for address bar, title bar, status bar, scroll etc.

Personally I design sites that look best in 1024 by 768 but at least does not come up with a horizontal scroll bar in 800 by 600. I use 1280 by 960 as my development environment.

What do you do when creating your greatest designs?
_________________

Dust fills my eyes / Clouds roll by / and I roll with them / Centuries cry / Orders fly / and I fall again
Afford best design, implement best solution. Outsource your web design.

[hasnut]

I think we can get rid of it using Table less design with CSS and for the images slice such a way it it don't effect resulation.

also using width as Percent is effective. try with different resulation with http://www.fullxml.com site.
_________________
Sarder Hasnut
MCSD, CIW A

Need Low Cost Prefessional Hosting Contact me

[quantum]

Quote:

I think we can get rid of it using Table less design with CSS

Agreed. Percent use of width is a good alternative. But the same thing can also be achieved with CSS. Just define the width of a DIV element to auto. But whichever way we go there is just no way around the fact that some things cannot be or should not be sized dynamically. Example: images. So even the most dynamically resizable websites would need to bear that in mind.

Your example sites has a limitation too, after which it comes up with a horizontal scroll. Though it happens only because of the images. Otherwise, it is very dynamically resizable.

From my personal experience such designs that go little extreme to make it look good in any screen resolution works best with sites that dissipate large amount of textual information. For some reason, they just cannot be made look that kool. If you know what I mean.

[http://www.csszengarden.com/] is another good example of such. Completely CSS based.
_________________

Dust fills my eyes / Clouds roll by / and I roll with them / Centuries cry / Orders fly / and I fall again
Afford best design, implement best solution. Outsource your web design.

[hasnut]

Agreed
_________________
Sarder Hasnut
MCSD, CIW A

Need Low Cost Prefessional Hosting Contact me