Using various web-page layouts in flexible web design

The art of web designing involves meticulous layout settings besides choosing the right graphics and animation for a page. Any graphics designer involved in web designing would categorize page layouts into three types: fixed-width, liquid and elastic. The differentiation is entirely based on the width settings for a layout which is again chosen specifically based on the web page’s content, theme and overall purpose of the website. Although, there are significant distinctions among these lay out, one can also combine these to create hybrid layouts for web-based custom graphic design. The layouts are discussed below: Fixed-width layouts Fixed-width or rigid pixel layouts are the basic form of web page layouts. Here, the layout’s width and height are fixed to a certain pixel size (for example, 800 X 600 or 1024 X 768). The advantages are:

• It allows designing pages that would look identical for all
• Fixed width elements such as images will not affect text display.
• For large text-content, scan length will not be affected for wider browser views.

The disadvantages are:

• It may create horizontal scrolling in a small browser window.
• Larger white space in higher resolution views

Liquid layouts Liquid layouts set the page display in accordance with the viewport or the actual viewable area in the user’s browser. The advantages are:

• Automatic expansion and contraction to fill the available space
• It allows a creative graphic designer to use space optimally. Pages respond dynamically on user-defined settings like font sizes etc.

The disadvantages are:

• Lack of proper control over page elements
• It may result into disproportionate text columns
• It may create overlapping for fixed-width elements like images.

Elastic Layouts Elastic layouts are useful for text-size adaptability and the change is width is based on the font size set in the user’s browser. Thus, for a larger default font size in a user’s system, the entire layout will become proportionately bigger. Elastic layouts give better typographic control, improved readability through standard line length and increased accessibility.

I am the webmaster at www.synapsewebsolutions.co.uk – a custom graphic design offering quality and cost-efficient offshore website design and development solutions.