When designing a website we work with you to design an attactive style and layout. But it is useful to examine what kind of limitations there are in layout out a site.
There are effectively two different ways of laying out a website.
While the better use of space in a fluid layout is desirable, it is more important to make an attractive site. A fixed layout is much more compatible with graphic design principles than a fluid layout, and it is simply unavoidable to make this trade-off to give designers creative reign.
When working with fixed layouts it is typical to assume a minimum browser dimension or around 750 pixels wide by 450 pixels high. Sometimes it is possible to remove this assumption at a later stage, restoring a desirable fluidity.
It is interesting to examine some of the ways it is possible to lay out a web site.
A quick and easy layout that can nevertheless be visually striking uses a graphical header, followed by a navigation bar, which sits above the body of the page.
The bar is ideal for drop-down menus, although drop-down menus can suffer from accessibility problems unless graceful degradation is carefully built into the system. This can be done very successfully and elegantly.
A more flexible grid uses a panel down the side which can contain a variety of navigation panels and other controls.
This is a very common layout because of its flexibility.
Many websites based on a variation of this grid attempt to fill the panels with as many widgets as possible, but sometimes the widgets end up being meaningless filler
Of course, the panel could go on the right hand side instead of the left.
This will sometimes lend an off-beat air to the layout, and can be employed to ensure that the content has priority and that supporting content remains peripheral.
It's possible to have a panel either side.
This grid is useful when there is a lot of peripheral information and less body content. The danger is that the layout starts to look 'busy' and a visitor's eye can be all too easily distracted from what is important on the page.
Some e-Commerce shops and many portal sites use this kind of layout.
It's possible to produce a very trendy layout by moving the header towards the bottom of the page.
Headers should be immediately visible and this style therefore only lends itself to situations where the content can be kept brief or split into very small pages. The body region will typically scroll on its own to keep the navigation and header on screen at all times.
There are some less well-known variations too.
These can often be discounted as too experimental for most purposes but could be worth considering in some applications.
Sometimes it is possible to use layouts which put much more emphasis on the content by stripping out most of the purely aesthetic elements.
A layout such as this one will be most useful as a sub-section of some larger site.
Particularly stylish creations may impose purely aesthetic constraints on form at the expense of flexibility of content and function.
One-shot layouts such as this can be particularly captivating, but when the layout is duplicated on more than one page, it quickly becomes tired and boring. If variations are used instead, pages may look uncoordinated and untidy.
