Three Web Design Essentials

by Marc Lee

Poor design turns potential Internet customers off and turns them away. The result can be a disaster. First impressions count online, and we tend to judge web sites first by the things we hate.

Three design essentials must be considered in order to make surfing so easy for the web visitor that it holds our interest. Think about what turns you off when you're browsing the web. Perhaps you hate the same things I've heard from people time and again:

We hate to wait

We hate to scroll

We hate to read.

A good web designer will automatically avoid the pitfalls of waiting, scrolling and reading. You shouldn't even have to ask. But you do need to know about them.

Don't make us wait while your site loads -- design for speed.

Don't you hate to wait for a slow-loading website? Although everything on the web is faster that we once could have imagined, getting faster, there are limits.

Most of us still use relatively slow modems to access the Internet. The worst thing you can do on your site is to make us wait more than 20 seconds for the first screen to appear. We can't always control the wait time. Internet traffic across the web, traffic on our local internet service provider, weather that adversely affects the quality of phone line transmission -- we can't control these. But large pictures or too many small graphics will make the wait longer.

• Keep the total size of every screen to a minimum.

• Add graphics incrementally, reusing images as you go.

• Optimize every graphic on your site so that its file size is as small as possible.

Don't make us scroll -- put important information on top.

Newspapers have trained us to expect important information up front. When we have to scroll through pages to look for what's important, we get lost.

We don't all have huge computer monitors. Most of us have small 13" or 15" computer monitors. And many of us leave our monitor display at the factory setting. The result is both a larger type size and little available display space. Because web browsers take up a portion of each screen, there is a space roughly 4" high and 8" across in which your web site design must capture our attention.

• Put the most important material in the top 4" of every page.

• Never ever let a page run more than 12 vertical inches (and try to hold each page to a maximum of 8 vertical inches)

• Never make visitors scroll horizontally. Limit your horizontal space to 8".

• Put your main navigation links on both the bottom and the top of the page whenever there is a chance of the web visitor scrolling and losing site of them.

Don't make us read online -- help us scan.

Avoid Information saturation. The temptation of the web is make us read. Resist the temptation to publish everything about your organization. Less is more! It is far more important to edit and compose three succinct web pages than to generate one long and rambling page.

Use Visual Navigation cues. When I'm on the web, I don't read, I look,. I look at pictures, I look at headers. Not every word on a page is of equal importance. Colors, type sizes and bold lettering tell me where I'm going and what's important. Pictures that convey information online are indeed worth many thousands words (but be sure they download quickly!)

Select fonts carefully. We don't read on the web because reading from computer monitors is difficult. Most of us, when we find an important article that requires careful reading, will print that article and read it later. In the print world we always use 'serif' fonts (with curlies on the ends of the letters) because the curlies help our eye move from one letter to the next. On a monitor serif fonts are muddy and hard to read.

• Use a 'sans-serif' font (no curlies at the ends of letters) for portions of web pages you expect to be read on a monitor, and a serif font whenever you expect your audience to print a document.

• Use pictures, graphics, colors, type sizes and bold lettering to help us process information.

• Compose information in layers so that we can find what we really want. And edit everything for length as well as content, grammar and spelling!

There are many subtle variations around the concerns of waiting, scrolling, and reading. At Affinity Web Design we take serious account of all of them as we build each customer's web site.

We hope you have found this information helpful. For more information or assistance with your web site or Internet needs, contact Marc Lee at

Affinity Web Design. 785-832-2299 marc@affinitywebdesign.com

Copyright © 2004 by Marc Lee, Affinity Web Design.