Fixed vs. variable width design

[peteej]

Hello all, I've got a questions regarding fixed vs. variable width site layout. My company's CTO is a real stickler for cross-platform/device accessibility, i.e, being able to read a page on a desktop machine as easy as it would be on a handheld. I realize there are limits to this, but how does fixed/variable width play into this? My first guess would be to go with variable-width, but I'm seeing a lot of posts here and there praising the virtues of fixed-width design. What are your preferences and why?

I'm finally venturing into CSS for layout as well as appearance, so my skills are still developing. Your comments are appreciated.

[BeeDeeDubbleU]

Hi Peteej and welcome to Webmaster World.

I am actually going through the same process as you, converting a site to CSS. I have decided to go for fixed width purely because I like to know what my visitors are seeing. I also believe that wide lines of text are unnatural and harder to read.

If you use a flexible layout the width of the text is determined by the user's screen resolution. If they are using high res then they will see these ultra wide lines of text. There can also be problems with how text wraps round images depending on the size of the available window. Fixed width gives ou more control over this.

[peteej]

Thanks, glad to hear I'm not alone. I suppose my real question revolves around how a fixed width site would translate to low resolution settings or to handheld devices. Would I have to reference a different stylesheet for this purpose? I'm afraid that a fixed width site would be cut off completely in a low-res/handheld setting.

Would I need to create a second stylesheet for this case? Is it even worth the effort?

[tedster]

Handheld browsers have their own routines built in to squeeze the layout to fit on the small screen. You may or may not like the decisions those routines make for your pages, but cut-off layouts are avoided.

Opera is one browser that is used in many handhelds (Nokia, e.g.) and the desktop version of Opera allows you to switch easily to the small screen browser (VIEW > SMALL SCREEN) and see what happens to your page.

By the way, you can use a CSS max-width: rule to stop indeifnitely wide display from happening. And there is a feature for IE called CSS expressions which will allow you to emulate max-width, even though there is no direct support for it in IE's current CSS engine. I've done this quite regularly with good results. Here's a reference for max width and IE expressions [webmasterworld.com]

[peteej]

Thanks, Tedster, the small screen option in Opera helps immensely. I'll also look into the IE expressions as well.