This is yet another web-related topic that gets people arguing. Not quite as bad as “Mac vs. PC,” it really gets some people going. Which is better, a fixed-width layout, or a fluid one that resizes to fit the browser window. Unlike some people, I say that it depends on the project, and that there isn’t a one-size-fits-all solution (though I do lean slightly toward fixed-width layouts). Besides, if we all agreed on standards for everything, we wouldn’t have anything to argue about..
Both sides of the argument have their pluses and minuses, and generally I would say “go with what best suits the instance.” If you want a certain look, which will require vertical tile images, and other images of specific width, you may need to go with a fixed-width layout. If you want as much control as you can get over the look of your design, or if you need your content area to be a specific size, go with a fixed layout.
Liquid layouts can adapt to the available space in the browser’s viewport, which makes a site more accessible, avoiding the annoying horizontal scrollbar that fixed-width layouts often generate at low resolutions. If you can put together a good-looking liquid layout that works well in your given scenario, go for it. However, you must rely on the CSS attributes min-width and max-width to make sure that your design can’t shrink too much, squishing your beautiful design into an illegible mess, or two wide, making for long, hard-to-read lines of text on large widescreen monitors. Too bad the attributes don’t work on Internet Explorer 6 (big surprise)!
You could also go for a hybrid layout where parts of the design are fixed, and others liquid. You could have a fixed-width sidebar with a liquid content column, for example. I’ve found that this method works better than having everything based off percentages of ems.
Unfortunately, we’re plagued by small groups of people with low-resolution monitors, very big widescreen monitors, tiny mobile web phones, and outdated browsers like Internet Explorer. We’re ill-equipped to handle all the possible scenarios, and far too many people don’t update their browsers in a timely manner, resulting in a lack of improvement in that area. All we can really do is support as many browsers and resolutions as possible, and wait for people’s computers to stop working, so they will get a modern machine, resulting in a tiny step forward progress-wise. Eventually Internet Explorer 6 will die-out, giving us better support for liquid layouts, which are becoming more and more important as screen resolutions diversify, having increasingly different aspect ratios as well as pixel dimensions.
Further Reading…
I managed to dig-up a post I found via Smashing Magazine back in August 2007. – CSS Layouts: The Fixed. The Fluid. The Elastic.
