Forum Moderators: open

Message Too Old, No Replies

What's a good width for a fixed layout?

Need good width ideas for 800x600 and 1024x768

         

MatthewHSE

9:38 pm on Jul 27, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I'm working on a site where I really would rather not have a fully fluid layout, for various good reasons. I'm accomodating widths for 800x600 and 1024x768 resolutions, specifying the widths in CSS for 800x600 and using a tiny bit of javascript to give 1024x768 another small stylesheet that over-rides the defaults. So far so good - but what are good widths for each of those resolutions? That is, a maximized or near-maximized browser window, taking into account the average scrollbar width, and no sidebars or hotlists open, and avoiding horizontal scrolling. Currently I'm using 770 and 995 pixel widths; do these seem reasonable or should I adjust them a little one way or the other?

UDaMan

10:16 pm on Jul 27, 2004 (gmt 0)

10+ Year Member



Well I have not used fixed width for a while now but this is what I remember as a quick, easy to remember reference:

640 x 480 = 600px table
800 x 600 = 780px table
1024 x 768 = 1000px table

OTOH Dreamweaver recommends:

640 x 480 = 600px
800 x 600 = 760px
1024 x 768 = 955px

I would say that dreamweaver errs on the side of caution with regards to the fact that the user may not have the windows maximized and other factors. I would say your settings are fine.

encyclo

11:48 pm on Jul 27, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I'm more in line with the Dreamweaver recommendations - or even a bit narrower, which allows for non-maximized browser windows, Office toolbars, etc. and allows the design to "breathe" a bit. I tend to go for 720px to 750px as a maximum for 800x600.

770px is probably OK in most situations, but it is the absolute limit. 760px is a good compromise. For comparison, the Yahoo front page uses a fixed width of 740px.

PatrickDeese

11:51 pm on Jul 27, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I have been using 728 - which is the width of G's adsense leaderboard.

edit_g

12:05 am on Jul 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



If I fix a layout I usually do it at around 760px.

D_Blackwell

2:32 am on Jul 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I don't know what the "official" numbers are but I've found that IE will always be the first to break horizontally, and I always check for this before getting too committed to something. I don't use fixed widths in designing, but make sure that no headers or logos are wider than 760px. I'd be concerned about 780px.

UDaMan

3:13 am on Jul 28, 2004 (gmt 0)

10+ Year Member



If I rememeber correctly, (and I did say that it had been a while), the width of the scroll bar is 18px.

<added>You know, IE never ceases to amaze me, taking standard scroll bar and border dimensions, and minus that from the screen resolution and the math just isn't applied correctly in IE. Horizontal scroll bars appear when there should be need for them.</added>

Patrick Taylor

5:50 am on Jul 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I've used 770 wide for a while for an 800 wide screen, but the exact best width I believe should take account of the edge design of the page. Sometimes it just looks nicer if the side margin is slightly more, which suggests maybe 760.

balam

6:48 am on Jul 28, 2004 (gmt 0)

10+ Year Member



There's a Wired Webmonkey article that recommends "safe with vertical scrollbar" widths of 744 and 968 pixels. The author examined different browsers and platforms... (It's interesting to note that both G & Y! fit within the recommended 744 pixels.)

I'm not sure if it's a "safe" URL to post, so I've stickied you the address, MatthewHSE. If anyone else is interested, lemme know...

tedster

9:20 am on Jul 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I think you're refering to this article, right?

[webmonkey.wired.com...]

PatrickDeese

3:45 pm on Jul 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



760 px and wider doesn't work on Macs with 800x600 resolution using IE 5 - it forces sidescrolling.

balam

5:15 pm on Jul 28, 2004 (gmt 0)

10+ Year Member



Indeed I am, tedster! :)

Patrick Taylor

4:37 am on Jul 30, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



PatrickDeese: 760 px and wider doesn't work on Macs with 800x600 resolution using IE 5 - it forces sidescrolling.

Thankyou for that very important piece of information! I never realised that. I came across a site where one could test pages as if on a Mac but the queue was HUGE, so thanks.

Garfie

4:59 am on Jul 30, 2004 (gmt 0)

10+ Year Member



Just for a bit of information, with Windows XP you can customize your scrollbar from 8 to 32px wide, and by default its 16px.