Re: Website width for 800 x 600 pixel

Discussion in 'HTML' started by Peter Swanson, Aug 8, 2003.

  1. On Fri, 8 Aug 2003 11:06:52 -0700, "Augustus"
    <> wrote:

    >
    >"Peter Swanson" <> wrote in message
    >news:...
    >> 1) I use this table to define the main structure of the webpage (two
    >> columns, a narrow one on the left, a wide one on the right). This is
    >> the first piece of html after the <body> tag.
    >>
    >> <table cellspacing="2" cellpadding="2">
    >> <tr>
    >> <td width="180"><img src="../images/1ptrans.gif" width=180
    >> height=1 border=0></td>
    >> <td width="20"><img src="../images/1ptrans.gif" width=20 height=1
    >> border=0></td>
    >> <td width="580"><img src="../images/1ptrans.gif" width=580
    >> height=1 border=0></td>
    >> </tr>
    >>
    >> On the computers we have here in 800 x 600 resolution, this page is
    >> too wide, and has a horizontal scrollbar.
    >>
    >> Why?

    >
    >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
     
    Peter Swanson, Aug 8, 2003
    #1
    1. Advertising

  2. Peter Swanson wrote:
    > On Fri, 8 Aug 2003 11:06:52 -0700, "Augustus"
    > <> wrote:
    >
    >>
    >> "Peter Swanson" <> wrote in message
    >> news:...
    >>> ...
    >>> On the computers we have here in 800 x 600 resolution, this page is
    >>> too wide, and has a horizontal scrollbar.
    >>>
    >>> Why?

    >>
    >> 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?
    >

    good questions.

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

    --
    William Tasso - http://WilliamTasso.com
     
    William Tasso, Aug 8, 2003
    #2
    1. Advertising

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

    -----
    Java Shopping Cart - MerchantSpace
    http://www.merchantspace.com
    -----

    On Fri, 8 Aug 2003 20:22:37 +0100, "William Tasso" <>
    wrote:

    >Peter Swanson wrote:
    >> On Fri, 8 Aug 2003 11:06:52 -0700, "Augustus"
    >> <> wrote:
    >>
    >>>
    >>> "Peter Swanson" <> wrote in message
    >>> news:...
    >>>> ...
    >>>> On the computers we have here in 800 x 600 resolution, this page is
    >>>> too wide, and has a horizontal scrollbar.
    >>>>
    >>>> Why?
    >>>
    >>> 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?
    >>

    >good questions.
    >
    >alternative answers here:
    >http://www.allmyfaqs.com/cgi-bin/wiki.pl?AnySizeDesign
     
    Jason Billingsley, Aug 8, 2003
    #3
  4. 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).

    -----
    Java Shopping Cart - MerchantSpace
    http://www.merchantspace.com
    -----

    On 8 Aug 2003 21:31:30 GMT, Sam Hughes <> wrote:

    >Jason Billingsley <> wrote in
    >news::
    >
    >Top Posting FIXED.
    >
    >> On Fri, 8 Aug 2003 20:22:37 +0100, "William Tasso" <>>
    >> wrote:
    >>
    >>>good questions.
    >>>
    >>>alternative answers here:
    >>>http://www.allmyfaqs.com/cgi-bin/wiki.pl?AnySizeDesign

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

    >
    >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.
     
    Jason Billingsley, Aug 9, 2003
    #4
  5. "Peter Swanson" <> wrote in message
    news:...
    <snip>
    > 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.
     
    Richard Cornford, Aug 9, 2003
    #5
  6. Peter Swanson

    spaghetti Guest


    > 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.
     
    spaghetti, Aug 9, 2003
    #6
  7. Peter Swanson

    Isofarro Guest

    Jason Billingsley wrote:

    > 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%.




    --
    Iso.
    FAQs: http://html-faq.com http://alt-html.org http://allmyfaqs.com/
    Recommended Hosting: http://www.affordablehost.com/
    Web Standards: http://www.webstandards.org/
     
    Isofarro, Aug 9, 2003
    #7
  8. Isofarro wrote:
    > spaghetti wrote:
    >
    >
    >> 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.


    which will be different for scanning as opposed to reading.

    --
    William Tasso - http://WilliamTasso.com
     
    William Tasso, Aug 9, 2003
    #8
  9. Peter Swanson

    Isofarro Guest

    spaghetti wrote:

    >
    >> 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 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.


    --
    Iso.
    FAQs: http://html-faq.com http://alt-html.org http://allmyfaqs.com/
    Recommended Hosting: http://www.affordablehost.com/
    Web Standards: http://www.webstandards.org/
     
    Isofarro, Aug 9, 2003
    #9
  10. Sam Hughes <> wrote in message news:<Xns93D1B4E6DD166samreid@130.133.1.4>...
    > Jason Billingsley <> wrote in
    > news::
    >
    > Top Posting FIXED.
    >
    > > On Fri, 8 Aug 2003 20:22:37 +0100, "William Tasso" <>>
    > > wrote:
    > >
    > >>good questions.
    > >>
    > >>alternative answers here:
    > >>http://www.allmyfaqs.com/cgi-bin/wiki.pl?AnySizeDesign

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

    >
    > 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
     
    Peter Swanson, Aug 9, 2003
    #10
  11. Peter Swanson

    Neil White Guest

    Hi Peter,

    Peter wrote:
    > 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
     
    Neil White, Aug 9, 2003
    #11
  12. Neil White wrote:

    > 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.


    --
    David Dorward http://dorward.me.uk/
     
    David Dorward, Aug 9, 2003
    #12
  13. Neil White wrote:

    > 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.

    --
    Toby A Inkster BSc (Hons) ARCS | mailto: | pgp:0x6A2A7D39
    aim:inka80 | icq:6622880 | yahoo:tobyink | jabber:
    http://www.goddamn.co.uk/tobyink/ | "You've got spam!"
    playing://coldplay/a_rush_of_blood_to_the_head/11_amsterdam.ogg
     
    Toby A Inkster, Aug 9, 2003
    #13
  14. Peter Swanson

    Sam Hughes Guest

    David Dorward <> wrote in
    news:bh3gsh$6ij$1$:

    > Peter Swanson wrote:
    >
    >> 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.

    >
    > 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.
     
    Sam Hughes, Aug 10, 2003
    #14
  15. Peter Swanson

    Some One Guest

    "Jason Billingsley" <> wrote in message
    news:...
    > 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.
     
    Some One, Aug 10, 2003
    #15
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. okaminer
    Replies:
    2
    Views:
    558
    IPGrunt
    Feb 16, 2005
  2. Peter Swanson

    Re: Website width for 800 x 600 pixel

    Peter Swanson, Aug 8, 2003, in forum: HTML
    Replies:
    0
    Views:
    500
    Peter Swanson
    Aug 8, 2003
  3. Black Tractor
    Replies:
    47
    Views:
    1,841
    (Pete Cresswell)
    Jan 7, 2005
  4. Infant Newbie

    Is 800 x 600 old hat?

    Infant Newbie, Jun 30, 2007, in forum: HTML
    Replies:
    67
    Views:
    1,554
    Sherm Pendley
    Jul 5, 2007
  5. iMath
    Replies:
    15
    Views:
    445
    Chris Angelico
    Sep 30, 2012
Loading...

Share This Page