Re: Website width for 800 x 600 pixel

[Peter Swanson]

Because you are thinking that its 800 pixels wide... you aren't taking into
account padding of the document or the scrollbar's width

OK, so there's padding in the table
4 for each column (2 at each side) = 12
2 between each cell = 4

Total 16.

Q1: How wide is the scroll bar?
Q2: What other padding is there?

TIA,
Peter

 

[William Tasso]

OK, so there's padding in the table
4 for each column (2 at each side) = 12
2 between each cell = 4

Total 16.

Q1: How wide is the scroll bar?
Q2: What other padding is there?

good questions.

alternative answers here:
http://www.allmyfaqs.com/cgi-bin/wiki.pl?AnySizeDesign

 

[Jason Billingsley]

As a rule an 800 x 600 target should work across most browsers with no
horizontal scrollbar at 768 pixels wide.

 

[Jason Billingsley]

Yes, you caught me

When I refer to a "rule" it is a reference point usually. i.e. liquid
design is optimal in most situations, however we are now looking at
82%+ users above the 800x600 resolution. So, when I say 768 pixels, it
is the optimal starting point for a liquid design (if that is what one
wants to do).

 

[Richard Cornford]

OK, so there's padding in the table
4 for each column (2 at each side) = 12
2 between each cell = 4

Total 16.

Q1: How wide is the scroll bar?

On Window OS the scroll bar can be any size the user wants it to be,
down to about 8 pixels. The active/inactive window borders may also
contribute and can also be any size the user wants.

Q2: What other padding is there?

Have you considered default padding and margins on BODY and HTML
elements? Different browsers use default padding or margin on at least
one of those. Exact values vary with the browser and may be subject
modification with user style sheets.

Richard.

 

[spaghetti]

The simple fact is, the only time a 768 pixel-wide design is convenient
for the user is in _one_special_case_. And that is with a maximized,
800x600 browser window, with the explorer bar closed, with the Office
toolbar off, and with the start menu at the top or bottom. And that is
pretty uncommon.

I don't think this issue is that clear-cut. I mean nobody takes into account
that it's proven to be uncomfortable to read columns of text wider than 5 or
so inches. :/

So even if you make a full-width page, most users are gonna shrink their
browser windows down to a comfortable reading width anyway.

I don't think there's a "zen" approach to this yet.

 

[Isofarro]

Yes, you caught me

Topposting again - yup.

When I refer to a "rule" it is a reference point usually. i.e. liquid
design is optimal in most situations, however we are now looking at
82%+ users above the 800x600 resolution.

And how many of those 82% of users don't have office installed, have a top
or bottom placed taskbar, have their browsers maximised, and don't have any
sidebars such as bookmarks or history visible?

With that in mind, the 82% number is vastly overstated, and could be as low
as 42%.

 

[William Tasso]

spaghetti wrote:



That's good, since then each user can set their preferred content
width for maximum readability.

which will be different for scanning as opposed to reading.

 

[Isofarro]

I don't think this issue is that clear-cut. I mean nobody takes into
account that it's proven to be uncomfortable to read columns of text wider
than 5 or so inches. :/

So use the max-width style in ems in your CSS. A fixed width keylock doesn't
give you the solution you seek, since the optimal reading width is
dependant on font-size, not screen resolution or screen width.

So even if you make a full-width page, most users are gonna shrink their
browser windows down to a comfortable reading width anyway.

That's good, since then each user can set their preferred content width for
maximum readability.

 

[Peter Swanson]

Top Posting FIXED.


You say "rule," but shouldn't you mean exception? Are "most" browsers
maximized? Of those that are, what about 1024x768 monitors? You get all
this empty space with them! Or worse, the user gets a horizontal
scrollbar, and is _forced_ to maximize his/her window to remove it.

What if a maximized, 800x600 user has their "Explorer Bar" open, looking
at history or favorites?

How does a website fixed at a width of 768 pixels do when accessed by a
user with a 640x480 resolution? Or how about by a portable device?

The simple fact is, the only time a 768 pixel-wide design is convenient
for the user is in _one_special_case_. And that is with a maximized,
800x600 browser window, with the explorer bar closed, with the Office
toolbar off, and with the start menu at the top or bottom. And that is
pretty uncommon.

Because a flexible design serves _virtually_every_ user, I don't see why
fixed-width designs are considered at all.

Thanks for all the input so far.

If I go to a flexible design (i.e. fixed width columns on the left,
but a flexible right hand column), how do you cope with the users with
high screen resolutions? The text line lengths can become excessively
long. Can you make the design flexible, but with a maximum width? I
realise you can rig a minimum width by using a transparent graphic.

TIA,
Peter

 

[Neil White]

Hi Peter,

If I go to a flexible design (i.e. fixed width columns on the left,
but a flexible right hand column), how do you cope with the users with
high screen resolutions? The text line lengths can become excessively
long. Can you make the design flexible, but with a maximum width? I
realise you can rig a minimum width by using a transparent graphic.

I was looking into this too, and it appears that using CSS2 you can set a
max-width style.

http://www.w3.org/TR/REC-CSS2/visudet.html#min-max-widths

So perhaps:
<p style="max-width: 350px">Long... ... ...paragraph.</p>

Unfortunately, I've no idea what the support for this is in the browsers
currently, as I never got around to experimenting with it. Hope this helps
though.

Best regards
Neil

 

[David Dorward]

I was looking into this too, and it appears that using CSS2 you can set a
max-width style.

So perhaps:
<p style="max-width: 350px">Long... ... ...paragraph.</p>

It makes much more sense to define the max width using em units, otherwise
you get very few characters on a line with large fonts.

p {
max-width: 35em;
}

Unfortunately, I've no idea what the support for this is in the browsers
currently

Supported in every modern graphical browser (Mozilla Family, KHTML
[Konqueror/Safari], Opera) except MSIE.

 

[Toby A Inkster]

I was looking into this too, and it appears that using CSS2 you can set a
max-width style.

As with much of CSS 2, problematic in IE.

 

[Sam Hughes]

Users with high resolution screens typically either do not run their
browser maximised (high resolutions allow multiple windows to be
displayed at comfortable sizes side by side), or have large fonts.

Even if the lines do become overly long, the user can always reduce
the size of their window.

Or better yet, they would probably have their window already reduceded,
because of prior experience with this problem.

 

[Some One]

As a rule an 800 x 600 target should work across most browsers with no
horizontal scrollbar at 768 pixels wide.

Even if I have my windows borders set to 10 pixels???

It's a bad design to start with.