Rocket 88

websites

24/7 Sales & Support (480) 624-2500

Layout Decisions: Fixed Width or Liquid

March 10th, 2009

One of the greatest debates in web design has to be between fixed or liquid layouts and the proponents for either side are fierce loyalists. Which is why it is worth bringing up before you plan your perfect site design. If you don’t know the difference then there is even more reason for you to read on.

Fixed Width

A fixed width is constant and unchanging. No matter what size a users browser window is set to, the content area of the page stays the same, or “fixed”. This method affords you more control over the precise look of your design. If the width of the content area of your page is fixed then you can add graphics and text in pixel perfect layouts and be comforted in the fact that your design will look relatively the same on everyone’s computer. You have seen this before: the content area usually “floats” in the center of a simple background either of solid color or a simple repeating texture. This web site, for example, is a fixed-width design.

The big drawback to this method comes with the assumption that all users are browsing with windows open to a certain dimension. If that dimension becomes smaller than the width of your content area, the user is forced to scroll horizontally to see all the content, and if the user has a huge screen and browses with the window open wide, there will be a lot of empty space on your site dwarfing your content.

Liquid Layouts

On the other side of the argument, liquid layouts are designed to be entirely flexible: as a users browser window expands and contracts, the page layout follows suit, ensuring that the content fills the display at any window size. Liquid layout designs are subservient to the preferences of the user: as a window is resized, the text will flow to follow suit. The danger of this is that if a user browses with a narrow window, text will tend to be rendered in tall, narrow blocks as graphics or pictures squeeze them into smaller spaces and conversely, with the window open wide text can become long, unmanageable lines that are difficult for a reader to scan. Furthermore, the lack of control over the content area’s width can be difficult to balance when placing fixed-width elements such as photos into it.

So which layout do you use? The truth is that both methods have strengths and weaknesses and neither is inherently superior to the other. You can spend a great deal of time arguing over which method is best, but the bottom line is that you will have to make this decision based on the important aspects of the site: will graphic layout play a more important role? or is screen real estate the determining factor? Once you are over that hurdle, the important part can begin because the one secret is that the relative width of a design’s content area is not going to be the determining factor in the success of the site. Don’t get me wrong: a great-looking site can be impressive, even essential if the subject of the site has to do with presentation. Intuitive navigation is ultimately very important as well, but mostly, beyond the design, content is the most important factor in website success. Choosing how to display it effectively should be a consideration in the early stages of planning your site.

Leave a Reply