Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Web Site Resolutions

Reply
Thread Tools

Web Site Resolutions

 
 
SuperK
Guest
Posts: n/a
 
      02-19-2004
Folks,

I've tried to Google up some stuff on this topic but couldn't find anything
good. I'm sure you've seen this question here before, so please be patient.

Anyway, what would be a good approach for making your web site look good on
monitors with different resolutions? I know that I can change the tables'
and cells' width from fixed size to percentages, but that really won't make
the web site look the same, just take up the space. I know that I could
capture the resolution with JavaScript but I don't think this is too
beneficial. Would I be better off being cautions and designing the web site
for 800 X 600 and center it on the screen? I need some feedback on this
issue.

Thanks!

K


 
Reply With Quote
 
 
 
 
Chris Morris
Guest
Posts: n/a
 
      02-19-2004
"SuperK" <(E-Mail Removed)> writes:
> I've tried to Google up some stuff on this topic but couldn't find anything
> good. I'm sure you've seen this question here before, so please be patient.


It's definitely around in the various archives of groups.

> Anyway, what would be a good approach for making your web site look good on
> monitors with different resolutions? I know that I can change the tables'
> and cells' width from fixed size to percentages, but that really won't make
> the web site look the same, just take up the space. I know that I could


If you pick the percentages carefully, it should look approximately
the same as it does now on browser widths in the 700 - 1100 range,
while not causing too many problems on larger or smaller windows.

> capture the resolution with JavaScript but I don't think this is too
> beneficial. Would I be better off being cautions and designing the web site
> for 800 X 600 and center it on the screen? I need some feedback on this
> issue.


You're right that javascript detection isn't a good idea, but in addition:
- remember that screen resolution and browser window width are
independent. Today my browser is at 848 pixels wide.

- 800 pixels isn't that cautious. I've seen various things that
can't display that wide (lots of handheld devices that are 640
pixels wide at the most) and others where it's inconvenient (if I
was running in 800x600 resolution my browser would be at most 700
pixels wide to leave room for various other applications)

So, basically, try to design the site so that it doesn't get
horizontal scrolling until it's unavoidable. You should, with the
exception of pages with large images, usually [1] be able to get below
600 pixels this way (remember, if you get it below 500 without
horizontal scrolling, someone on 1024x768 can see two side-by-side).

[1] Some designs, maybe not. It depends.

--
Chris
 
Reply With Quote
 
 
 
 
Beauregard T. Shagnasty
Guest
Posts: n/a
 
      02-19-2004
Quoth the raven named SuperK:

> Folks,
>
> I've tried to Google up some stuff on this topic but couldn't find
> anything good. I'm sure you've seen this question here before, so
> please be patient.


Google for "liquid design"

> Anyway, what would be a good approach for making your web site look
> good on monitors with different resolutions? I know that I can
> change the tables' and cells' width from fixed size to percentages,
> but that really won't make the web site look the same, just take up
> the space. I know that I could capture the resolution with
> JavaScript but I don't think this is too beneficial.


No, because the resolution of the monitor is not related to the
browser window size.

Further, nothing will happen for the ~15% who have no, or disabled,
JavaScript.

> Would I be
> better off being cautions and designing the web site for 800 X 600
> and center it on the screen? I need some feedback on this issue.


http://www.allmyfaqs.com/faq.pl?AnySizeDesign
http://www.ddj.com/documents/s=2684/...092/index.html

--
-bts
-This space intentionally left blank.
 
Reply With Quote
 
Andy Dingley
Guest
Posts: n/a
 
      02-20-2004
On Thu, 19 Feb 2004 15:17:16 GMT, "SuperK"
<(E-Mail Removed)> wrote:

>Anyway, what would be a good approach for making your web site look good on
>monitors with different resolutions?


Design for a width of around 800 pixels. This is a reasonable size to
see an image, and a reasonable size for a line of text. Text lines
any longer than this become hard to read, just because long lines of
text are hard to read.

800 pixels wide is the mininum size of screen you're likely to
encounter. Anyone with 1200+ width is likely to use their browsers
windowed.

If you need bigger width (maybe you're a high-res image viewer) then
don;t be afraid to go bigger.

Don't assume you only have 600 pixel height, even in an 800 pixel
width. If they do, then let them scroll. Most web pages are too tall
to view on any screen and vertical scrolling is much less annoying
than horizontal scrolling.

Phones will be connecting through image-resizing gateways, so stop
worrying about it (but pay attention to the notes below).

Now stop thinking about window (and especially screen !) size
altogether. It's just not a useful way to approach the problem. Use
any JavaScript testing screen sizes and we'll come and break your
kneecaps.

Set your font sizes by using em units and _not_ pixels. This allows
browser-based resizing, which is a valuable accessibility point.

Use pixels for sizing where you're doing something vitally pixel-based
to do with your images. For anything and everything else, use ems.
Don't even think about writing old table-based code with 1x1 blank
..gifs.

Remember that you have a vague idea what size someone's display
resolution is, but almost no idea how big the physical screen is, or
how good their eyesight is. I can read "tiny" text in pixel sizes on
my laptop (a "poor" screen) but I can;t begin to do so on my desktop
machine, because I have a huge resolution (supposedly a good thing)
that actually makes the resolution of each pixel harder (display
sizes grew at a faster rate than display screens).

Stop trying to treat the web as rigid paper and deal with it as a flow
problem. There are plenty of approaches to "liquid" design, where you
simply stop worrying, supply appropriate hints to the important
things, and then let the browser sort it out. As my browser knows what
sort of screen it has to work with, and I've also instructed the
system on how my eyes can resolve my particular screen resolution,
then it's in a much better position to do it.

--
Smert' spamionam
 
Reply With Quote
 
Steve R.
Guest
Posts: n/a
 
      02-20-2004
SuperK wrote in message ...
> Anyway, what would be a good approach for making your web site look good

on
> monitors with different resolutions?


Some *informative* reading matter for you ...

Design for Any Size:
http://allmyfaqs.com/faq.pl?AnySizeDesign

The Myth of 800x600:
http://www.ddj.com/documents/s=2684/...092/index.html

How Can I Make My Pages Look Good On All Monitors?
http://www.thepattysite.com/window_sizes1.cfm


 
Reply With Quote
 
Steve R.
Guest
Posts: n/a
 
      02-20-2004
Andy Dingley wrote in message ...
> Design for a width of around 800 pixels.


No don't.

Design for Any Size:
http://allmyfaqs.com/faq.pl?AnySizeDesign

The Myth of 800x600:
http://www.ddj.com/documents/s=2684/...092/index.html

How Can I Make My Pages Look Good On All Monitors?
http://www.thepattysite.com/window_sizes1.cfm


> This (800 pixels) is a reasonable size to see an image,


Not so - an 800 pixel wide image will create horizontal scroll bars on most
websites viewed at 800x600.


 
Reply With Quote
 
Whitecrest
Guest
Posts: n/a
 
      02-20-2004
In article <ahkZb.3551$(E-Mail Removed)>, "Steve
R." <stevie_ritchie(NOSPAM)@hotmail.com> says...
> > Design for a width of around 800 pixels.

> No don't.
> Design for Any Size:
> http://allmyfaqs.com/faq.pl?AnySizeDesign


This page falls apart in a small browser window.....

--
Whitecrest Entertainment
www.whitecrestent.com
 
Reply With Quote
 
kchayka
Guest
Posts: n/a
 
      02-20-2004
Whitecrest wrote:

> In article <ahkZb.3551$(E-Mail Removed)>, "Steve
> R." <stevie_ritchie(NOSPAM)@hotmail.com> says...
>> > Design for a width of around 800 pixels.

>> No don't.
>> Design for Any Size:
>> http://allmyfaqs.com/faq.pl?AnySizeDesign

>
> This page falls apart in a small browser window.....


Huh? Seems to work fine for me all the way down to ~400px wide, even
with my larger than average text size.

--
Reply address is a bottomless spam bucket.
Please reply to the group so everyone can share.
 
Reply With Quote
 
Andy Dingley
Guest
Posts: n/a
 
      02-20-2004
On Fri, 20 Feb 2004 09:17:58 GMT, "Steve R."
<(E-Mail Removed)> wrote:

>No don't.


Oh learn to read the whole ****ing message, why don't you.
--
Smert' spamionam
 
Reply With Quote
 
kchayka
Guest
Posts: n/a
 
      02-21-2004
Andy Dingley wrote:
>
> Design for a width of around 800 pixels. This is a reasonable size to
> see an image, and a reasonable size for a line of text. Text lines
> any longer than this become hard to read, just because long lines of
> text are hard to read.


The width in pixels has no relationship to the number of characters on a
line. The units relative to a line of text is em, not px.

At my larger-than-average text size, 1000px can be just peachy. An
artificial limit of 800px can actually _cause_ readability problems,
especially in a multi-columned page where a column is only wide enough
for a couple words. Sites like this are very tiring to read.

40-50em is considered an optimal line length for many users, myself
included.

Use the right tool for the job, and all that.

--
Reply address is a bottomless spam bucket.
Please reply to the group so everyone can share.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
List of free web site design, web site backgrounds, web site layoutsresources cyber XML 1 12-25-2007 11:48 PM
Free web site design, web site backgrounds, web site layoutsresources cyber HTML 0 12-24-2007 04:26 PM
List of free web site design, web site backgrounds, web site layoutsresources cyber HTML 0 12-21-2007 03:47 PM
List of free web site design, web site backgrounds, web site layoutsweb sites cyber HTML 1 12-19-2007 09:07 AM
Web photo album with mutiple resolutions? Bruce Chastain HTML 6 10-27-2003 04:13 PM



Advertisments