This Site, From Scratch

by Daniel Will-Harris

This site came to life over crab cakes. Honestly. Previously it had lived only in my brain, which was fine if I was the only one who wanted to see it, but not easily accessible through anyone else's Web browser.

• Intro: Looking deeper.
• What's your point: You'd better have one if you expect your site to work.
• Ideation: Think of as many ideas as you can—there are no bad ideas at this point.
• Review: coping with, and getting out the most out of feedback.
• First impressions: Letting your goals be your guide.
• Compromise: Not necessarily a bad thing.
• Content: organizing what you need.
• Part II: Design.

It's easy to forget how much work goes into a Web site (or anything for that matter). You look at it, it looks slick and professional, and you just go about your business. That's the way it should be, but when you start to build your own sites, you have to "stop and smell the pixels," start to look at a site in a different, deeper way.

To help you see the process that goes on behind a site (specifically this one), I kept a record of how this site started and the various stages it went through in organization, content, and design to get to what you see today.

For an introduction on what to think about before you build, or rebuild, your site, click here.

What's your point?

Every good site needs to have a clearly defined goal or mission.

Mine was to help people create better Web sites. I've written best-selling books about computers, design, and communication in the past, so I thought about writing this as a book, but I've always believed that if you're writing about technology, you have to use that technology. My first book about DTP was produced entirely on a PC at a time when books just weren't produced that way. But it proved it could be done, and I learned so much in the process I was able to give my readers more information than other books that weren't done this way.

So I decided that something about producing Web sites should be, well, a Web site. I mentioned this at lunch to a person from NetObjects over, among other things, crab cakes (I love crab cakes, but admit to feeling guilty about eating them because I think crabs are cute). I was at this lunch because I personally used Fusion and found it to be the most efficient and flexible way to create the web sites I was professionally designing and producing. Over lunch I was telling them everything I thought they were doing, right and wrong, and explaining what I wanted to do with this web site.

This person from NetObjects, being a very smart person, agreed that it was a good idea, that people needed an easy-to-read, plain-English, all-in-one-place resource for Web-site building information. He also felt that NetObjects should provide this as a service to its customers (and potential customers).

I agreed because I thought it was a resource the Web was lacking and because I personally used Fusion and thought it was the best Web site creation program on the market. I had discovered it right before it was released, when I was writing reviews at c|net. I wrote one of the first reviews of the product, and despite having reviewed virtually every other competing product, I continued to think it was the best on the market. I still do. (I have used it extensively to create Web sites for myself and my design clients. You can see some of my work on my personal site.)

OK, so we had a concept (an easy-to-read site to help people build better Web sites). A short and sweet mission statement like that is the first step in any successful site. (For more information about what to consider before building a site, click here. For some "Web Sense" for developing a good site, click here .)

The next step was to translate this into something real.

Ideation

I went home and thought about the project. I decided that since Fusion had been my inspiration, I'd base the site design on Fusion's design. I "ideated" (thought of all the ideas I could and wrote them down, using Word's outlining feature). At this stage of the game you don't want to edit yourself or think, "Well, maybe that's not the best idea," you just want all of the ideas you can think of. No one else has to see them—but you never know what might inspire you later.

In less than a day, I had a mock-up for a site that looked on the Web just like Fusion looks when you run it. I posted it in a directory on my own site (one that had no links to it so my Web site visitors wouldn't stumble onto it) and invited Mr. NetObjects to take a look.

Above is the home page. Below is an inside section page:

These early stages of site building can be exciting because you can quickly see your ideas turn into reality. But it's also important not to fall in love with the first thing you do. It is just the first thing, and you need to get feedback from people and do as much thinking as you can.

Review

It's easier to make changes at this stage than it will be later, and if you choose the wrong direction now it can be difficult to make an about-face later on. So show the site to as many people as you can (those you respect and those you fear or at least those who can cause you trouble later on).

If you ask people's opinions, you'll get them, and get a lot of them. But you can't use all of them. How do you decide which are constructive and which are just critical? This is an important distinction to make because if you try to please everyone you can end up with something so watered down that it's completely ineffective. Also, while everyone you work with should be aiming for the same goal, we all know the realities of life—and office politics—mean that some of the advice you get may not be in your, or your site's, best interest.

I have three rules about criticism:

• Criticism must be specific to be effective. General overall criticism is usually too vague to do anything positive.
• Criticism must have perspective or it's meaningless. Criticism that doesn't come from the perspective of the target audience (or with the company's goals firmly in mind) is not helpful.
• Criticism from a group is not always right. Most Web sites have two target audiences—the actual visitor to the site, without whom there's no reason to have a site, and the group or company producing the site (and that group wants certain results). But group dynamics are strange things—people don't usually look at Web sites as a group; they do so as individuals. But groups often critique sites, so you need to take their words with a grain (or a pound) of salt.

One of the rules I try to work with is, "If one person tells you something, think about it. If two people tell you the same thing, consider it. If three people tell you the same thing, do it." Quite honestly, I don't always do something even if three people tell me the same thing—sometimes my own vision (and experience) tell me I have to stick to my guns. And if you believe in something strongly and can convince others to do it your way, then that's fine.

But another way to tell constructive from destructive criticism is to see if the person is offering any ideas. That doesn't mean, "I think this would look better in green than in blue"; that's an opinion. A constructive idea would be something like this: "I was confused by the title of this section. I thought it was implying one thing, but when I got to the section, it was offering another. Perhaps you could retitle the section architecture instead of blueprints."

Specifics are vital to constructive criticism. Without them, all you have is "I don't like this or that," and you have nothing to build from. You can only make changes to personally please one person, and unless that person is your sole target audience, this can be a waste of time.

Don't let your goals get lost in a sea of personal opinions.

You don't design a refrigerator to act like a toaster just because someone tells you that they don't like the fact that when they open the door it makes them cold :)

So next came a number of meetings with people inside and outside of NetObjects. One thing that emerged as a consensus was that the first priority of the site was to educate people about building better sites, and that we didn't want people to think that just because NetObjects was behind it, it was really just a big infomercial for Fusion. People could see the site as a demonstration of Fusion in action. We could tell people how Fusion did the tasks we were covering in the articles, and that might lead people to look at Fusion, and that was enough.

I'd always felt this way, so it was easy for me to agree, but it did pose a problem. My initial site design was all about Fusion. Now it was clear that this design was not appropriate.

I have to admit it was difficult to give it up, because I really liked the way it looked! But I knew it wasn't right for the goal of the site, so I started to think again.

First Impressions

So it was back to a blank screen—where do you start?

Your goals will be your guide.

OK, so my goals were to educate, but in a non-technical and friendly way. So that gave me some idea of what I wanted to convey. Instead of starting with the look, I started with the content.

I'd been using Word's outlining feature (which is great, by the way, and you should try it—the easiest way is to use the formatting toolbar. Choose View/Toolbars and make sure there's a check mark next to the formatting toolbar and then select a Heading style from the style drop-down box, the first box on the left). The style feature makes it easy for you to create lists of items, organize them simply by dragging them around, and then start filling in more information as you think about it. For more information about outlining with your word processor, click here.

The structure of a site is vital; it's the backbone of a site—the site literally grows from its structure, and site visitors use the structure to help them envision the site and its layout.

Because site building is a process, I experimented with sections that were really steps, presented in a clear, logical, numbered sequence.

Working this way, I created six sections: Start Here, Plan, Present, Produce, Publish, and Promote. I liked them all beginning with the letter "P," but others told me they didn't know what "present" meant (it was for "design").

For navigation, it's more important to be clear than clever, so Present became Design and Produce became Build. As the outline grew, it became clear that Promote really should be part of Publish. Having one less section created five sections, which I liked because I believe people think in fives, since that's the number of fingers and toes most people have on each hand or foot.

Compromise

A lot of people think compromise is a bad thing.

The difference between making compromises and compromising is more than just semantics.

Making compromises means taking other people's needs into consideration. Compromising means giving up your vision. You can make compromises without compromising—and that's what you have to try to do.

If you're the only one planning, creating, designing, and building your Web site, then you probably think you can do exactly what you want. But in reality, you know other people are involved—even if no one else is involved with creating the site, your site visitors have to find it interesting. Otherwise, it's just an exercise in self-satisfaction, and you want to be master of your own domain, right?

Ben Franklin said compromise was the basis for democracy (or something like that—I'm sure someone will e-mail me and tell me the exact quote!). And, in part, it's the basis for successful Web sites, too.

• First thing to remember: You can't please everybody all of the time. You simply can't, and if you try, you'll just go nuts and end up creating a watered-down, "too many cooks" mess of a site that ends up pleasing no one.
• Second thing to remember: The longer you work on a site, the harder it can become to remember exactly what your initial goals were. That's why writing some kind of mission statement is so important. You will hear a million different comments from countless people with different agendas. You don't want to forget the real purpose of the site in the process.
• Finally: Be true to your vision. This is not always easy; in fact, it can be downright painful. But if you are sure of what you are doing, then you have to stick to your guns and fight for what you believe.

Content

Once I had a structure for the site, I started to fill in the outline with article ideas.

I went through each aspect of the Web creation process—and tried to remember everything I had to learn when I started—and there's a lot to learn. I wrote down everything I could think of—and asked other people what they wanted to learn more about or what they thought was vital to learn or had a hard time learning themselves. This took quite a while, and the file grew and grew with many more ideas than I could use for the first issue—but these ideas will come in handy later.

If you aren't sure what to include, talk to the people who will be visiting your site. Ask them what kind of information they're looking for: what they think they need to know and what they want to know. Of course, people can't tell you what they don't know if they don't even know they don't know it—so you sometimes have to read between the lines and figure out this tricky part yourself.

You should also look at other sites that have content similar to yours and see what they include. Don't copy them, instead learn from them.

Next, I went through the list and pulled out the most basic and important topics—these were articles I needed to have for the first issue. I created what's called a "runsheet," which lists the priority, title, author, and status of each article (or graphic) on your site.

This lets you see, simply and clearly, what you need and what you have, who's responsible for it, and how far along they are.

You need this runsheet (or something like it) to help you keep track of all this stuff, or you'll go nuts (or you'll run around stuffing nuts in your cheek and telling your friends and co-workers, "Look at me, I'm a squirrel!" to which they'll reply, "How lovely for you" while calling for someone to take you away).

By this time, you may be asking yourself why you ever wanted to create a Web site to begin with. It sounds like an awful lot of work. Well, it can be, but it doesn't have to be. It does require a lot of thought, and if that scares you, then find someone to help you (people love to help if you just ask).

Creating a Web site can and should be an interesting (if not downright fun) experience. NetObjects Fusion makes it a lot easier (I'm not just saying that; it's true). But even with great software, you still need to do a lot of thinking, or at least you should. The Web site you create can bring you a lot of joy (not to mention business), so it's worth it.

If you have questions or comments, please feel free to write.

Click here to read Part II: Design and Impressions

About the author

Daniel Will-Harris is a designer and author whose design and writing work can be found at his Web site. His site features TypoFile Magazine and EsperFonto, the Web's only typeface selection system. He may be reached via e-mail at daniel@will-harris.com. He is the editor of eFuse.com.

Juggler by Russel Thurston at www.artville.com