The Basics of Good Web Design

It doesn't matter if you have the world's greatest product or service if you are trying to sell it from a bad website.

From a visitor's point of view, a good web site is
    * Easy to use
    * Has something he wants
    * Does not waste his time
    * Is not annoying.

There is a lot of room within the following design "Rules" for you to express your unique creativity while still building a good, usable website that people will want to use and return to.

  Let's Start With Your Website Layout

Stick with the "standard" layouts... the reason that 2 and 3-column layouts are so prevalent is that they work. Yes, they're a little boring, but remember that we're not designing websites for ourselves. We're supposed to be designing websites for our visitors, and we really should try to avoid confusing or annoying them.

Don't cram all of your content onto one page, make as many pages as you need to keep each page small enough so that your visitors don't have to scroll down more than three or four times to reach the end.

Never make your visitors side-scroll to read your content. Either use a fixed-width template that is small enough to fit a 800x600 monitor, or one that flows to match the monitor size.

Keep your paragraphs short, three or four sentences, and leave enough empty space around your paragraphs and page elements that the page isn't too 'busy'. Most people don't really read web pages on the first viewing, they skim them. If everything is crowded too close together it's harder for visitors to skim the page.

  Your Graphics

There are two types of graphics... those that are integral to your website design, and those that illustrate your product or service.

Integrated design graphics are the images that put rounded corners on your tables, give you visually interesting menu buttons, make your logos, etc. These images are essential to your design and the options for using them are limited to the design of your website.

Illustration graphics should be used only illustrate or elaborate upon your content. Your options should be limited by your actual need to illustrate or expand upon something in your content.

If your website is about amazing military aircraft, then a cool pic of a stealth fighter is a nice addition, but a cute pic of your pet ferret is just wasted space.

Smaller is better. Huge images are the biggest cause of slow-loading pages. Yes, the number of people using broadband is going up, but even so, large images still slow things down.

Reduce your image file sizes by using an image cruncher to decrease the number if colors in the image. Use .gif images whenever a .jpg image is not needed... and never use a .bmp file for a photo type image.

Images the blink, flash, spin around or bounce & jiggle are not only annoying, but they also eat up bandwidth. If you don't need them to illustrate something then just don't use them.

  Your Navigation Scheme.

It's fine to experiment with unique navigation systems if you're designing a family website, but if you are trying to reach a wide audience then you should give them simple, consistent navigation that they can figure out fast.

Make it easy for visitors to find what they want from any page. The most popular pages should be the easiest to find.

  Your Text Elements.

All the text on your pages should be easy to read. That means high contrast between font color and background color, and words that are large enough to read without eye strain. Dark text on a light background is also easier to read than light text on a dark background.

If you specify the background colors, but don't specify the text and link colors, the visitors default text and link colors will be used. In some cases, there won't be enough contrast between the default text colors and your background, so your text and links may be hard to read, or even disappear altogether. If you specify one color, then you should specify them all.

Serif type fonts like Times New Roman or Courier are ok for large text like headlines, but for normal sized text you should use sans-serif fonts like Arial or Veranda, because they are much easier to read on a computer monitor. If you use serif fonts for smaller text, the serifs can blur together on the screen making them hard to read.

Note - if you provide printer-ready pages, like recipes or instructions, you should use the opposite font rules on those pages: sans-serif for headlines and serif for normal text.

Limit yourself to two or three standard, common fonts. Too many fonts make a website look amateurish, and while an uncommon font may look good with your design your visitors must have that font installed, or his browser will default to a standard font anyway.

Your paragraphs should be left-aligned. Centered text is good for headers or for making something stand out, but not for everything. Paragraphs that are justified (equal width text) often makes the space between words and letters variable, which is harder to read.

  Limit Your Advertising

Don't get greedy with the number of ads on your website. Your visitors are not interested in your ads, they are coming for your content. Too many ads, especially those annoying flashing banners that have nothing to do with your content, will just drive them away.

I know, I know, we all need to make money from our websites... but driving our prospects off is not the way to do it. Follow the 80/20 rule: 80 percent content, 20 percent advertising.

Treat ads as you would any other image or text content - Keep them small, avoid blinking and flashing, and make sure they are relevant to your content. If the content of an ad is relevant to the page content, they're much more likely to click on the ad.

Which is why contextual text advertising is so common: It Works.

  Test Everything.

All your page layouts and features should work properly in all major browsers. At the very least, get copies of Opera, Firefox, MSIE(6), Lynx and Netscape. Also, if there is any possibility that your visitors might be using some other non-browser web access like phones or PDAs, learn how to make your site PDA-Friendly.

Spell-check and proof-read your pages. Familiarize yourself with the basic rules of grammar and style too, it will help make your written content clearer and more effective.

You should also routinely check for broken links. A good free tool for that is dead-links.com, it's slow but thorough.

  Do Not Use a Free Host.

With the low relative cost of good, full-featured website hosting available these days, there really is no excuse to take the risks or accept the limitations of free website hosting.

If you're looking at all the possible hosts and wondering what to do, I can recommend 1&1 hosting, I'm using them for all my sites, and a few of my friends sites, and they are very good.

  The Number One Thing: Provide Content That Your Visitors Want.

Concentrate your efforts on adding useful content that is focused on your topic. If your website is about Awesome Military Aircraft, don't go off on a tangent and start adding content about raising ferrets.

Cover the topics that your target audience wants to read and give them an easy-to-use, helpful website... they will stay longer, return more often & tell their friends about you too.

To Your Success!
Tim

By Tim Brown © 2006. About the author: Tim is the webmaster at http://BLT-Web.com, where webmasters can find free tools, advice, tips and other useful resources designed to help them build a successful website.

---

Webmasters & Publishers:
You are welcome to publish this article free of charge on your website, newsletter, or e-zine, provided:
* You don't change the article in any way and all links remain intact.
* You include the entire article, including the "about the author" box.
* In doing so you agree to indemnify the author, blt-web.com and its directors, officers, employees and agents from and against all losses, claims, damages and liabilities which arise out of its use
* I would appreciate it if you send a courtesy copy of your publication to