Fixed Versus Flexible Web Page Design

Closely related to the issue of varying monitor resolutions is the question of whether web pages should be designed to be flexible (resizing and adapting to various window sizes) or fixed at a particular size (giving the designer more control of the page’s dimensions). There are very strong opinions on both sides, and there are good reasons for and against each approach, naturally.

Browser and system measurements
Browser and system measurements

Figure 2-1. Browser and system measurements

You may find that you choose a fixed structure for some sites and allow others to be flexible, or you may have strong convictions that one or the other approach is the only way to go. Either way, it is useful to be familiar with the whole picture and the current opinions of professional web designers. This section attempts to present a balanced overview of the possibilities and the pitfalls.

Flexible Design

Web pages are flexible by default. The text and elements in a straightforward HTML file flow into the browser window, filling all available space, regardless of the monitor size. When the browser window is resized, the elements reflow to adapt to the new dimensions. This is the inherent nature of the Web. Designers who are initially traumatized by the unpredictability of where page elements land usually just learn to ...

Get Web Design in a Nutshell, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.