Web Ugly

February 27, 1997

Robert Hess

The following article was originally published in the Site Builder Network Magazine "More or Hess" column. (Now MSDN Online Voices "More or Hess" column.

Remember the early days of computers, when the Macintosh® first exposed users to a wide selection of fonts they could use in documents? I think there were only a dozen or so different fonts installed on the systems at the time, but that was more than enough for amateur designers of the day to wreak havoc on the brochures, flyers, and announcements they produced. Soon, the term "font ugly" was coined to describe the results.

A similar phenomenon is upon us today. The Web, and its requisite HTML documents, not only puts dangerous visual design features in the hands of mere mortals, but also gives those mortals unprecedented abilities to distribute their documents to a worldwide audience.

The problem with awkward, poorly structured, or just plain ugly Web sites is that nobody will gain any benefit from them. Casual users, who happen to find such sites, will quickly leave. Users determined to explore them will feel constantly aggravated, which will color their view of the individual or organization that has put up the site. And the site's owners will not get the traffic they expected, and will blame the Web for not being a proper medium for their message.

Why do so many Web sites fall prey to Web-ugly design? There are three main reasons. First, it is too easy to take an existing form of communication and simply move it to the Web. How often have you seen a Web site that is simply a scanned-in copy of a brochure, with minimal--if any--modifications to provide content formatted for the Web?

The second reason for poor Web sites is that people often have a hard time grasping the notion of hierarchical organization of information. Many who get past that step fail to recognize the power of hyperlinks, and how they can help create a Web site that doesn't constrict users to a pre-set path for information discovery. We've all seen sites that require us to dive through dozens of pages before we get to the page we really want. And then we come to those single-page sites that seem to scroll on forever, resembling those dreaded "Christmas letters" that recount the entire past year in a single stream of information.

Probably the primary reason for Web-ugly sites is that it is far too easy to add tags and attributes that actually obscure the site's content. While this can specifically apply to assigning background images that compete with the text rendered on top of them, it can also refer to the use of supposedly cool tags that aren't really appropriate for the message. Most Web "artists" have created one or more pages that use every possible tag the designer can think of. These are the pages that truly deserve the term Web ugly.

With fonts, it was simple enough to tell people to limit the number of fonts in a document to two or three, and leave use of any more than that to professionals. However, with Web documents, there are literally hundreds of different ways to render documents that should never see the light of day. Cautions about overuse of tags, such as <CENTER>, <BLINK>, and <MARQUEE>, are simple enough. Start dealing with some of the more grievous sins of Web page design, and you soon paint yourself into a corner--especially with novice designers who often don't realize how inexperienced they are.

Robert Hess is an evangelist in Microsoft's Developer Relations Group. Fortunately for all of us, his opinions are his own and do not necessarily reflect the positions of Microsoft.

Take out the tag trash

A good approach to take when building a Web page is to forget temporarily about the various cool tags you might be itching to try. Instead, think about the message you want to present to your audience, as well as the message for which your audience might be coming to you.

Start by simply writing out what you want to say, in plain, simple text. Then fine-tune the wording, paying attention to any hierarchical structure that might be falling in place. Eventually, you will be ready to start adding tags and attributes that will enhance your message and turn your information into a truly interactive, informative Web site.

Ask yourself, with every tag you add to your page, if you are doing it because it truly adds to the informational content you are presenting, or simply to show people that you can spell "marquee."

Kids, don't try this at home

To see how much damage can be done in just a few lines of code, view a page I quickly threw together. It's chock full of Web-ugly traps. CAUTION: Prepare to hit the window's Close button very quickly.

Photo Credit: Russell Illig/PhotoDisc; Neil Beer/PhotoDisc