Laying out web pages
Using Tables
Until recently any web sites that wanted complex layout used tables to achieve their aims.
By using multiple tables 'nested' on top of a base table complex layout can
be built up.
Some problems emerge however as the move to higher resolution screens meant
there is a need to design, not only for different browsers, but also for different
screen resolutions.
- It is easier to design pages in 800*600 if you want to achieve different resolution capability
- Check how your pages look in different browsers
- Be careful not to use too many percentages The various browsers all calculate these differently, so you can't place your columns very precisely.
Formatting the layout
A variety of techniques are used to set out the page so that the layout is attractive and different sections are delineated.
Graphics are extensively used both for background colour and for navigation elements
Both white space and lines/boxes are used to break up and separate blocks of text
- .png graphics are favoured by many fortheir superior rendering, but don't use too many as they will slow down the page loading
Layout of this page
This is a CSS template
Conventional variable-width, no-tables, three-column layout with usability and dynamic templating (PHP...) in mind. It may be used for blogs, but may also be suitable for other needs.