Web Site Design Goodies

Web Site Design Goodies

by Joe Burns, Internet.com Corporation Staff, internet.com Corporation

Joe Burns' fast and friendly approach to building a Web site keeps over 1,000,000 people coming back to his HTML Goodies Web site every month to learn HTMI„ JavaScript, and other Web site creation tools. Now Joe has gone way beyond the Web Site Design Goodies!

Let Joe show you how to create a Web site one step at a time. Start by learning the

See more details below


Joe Burns' fast and friendly approach to building a Web site keeps over 1,000,000 people coming back to his HTML Goodies Web site every month to learn HTMI„ JavaScript, and other Web site creation tools. Now Joe has gone way beyond the Web Site Design Goodies!

Let Joe show you how to create a Web site one step at a time. Start by learning the fundamentals of good Web design, focusing on your visitors and their needs first. Joe will help you decide on a server, plan your site before you start, and consider the real value of graphics and other "cool" add-ons. Throughout the book Joe critiques actual, published Web sites to illustrate every concept. Joe's tips are enhannced by feedback from his online readers and a professional survey of what makes Web pages great - and what doesn't.

Product Details

Pearson Education
Publication date:
Product dimensions:
7.40(w) x 9.20(h) x 0.99(d)

Related Subjects

Meet the Author

Joe Burns, Ph.D., is a professor of communications at Susquehanna University in Pennsylvania and the sole creator of the award-winning HTML Goodies web site. He has been creating web sites since the first version of Mosaic was released. He began unleashing his fast and humorous HTML tutorials on the Web in 1994. Through his HTML Goodies web site, he has taught hundreds of thousands of people how to build great web sites.

Read an Excerpt

Excerpt from Chapter 1:

Judge Not Lest Ye Be Judged

...What Sites Should You Critique?

To begin with, critique sites that deal with topics you understand. Remember that design is dependent upon a lot of different factors-that's why templates don't work very well. They don't take into account what the site is trying to accomplish. Stick with sites that deal with topics you know and understand. At first you may only want to stick with sites that are dedicated to topics similar to the site you want to create.

The reason is so that you have some footing from which to make your judgments. When you critique, you state that this element is good and this element is not so good. If you don't really understand the topic of the site you're critiquing then your opinions can be easily brushed aside by those who do.

When you critique a Web site, you must first take the time to look at the entire site and get a feel for it. Ask yourself what the site is attempting to do. Get a general feel for the purpose of the site.

Once you understand what is going on, or at least what should be going on, get out of the site and clear your cache. It's time to critique.

The Steps

Why leave the site? Why clear the cache? Besides ...what's a cache?

A cache is a section of the hard drive where copies are kept of every page your browser displays. Have you ever noticed how the second time you enter a site it comes in very quickly? That's because the images and text are not actually being read from the Web, but are actually being read from your hard drive, from the cache.

If you clear the cache, you start fresh with no cached images.

Load time is very, very important to a Web site. By leaving the site and clearing your cache, you re-enter with the slate wiped clean and can then get a feel for the site as might a firsttime visitor.


In Internet Explorer, clear your cache by clicking Tools and choosing Internet Options. Click Delete files. You are asked if you want to delete all the files in your Temporary Internet Folder. Click OK. The hard drive will buzz a bit. You're done. If you haven't cleared your cache in a while, or ever, there may be a lot of files to delete so don't be alarmed if this takes a little while. Close the box. In Netscape Navigator, click Edit and choose Preferences. Click the little plus sign next to the header Advanced. It's along the left side of the box that opened. After you click the little plus sign a menu drops down, click the word Cache-it is the first element listed. Finally, click the Clear Memory Cache button. You're done. Close the box.

After each step of this critiquing process, you need to take the time to stop, look at what you've found, and ask yourself, "How can this help me?" or "How can I avoid doing this?"

That's the real purpose of these critiques. I am not asking you to help someone else's site. I want you to help yourself create a better site and avoid pitfalls before one of your users has to deal with them.

1. Time It

Look at a sweep second hand and log in at the top of the next minute. Stay with the homepage until it loads completely. You know it's done loading when it reads, "Document Done" down in the lower-left section of the browser's status bar.

Jot down the time. Did the site load quickly? If so, why? Was it a lack of images, or were the images small enough to load quickly?

How long was it until you could actually begin reading and navigating the site? Were you allowed to begin reading and clicking before all the images had come in? If so, jot that down. That's a positive comment. Remember: You're looking for positives as well as negatives.

Ask yourself, "How long would I have waited for this site to load before leaving the site?" If the site loaded fast enough for you then jot that down. If not, make a note of that, too.

Now, how can you use what you've found to make a better page for yourself? How can you avoid the pitfalls you ran into?

2. Display

How does the page look on your screen? Does it fit? If not, is it too big or too small? Do the elements on the page line up nicely or has your screen setting appeared to do bad things to the design?

Make a note of what you found and how you can use or avoid what you saw.

3. Try Another Browser

This is all too often overlooked when designing a Web site. The site looks great in Internet Explorer, but in Netscape Navigator, it's the pits.

Open the page in that other browser. Do all the elements display? If not, make a note of which do not and try to figure out why they don't display.

How can you use this information on your site?

4. Write Down the Concept

Write down what the site is trying to accomplish in one sentence. Then, ask yourself if that accomplishment is being met or if the site is falling short. If you cannot denote what the site is trying to do in one sentence then the site is not meeting its goals.

5. Offer Praise to the Site

At this point, you should be moving through the site and looking for general ideas and elements.

Because it is so easy to be negative, start with praise. Make a point of writing down at least one thing you feel the site is doing well. Ask yourself how you can possibly incorporate that into your own site.

6. Offer Concerns

Next, begin writing down the concerns you have about the site. Spell out the concerns as clearly as you can. Make a point of explaining why you have these concerns, not only that you have them. If you feel something is wrong, just don't say that it is a concern; tell why it is a concern.

Does the concern inhibit users on the page? Does it confuse users? Is it something that crashes the browser? Tell the concern and why it is a concern.

7. Offer a Suggestion

It is one thing to find fault, it is truly another to find fault and then offer a suggestion on how to better the page.

Do that. For every concern you find, offer a suggestion on how that negative can be turned into a positive.

8. Write an Overall Evaluation

When you have finished the critique, write a two-paragraph evaluation of the site. Give an overall grade to the site and discuss what should happen to make the site better.

There's no set number of sites that you should critique. Do as many as you feel comfortable doing. Do as many as you need to in order to get a better feel for your own work.

Speaking of your own work, once your site is up and running, you should make a point of critiquing your own site. Be honest. Be truthful. Be your own worst critic. It can only help you.

Maybe you could get someone else to critique your site. It's a process called beta testing.

Now, that I've gone over the format I suggest you follow when critiquing sites, I'd like to offer some critiques of my own. I follow the previously outlined format.

Each chapter in this book ends with the critique of three sites. Those who have read my critiques before have stated that it's the critiques that taught them the most about Web site design. I hope they help you, too.

Just remember, my critiques are only the beginning of the process. Once you understand what should be done, you need to make a point of critiquing some sites yourself. You'll build better Web sites because of it.

Web Page Versus Web Site

One More Thing... Don't you hate when a teacher or professor says that? You're sure he or she was done and then they say, "one more thing."

Here's a hint. That "one more thing" the teacher or professor discusses ...it will be on the test. I guarantee it. Before I get into my first critiques, here's "my one more thing." If there were to be a test, this would be on it.

You may have noticed that I am making a point of writing that you are designing a Web site rather than a Web page. I do that on purpose, because it's true. You are not designing individual Web pages; rather you are designing a Web site. It's very important that you keep that in mind throughout this process.

It's fairly easy to tell when a person has designed Web pages rather than a Web site. The resulting site usually looks like one of the following two examples.

The Great Homepage

The Great Homepage site is just as it states: The site is blessed with a fantastic homepage. The colors are well thought out, the images are placed nicely, the links are up high, and the look is warm and inviting. The problem comes when you start to venture into the site. Every link goes to a page that often pales in comparison to the homepage. Maybe the author has made a point of carrying the background color or an image across the pages, but for the most part, that's about all. The subpages are usually just text, or contain the dreaded "Coming Soon!" line. Worse yet, the page isn't there at all and the user is greeted by a nasty "Page Not Found" error.

The Great Homepage site also manifests itself when the author fails to rely on his or her subpages. This occurs when the author attempts to put the entire site on just that one homepage. The result is often a very long page with multiple sections requiring the visitor to scroll down from portion to portion. I find that homepages that fall into this trap often put the few links that they do have toward the bottom of the long page. That way the author believes they can force the user to scroll through the information. Once the links do arrive, they are usually the basics, a list of favorite links, a Guestbook, and a photo album. The subpages usually aren't very interesting because they aren't needed. The homepage has done it all. There really wasn't any need for the subpages.

Both of these problems arise when the author sets his or her sights on building a page rather than building a site. All the effort went into the homepage because, logically, that's the most important page. What little creative effort that was left over went to the subpages and they suffered.

I am as guilty of this as anyone else. My first Web site consisted of one page-the homepage. I had no subpages. Every link took the user right 9K site. It was just a page, but man, did that homepage look good.

Great page. Lousy site.

Many Pages-One Site

The second major problem that pops up when an author sets his or her sights on designing a page rather than a site is the concept of "Many Pages-One Site." This is simply the problem mentioned in "The Great Homepage" taken to the extreme. In this case, the author has built a homepage and multiple subpages, each a work of art in and of itself. The problem is that the homepage and the subpages have nothing whatsoever to do with one another.

For example, the homepage is blue with black text and yellow links. The first subpage has an orange background with blue links. The second subpage now has an image background ...

Read More

Customer Reviews

Average Review:

Write a Review

and post it to your social network


Most Helpful Customer Reviews

See all customer reviews >