Even if you’re not a Maine middle or high school student and planning on entering a site in the Maine Student Web Design Awards, you may have considered building a web site for your business or hobby. It’s not that hard to do, but like anything else, there’s a fine line between doing it and doing it well.

Whether you’re using a commercial web design application, or hand-coding HTML, or using a browser-based tool, here are some rules to live by to get you started.

Despite the growing numbers of DSL and cable modem users, most home internet surfers (as well as “road warrior” laptop users) are still using a 56K modem dial-up connection. I’m not advocating building specifically for dial-up users, but as you design you should always have them in the back of your mind. Remember that internet surfers have pretty short attention spans, and if they see a couple of minutes’ wait for your content, they’re liable to move on.

Larger computer monitors are also becoming more affordable. There are still many 15-inch users out there, and if you make your site too wide, you’ll force them to scroll horizontally. There are two schools of thought here – design your page, using tables, to display everything in a given width (600 pixels is about right for a 15-inch monitor, 750 pixels for 17-inch monitors); or, make the width “dynamic”, meaning the width of your page stretches to the size of the viewer’s browser window. A dynamic width gives you less control over the aesthetics.

Text is still the predominant feature of any web site, and managing it correctly can make or break your site. You can specify the font, but remember that if the viewer’s computer doesn’t have the same font installed, you may not get the look you want. The best advice here is to use a “common” font, like Arial, Geneva, or Times if you want a “literary” look. Also, try to use the same font throughout the site – it contributes to a cohesive theme. Different browsers and operating systems can wreak havoc on text size as well, although modern browsers give the viewer the option to increase or decrease text size on a given page. Use bold and italic text sparingly, only when you want to emphasize. Too much bold is like someone shouting the web site at you. Finally, remember that ergonomically, reading text becomes a strain to the reader if they have to read too wide a column – give your text areas a 400-500 pixel width.

Images add pizzazz to your site, but they can overwhelm as well. There are three “sizes” to any image. There’s the space it takes up on your web page (measured in pixels); it’s physical file size (measured in bytes); and, it’s resolution (measured in dpi - dots per inch). All three sizes are adjustable, but changing one doesn’t necessarily change the others. For example, even though you can tell your web design tool to make a high-resolution photo appear smaller on your page, the physical size of the image doesn’t change, and may be so big that it takes an eternity to load in. There are several good image-editing tools that can adjust all three sizes to make good-looking images that load in quickly.

Color management is also key. There are established “web safe” colors that all browsers “see” the same – use them! Also, use complimentary colors – you remember them from the color wheel in art class!

These rules to design by just scratch the surface, but they’ll get you off to a good start.

© 2003 Peter F. Zimowski