Fixed versus Flexible Web Page Design 21DisplaysA Variety ofFixed versus Flexible Web Page DesignWeb Design in a Nutshell, eMatter Edition- It is still difficult to control type size in browsers (see Chapter 3 for more
information), so elements may still shift unpredictably as a result of larger or
smaller type than was used during the design process. - Trying to absolutely control the display of a web page is bucking the
medium. The Web is not like print; it has its own peculiarities and strengths.
Advocates of the flexible design strategy will tell you that fixed web page
designs are out of place on the Web.
Creating fixed pages
Fixed web page designs are created by putting all the contents of the page in a
structural table with absolute measurements specified in pixels. Other tricks, such
as sized transparent graphics or Netscape’s proprietary
used to maintain consistent element placement or to hold specific amounts of
white space on the page. The positioning elements in Cascading Style Sheets also
provide ways to set specific dimensions and placement of web page elements;
however, as of this writing they are not well supported by most browsers.
Some visual HTML authoring tools make it easy to create fixed-width designs. Most
notably, GoLive Cyberstudio(www.golive.com)actually lays out your page on a
grid as though it were a page-layout program, then automatically generates the
corresponding (and often complicated) table. Macromedia’s Dreamweaver
achieves fixed page layout via the absolute positioning functions of CSS.
Pop-up windows
Some web sites take advantage of the ultimate in fixed web page design by auto-
matically popping up a new window sized precisely for displaying the contents of
the page. The advantage is that all viewers, regardless of their monitor size, will be
certain to see the page in a browser window with the proper dimensions. It gives
the designer even more control over the presentation of the page.
This trick is achieved using JavaScript to launch a window with specific pixel
dimensions, so the obvious disadvantage is that it will not work for users without
JavaScript-enabled browsers. Furthermore, many users have a strong adverse reac-
tion to having new windows spontaneously opened for them. It takes control of
the presentation—and the entire desktop—away from the end user, which is unac-
ceptable to many web designers. Furthermore, because users have different font
settings, text will wrap or be cut off in unpredictable ways for some users. See
Chapter 22,Introduction to JavaScript, for a window-opening code example.
Combination Pages
Of course, web pages need not be all-fixed or all-flexible. It is certainly possible to
create pages that are a combination of the two.
One common technique is to create a fixed page layout using a table, but then to
center the table on the page so it is more balanced when displayed on large moni-
tors (avoiding the blank right screen effect). The drawback to this technique is that
the table can no longer be precisely placed over a background image. Many sites
use a band of color in the background image to reinforce the columns in a fixed