Fixed Width Vs. Liquid Width

As discussed in the previous post, all pages represent the overall character of the web; therefore, they must be designed in such a way that highlights consistency and balance. There are two general types of webpage layout to choose, namely, fixed width webpage and liquid width webpage. Each type has its own advantages and disadvantages. Therefore, before choosing either of the two options, you need to understand how they work.

Webpage Layout: Fixed Width Layout

As the name suggests, fixed width webpage refers to a layout whose width does not change based on the width of window the visitors use. In this type of layout, the width of the entire page is fixed to a specialized size based on the web designer needs and preference. The web layout remains consistent, regardless of the browser and the screen size.

There are some arguments for this type of web layout. It is suitable for a website with a print background. In this way, the web designer sets print layout for specific paper size to facilitate the visitors in printing the webpage contents. It is also recommendable for placement-sensitive items in the web page. For instance, where words in a single column must be fixed in its position to match a picture or a figure, using fixed width webpage layout is indicated.

However, there are also some arguments against it. Since the layout is frozen at a specific size, it may be less interesting when viewed from a larger or a smaller window. On a large window, there will be unused space on the right and left parts of the screen, since the layout look remains similar. On the other hand, when viewed from a smaller size, the visitors may have to scroll left and right to view all of the contents in a single page.

Web Layout: Liquid Width Layout

This is also called relative width layout. As the name suggests, it expands and contracts based on the size of browser window. The contents fill the entire space. There is no useless space in larger window or no unseen content in a smaller window. Liquid Width Webpage is based on certain percentage of the browser window. It contracts and extends based on the window size. This is suitable for a website that presents a lot of information in a single web page, where the available space may be limited.

Again, regardless of which webpage layout you choose, make sure it is based upon the characters of the contents in the webpage. Finally, the layout must be consistent since consistently will affect the design, but also the overall impression of the website.

back to articles