There are a lot of choices to make when developing a website. Some are obvious, like what content to keep and what to cut, or whether to offer e-commerce. However, the ramifications of some choices don't become evident until after the site has been built.
One question that we ask as part of our Design Questionnaire is whether the client wants a “fluid” or “fixed” site. We also offer two additional choices: “Doesn't Matter” and “Huh?”
The decision at this point will greatly influence the site design and the Information Architecture (how the information on the page is arranged.) Despite the importance of this choice, it's often misunderstood by business owners until it's too late. I'm here to clear up that confusion.
Fluid vs. fixed refers to whether your Web page will “stretch” or stay “fixed” as the width of a browser window changes. When you send out a postcard to a thousand prospects, you know that the dimensions of each card, say 4″ x 6″, will be identical no matter who receives it.
When you distribute information over the Web, things get trickier. Monitors range from 12″ – 23″ and up. Even people who have identical monitors may see differences depending on:
- their screen resolution
- their operating system
- their choice of browsers
- whether their browser window is “maximized”
- the size and presence of their toolbar, status bar, address
bar and favorites bar - a number of other variables.
Fluid Pages
A fluid page will flow to the confines of the browser window. This means paragraphs will rewrap as the browser window is resized.
Many people believe fluid pages look better on a wider variety of browsers because they are more “accommodating.” A truly fluid site is considered to be more “accessible” due to its ability to fit into any type of browser window, even a handheld device. However, these truly fluid sites give up almost all control over design and layout due to their nature.
Fixed Pages
A fixed page, on the other hand, will stay the same width and float on the background regardless of the size of the monitor. You can see an example at the Dish Diva's site, which flyte designed. For example, if you have designed a fixed site to be 740 pixels wide, it will appear that wide on an 800 pixel-wide browser window or a 2,000 pixel-wide browser window. The difference will be in the background color or image, which will grow or shrink to fill up the “white space.”
Imagine an 8.5″ by 11″ page on an end table. Now move that same page to a large dining room table. The size of the page hasn't changed, but there's a lot more background, or in this case, table space, in view. That mimics the behavior of a fixed page. Whether the page works better as left or center justified is often determined by the design of the page.
Fixed pages are great when you want complete control over the layout of your page (or as complete as the Web will afford you.) One downside is that people who visit your site with a small browser window may have to scroll left to right, as well as up and down…a frustrating browsing experience. Visitors with a large monitor may see more background than content.
Which is right for you?
There is no right answer here. I was a big proponent of fixed width design for years, but in the past few years I've realized the benefits of a fluid site and redesigned flyte's own website to be fluid.
When making your decision, revisit some of your favorite sites and try resizing the browser window. This may give you an idea of which site is more appropriate for your business and your audience.
If you have further questions about fixed vs. fluid websites, please contact us.
–Rich Brooks
President, flyte new media