Design Resources: Good Web Site Design

All the hype about the potential of e-commerce and the Internet leaves aside one small fact, which has huge consequences if you get it wrong: the importance of web design.

Let's face it - a lot of the web design is just downright awful. We've all seen examples of web design that make 1960's psychedelia look relatively. The tragedy is that it doesn't have to be that way. By applying some basic web design rules, you can turn your gaudy, difficult-to-use web site into a professional, good-looking place that people will want to return to regularly.

One of the most important factors of web design is navigation. Many people design their web sites without first having a clear idea of its structure. Before doing anything, a savvy e-commerce web site operator will consult with a web site designer about how the site should be divided into logical sections such as products/services, corporate info and support.

In good web design buttons and links are labeled clearly so that users know what the links are pointing to.

Graphics and animations play an important part in professional-looking web design. Used wisely, they can add panache to a site that contributes to your overall brand image. When used inappropriately they will do exactly the opposite. Obviously the use of bandwidth-heavy graphics must be avoided at all cost, and those animated GIF's that look like MS Word clip art are a sure way to make your site look amateurish.

If you do want animations on your site, then Macromedia's Flash program is so well-known that it's effectively a de facto standard. But make sure that any animations you use are functional. Simply putting animated banners and icons on a site because you have the capability is not advisable, but if it increases the usability of the site then it's acceptable.

Browser compatibility
The golden rule in web design is to check that the end-user's browser supports the technology that you're using - whether it's Flash, or something else - and to provide an alternative, low-tech version if it's not compatible. Any well-informed HTML and JavaScript programmer will be able to implement this.

Standards compliance and backwards-compatibility with older browsers is important in good web design. The World Wide Web Consortium (W3C) is the central authority on standard ways to describe the information in your web site to visitors' browsers.

Theoretically, marking up your HTML and other web information to these standards should ensure that your web pages always look as it was intended.

Unfortunately, coding to these standards is not enough. While the latest versions of the most popular browsers (Netscape 6 and Internet Explorer 6) are standards-compliant, older versions of these browsers were not.

Your web site should be able to work with Netscape 4 and 6, for example, and this is no mean feat, because Netscape completely redesigned the underlying browser engine in version 6 to be more standards-compliant, meaning that some sites designed for version 4 don't work under the new version.

Using XHTML, a relatively new standard from W3C, can help to cope with this problem by enabling programmers to include different display instructions for different browser versions as part of the web site content. These guides are known as style sheets.

Cascading style sheets
Regardless of whether they're used with XHTML or not, cascading style sheets are an invaluable tool on any web site, because they can also be used to create a set of standard display guidelines for site content.

You may wish for all of your headlines to be displayed in pale yellow against a dark blue background in a font size of 24, for example. Instead of having to specify this every time, you can simply create a style sheet dictating that every headline in your web site should be displayed this way, thus ensuring consistency.

You can validate your use of style sheets against W3C standards in the same way that you can validate your HTML, by surfing to http://jigsaw.w3.org/css-validator/.

Test, test and test again
Making sure that your site looks professional is about a mixture of technical know-how and artistic skill. Reading a book or two on good web design will give you much more in-depth knowledge than this article can but, in general, the rules of aesthetics dictate that less is more; subtlety goes a long way.

And when you've gotten your web design just the way you want it, be sure to test, test and test again, on every version of every browser that you can find, to ensure that it looks good to all your users.