Ray Richards is founder of Mindspan Consultants and a technology journalist hailing from Ottawa, Canada

Skip site navigation and move to main content of page.

Basic Web Design Principles

As last month we took a look at the emerging Internet connectivity technology ADSL, I thought that this time around we'd examine Internet content itself with a discussion on web site design, implementation and maintenance.

As many savvy small business owners have come to realise, the Internet is a place that not only demands careful attention, but expenditure of considerable time and resources in an  effort to effectively utilise its vast potential. The Internet is not just another advertising medium (although many treat it as such) but may provide a level of information and support to your existing and prospective client base that was unimaginable scant years ago. Where else could you advertise your product or services,  provide technical support, receive customer feedback, generate leads, maintain customer profiles, process orders, deliver product and receive payment on demand, world-wide - 24 hours a day - all for a fraction of the cost of a simple Yellow Pages ad?

The Internet has even bred an entirely new model of enterprise: the virtual business. As this model gains acceptance, greater attention must be paid your investment in this medium. Dabblers will be squashed like bugs on the windshields of travellers on the information highway.

Where to start?

If you have the wherewithal, abandon all home-grown  attempts to design your Internet presence. If you were planning on constructing an office building, would you adopt a do-it-yourself approach, or would you hire an architect? Just as an ugly office building says a lot about your company, a shoddy web site speaks volumes about the level of your corporate professionalism. Stick to what your company does best and let those whose business it is to make you look good do their job. Hire a web design company that employs genuine, qualified, graphic designers in addition to the usual complement of skilled technical personnel. Why? Have you ever seen an advertisement laid out by an engineer? How about art by a programmer? - yes fractals are interesting, but they're not going to improve your lead : sale ratio. If you don't have the budget to explore this option presently, and are determined to dive onto the Internet anyway, the following should prove a valuable reference.

Classic Design Truisms

Since Gutenburg, the fundamentals of  presenting printed material for mass consumption have changed little. The basic colours of white, black and red have been chosen to near exclusivity in effectively conveying textual messages for the last 500 years. Drop Caps and columnar format have been employed with similar regularity for just as long. Why? - if  it ain't broke, don't fix it. Well the web isn't print... No, but the essential design precepts cross over all mediums. Take a look at designs originating from all periods and you'll notice certain elements remain the same; adopt these techniques and your site will be much further ahead as a result.

What standards should I adopt?

The one major difference between the web and all other mediums from the perspective of the designer is the lack of control he has over how his content is displayed. He doesn't know what browser, font size, colour depth or screen resolution the audience has chosen to view his content with. He doesn't even know if the intended viewer has graphics enabled on their browser! With all these uncertainties, it is easy to see why web novices and pro developers alike are often seen pulling out their hair in frustrated attempts at consistent content presentation. Here are some standards to keep in mind when designing a framework for your site:

  • Resolution: Use the median resolution. These days it is 800x600, however in order to avoid annoying 640x480 viewers, limit the width to under 600. People don't mind hitting the page down button, but nobody wants to have to scroll sideways.
  • Colour Depth: Prototype in 16 bit colour. While many web designers still advocate 216 colours (web palette) in order to assure consistency, photographs look terrible at this colour depth. It is a good idea however to use indexed colours for solids and simple figures as the file sizes are significantly reduced as a result. 24 and 32 bit colour are nice but must be carefully considered before use, in light of their inherent file sizes. You can play with the file size after you are happy with the original;  I do not however advocate reducing byte counts at the expense of clean, sharp looking graphics. Having said that, please refer to the next point.
  • Page byte count: This is an extremely important element of good site design. If pages take too long to load, viewers will simply move on. Few have patience for the world-wide-wait anymore. Pages should be kept to under 50K at the upper end, and ideally below 30K. This will no doubt change as bandwidth increases, but for your average 28.8K modem user, this standard is fairly acceptable.
  • Browser Standards: Write code designed to be backward compatible with 3.x browser families. While this is somewhat limiting, there are a heck of a lot of 3.x browsers still out there. I am constantly astounded that, in light of the fact new versions are free, many people almost never upgrade... they still have the same web client they received when they purchased their machine! If you feel that your target audience is more technically "with it", you may choose to write for 4.x browsers; however, if your desire is to appeal to a broad segment of the populous, this is generally not a good idea.

Design considerations

  • Avoid clutter - utilise plenty of white space and ensure your pages are individually  well balanced compositions.
  • Don't confuse your message - nobody cares if your site is optimised for a particular browser, or what nifty unrelated links you have found, or if your spouse has discovered an ancient Mayan recipe for meatloaf. Stick to the point. Unrelated content not only cheapens the look of your site, it often steers viewers away from your key material, often never to return.
  • Keep individual pages short - very few people have the attention span to scroll down endlessly in an effort to fully understand the exact nature of what you are trying to get across. Most will read the first couple of paragraphs, figure they have the gist of it, and move on. Make your site deep rather than long. If the content is served up in interestingly presented, bite sized chunks, chances are far greater that your audience will stick around long enough to appreciate all your hard work.

To sum up

Good design is good design. It crosses all mediums and is invariably self evident. The challenge in the web based arena is maintaining the delicate balance between form and function. If you can achieve this, and ensure your content is dynamic and interesting, you will not only reap the rewards of your investment, but raise the bar on your competition.

For good reference material on web design check out the following books:

  1. The Principles of Beautiful Web Design
  2. Creating Web Sites: The Missing Manual

Originally published in Ottawa Computes! Magazine, February, 1999, by technology columnist, Ray Richards.


Article Index