Good and Bad Practise

Despite the restrictions of Web design (and partly because of them), many guidelines for good layout and design still apply. However there are many which are no longer fully appropriate because of fundamental differences in the medium. Anyone designing for the Web can’t take previously learned rules for granted, they should reassess things carefully. The following points cover many aspects of Web design which are frequently misunderstood or mishandled. Some are typically found in sites made by traditional designers, some in sites made by experienced coders, and some in sites made by almost everyone involved in site design today.

Be wary of using serif typefaces for large amounts of on-screen reading matter. Most of these fonts are actually less easy to read than their sans serif counterparts at small sizes because of the way the serifs pixellate and break up the natural shapes of the letterforms. (See How Type Works.) If a serif face is appropriate, consider Georgia rather than Times, as it was specifically designed for screen as well as print use.
 

Don’t allow paragraphs of text to stretch right across a whole Web browser window, as this can become awkward and tiring to read. Feel free to put text into boxes which can adjust their widths as the page is resized (use flexible table structures in Dreamweaver or GoLive, or check the Width Can Grow option for text boxes in Freeway), but don’t just slap text onto a page without thought and expect to get useful results.
 

Paper simply reflects light, but screens actually generate light. This means that small text on a pure white page background can in some circumstances be a little dazzling to read. If this appears to be the case with a particular layout, experiment with reducing the brightness of the background a little, or dropping in a subtle background image, in order to reduce the overall page glare. Just be careful you aren’t dulling down the look too much.

Don’t over-write or under-edit pages. Too much content presented all at once can be a real turn-off, overwhelming the reader with huge tracts of information. Editing large portions of text into logical bite-sized chunks can make it feel more approachable - although if someone wants to print it out for off-line reading or reference they may find this method less helpful.
 

Be wary of using multiple columns of text. There’s nothing intrinsically wrong with this, but if the columns extend even just a little beyond the bottom of the reader’s browser window they’ll be forced to scroll down and up again just to read whatever it is the publisher has to say. This may seem like a small point, but the less comfortable someone feels when visiting a site, the more likely they will be to leave early and not come back.

Tiled background textures can make pages and sites feel more individual, but they can also seriously interfere with the legibility of anything shown on the page. By all means try out different backgrounds - this can help with the problem of white page glare - but be very critical of anything which might make text even a little harder to read.
 

Don’t use text and background colours which fight for attention, and consider the colours you use for regular, active and visited links. This is something which should be fairly obvious, but there is a surprisingly large number of sites which use unfortunate colour combinations. The default colours for regular, active and visited links are blue, black and purple, respectively. Just because this is the way all browsers show things unless told otherwise doesn’t make it a good design choice. However avoid confusing the reader by picking link colours which visually reverse this standard.
 

Use grids and guides to help align your page contents as you lay things out. This is generally god design practise anyway, as it helps tighten up the visual structure of the layout. But in Web page design, particularly with today’s visual site design tools, using a grid-based approach to object positioning helps the HTML output be more efficient, which means the pages are smaller and can be interpretted by the browser more easily.
 

But don’t let all these things hold you back, see what you can do, and let common sense and experience guide you as much as anything else. With CSS formatting controls and a careful use of layers (which allows overlapping HTML elements) you should be able to produce layouts (such as this one, which is entirely graphics-free apart from the background stripes) that many believe just aren’t possible in regular Web page design.