HTML Style Guide

resource center

Design Basics ~ HTML Tables ~ HTML Frames ~ Java & ActiveX
The BEST HTML Tool ~ WebExpress Tutorial

design basics

Rejoice! The days of a strict "Web Etiquette" that places limits on what is and is not acceptable in Web design are nearly over. The capabilities of many browsers have expanded considerably, modem speeds (thus download times) are getting faster, and a host of browser plugins are available for sprucing up site "content".

While these advances are allowing Webmasters and designers to create unique sites that cater to their target audience, there are many basic design issues affecting functionality and convenience that should always be considered:


Web Page Appearance

Colors & Backgrounds:

    The importance of your Web site color selections can't be stressed enough. Different monitors and systems display colors at different contrasts. It's very important to make sure the colors you use contrast well with one another. I remember one page I visited where a turquoise had been used for the background and cyan (light blue) had been used for the foreground. This may have looked great on the designer's own monitor set dark and with very high contrast, but it was nearly unreadable to me.

    Too much contrast can also make a page difficult to read. For example, if your background is black it's better to use a light grey color for your text than it is to use bright white.

Images:

    The Web is a visual medium, so by all means use images to illustrate your pages. Try to place the images as appropriately as possible. It is also very important to keep the time it takes a visitor to download your images uppermost in your mind when you design a Web site. This is true even if your site is about images and Web graphics. There are ways to keep your image file size down, please read the Image Basics section of this Guide for more details

Page Length:

    Try to keep the physical length of your pages appropriate to your subject matter. A good rule of thumb is to keep your page length under five scrolling 'screens'. That means that when a visitor has hit the 'Page Down' key four times, he or she should reach the end of your page.

    If, for example, you have a long story for visitors to read, break the story up into several similar length pages. Provide 'Previous' and 'Next' hyperlinks so that navigating the story will be as easy as turning a page in a book.

Frames:

    Be sure to read our guide to using Frames. Frames can be an asset to a site when they're used properly, but used improperly they can make many visitors give up in frustration! Pay the most attention to links you have to other sites, use the TARGET="_top" modifier on all of outside links so that other sites aren't displayed inside of your Frames.

Sounds, Etc...

Take The Time To Confirm How Your Pages Look!

For your own piece of mind, this is possibly the most important thing you can do. There are many types of browsers available to your potential visitors, and they all (without exception at this point) display HTML content differently. Many don't support the more advanced features like Java at all.

My own way of approaching the browser functionality problem is to check my pages using Netscape Navigator (Version 2.0 and up) and Microsoft Internet Explorer (version 3.0 and up). If it appears properly in those two, I'm satisfied. I use Tables extensively and Frames once in a while, knowing full well they won't appear properly in some of the lesser known browsers. But I try to reach a balance whereby they will remain readable in all browsers.

If you want your pages to look as you expect them to look in all browsers, restrict your use of the 'fancy stuff' like tables, frames, background images, text color, and the like. The best answer is to keep copies of the browsers you want to 'support' on your own computer, then view your pages in each as you develop your site.

A viable option for solving the browser incompatibility problem is to offer duplicate pages with the 'fancy stuff' stripped out. This alternate site can be accessed by visitors that use out-of-date or poorly equipped browsers. This means more work for you, but those visitors will appreciate the thought!

Next Page...

resource center

Design Basics ~ HTML Tables ~ HTML Frames ~ Java & ActiveX
The BEST HTML Tool ~ WebExpress Tutorial


WebExpress home page

Copyright © 1997 by MicroVision Development, Inc.

Vialble Software home page