Building a Successful Web Site

Tuesday, February 7, 2006 | Tagged as information architecture, navigation, wireframes

Last week I was working with a client who was adventurous, progressive, and well known within their community, but the one thing that lacked was their Internet presence and they knew it. So I was asked to guide them through the process of developing a new Web site. Typically I would arrive at the client’s office and after exchanging greetings dive right into an open dialog in conversational tone about the goals, the targets, and the direction for their Web site. These meetings can last for hours and even days depending upon the size of the organization. The conversations are very candid.  It’s usually a rather enjoyable process with everyone leaving energized because there is a clear sense of direction for the Web site. However, this meeting was very different. I walked into a boardroom style layout with the client on one side of the table and myself on the other. I sensed that something was very different but I continued to introduce myself to everyone. Then it hit me, most of the individuals in the room had no desire to be there and it set the tone for the entire meeting.

The goal for this meeting was to help this organization develop a successful Internet presence, and so I started with some general questions:

  • What are the goals of the Web site?
  • Who are you targeting with the Web site?
  • What are going to be the primary tasks in the Web site?
  • How will you know that your presence on the Internet is successful?

These seemingly simple questions were intended to be thought-provoking yet here were their responses:

  • Our goal is to be on the Internet.
  • We are targeting everyone, including little kids to senior citizens, rich and poor.
  • Our primary task for having the Web site is that we want everyone, our targets, to read the entire Web site and learn more about our offerings.
  • Our Internet presence will be successful when everyone within our targets visits our Web site.

Each time I tried to dig into their responses to understand if there was something deeper, I hit a brick wall and continued to get the same comment:

“You don’t understand. We are trying to reach everyone - every social economical class, race, and age group. Our target demographic on the Web is everyone - isn’t that what the Web is for?“

Here is an organization that is highly successful in the brick and mortar world but has struggled to stay alive in the wired world. I walked out of this meeting with a huge, sinking feeling sensing that this project could bomb.

So it got me thinking, “Do business and organizations really understand what it takes to develop a successful Web site?“ A resounding, “NO!“ rang in my head as I continued to think about the days events. In the Internet world I often hear Web and graphic designers complain how clients do not understand the process, or what goes into developing a successful Internet presence. Most organizations are asking, “How can that Web site cost so much money and take so much time? Why can you just apply the graphics and the text and be done?“

It is with this thought in mind that I sat down and began writing this multi-part article on how to develop a successful Web site.

Developing a good Web site takes accurate planning & preparation

I often compare the process of developing a success Web site to the process of building a house. Depending on what your home life is like, your activity level, and how you like to relax, your architect will interview you about your layout, style and personality to develop a blueprint that will fit your needs. You will then have an opportunity to see your needs and vision reflected on paper.

When reviewing the blueprints, you may see a wall that you want adjusted or a window you want moved, so you communicate these changes to the architect who in turn makes the modifications. This process may repeat itself many times before you see the home of your dreams take shape.

Then you hire a contractor to start the building the house. Throughout the process you’re responsible for picking out every detail down to where you want the electrical outlets and the type of light fixtures you want throughout the house. You will have several opportunities to walk through the house to inspect the progress during the building phase. This gives you a chance to identify issues the builders may have overlooked before they are too late to fix. It may be several months or even years before your dream house is built and you are ready to move in. It’s a process but it pays to build it right!

The process for building a Web site is similar in that it involves time, accurate planning, and attention to detail.

It is understood that by time you get to the point of building your Web site, you have already identified your budget, the purpose of the site, the individual(s) who will develop the content, and tools you will used to maintain the Web site. Now you are ready to start building your Web site:

Building the Blueprint

Much like you come to the architect prepared with your ideas, examples and sketches, you need to come prepared to meet with your Web Site Architect so together you can develop your Web site. Along with your Site Architect you will identify goals, targets, and tasks for your site.

Here are some important questions you should answer in preparation for your meeting with the Site Architect:

  • What is the purpose of your Web site? (i.e., Information, E-commerce, etc.)
  • What are the goals for your Web site?
  • Who are the target markets for the Web site and why?
  • What will the target audience be doing on your site?
  • How will you identify that your presence on the Internet is meeting its goals?
  • What are the likes and dislikes of your current Web site and why?
  • What are other Web sites that you like and dislike, why?
  • What logos, images, and colors would you include in your site?

The answers to these questions will be used throughout the various stages of your site’s development.

Navigational Structure - Part 1 of the Blueprint

Your Site Architect will review all of your answers and your current Web site, and begin working on a functional navigational structure. Because a navigational structure is key to moving your visitors through your site effortlessly, it can make or break your Web site. If visitors to your site cannot find what they are looking for they will leave to shop with the competition. So it is important to ask questions about the navigational structure since you know your organization and clients better than the Site Architect.

Here are just a few questions that will get the process started:

Identify hypothetical situation:

  • How will visitor “A” go about the process of finding product XYZ?
  • Walk me through the process of paying for this seminar.

Identify missing elements:

  • I don’t see how someone would contact our support department. Where does that fit into the navigation?
  • When a visitor is on the internal pages of our Web site, how do they get back to the Home page?

Identify awkward processes:

  • This process of find the support for product XYZ seems complicated. What can we do to make this process more efficient?
  • Ordering the Blue Widget Service is the common task for our users. Can we simplify the process so our clients can start the task in one click?

Identify future growth:

  • We expect that next year we will launch a new product line. How does fit into our current navigational structure?
  • We are thinking about starting offering a new service to our clients. Where would be put this service in our current navigational structure?

It is possible to have different types of navigational structures on your site. You may have what is called a persistent navigation - a navigation that appears across the top of every page on your site. You may also have a content specific navigation down the left column that shows only when you are viewing the products section of the Web site.

You may have several changes back and forth between you and the Site Architect before you reach a place you feel comfortable and give your stamp of approval.

Wire Frames - Part 2 of the Blueprint

Once you have finalized your navigation, the Site Architect will move on to development of your site’s wire frame. A wire frame is a mockup of the Web site that only addresses the layout of the functional areas and not aesthetics. Think of the wire frame as the skeleton of the site and the graphical design as the skin.

The diagram of a wire frame represents two main issues: priority and content.

  1. Wire frames allows an organization to define what functional areas are priority within a design, meaning what elements must exist on a page and which elements are options.
  2. Wire frames allow an organization to define content layout and how a visitor to the Web site may expect to see and interact with the content.

The wire frame provides you an opportunity to start visualizing the site without the application of graphics. This is also very beneficial to the graphical designer because now they have an understanding of how the site should work together.

The most important aspect of the wire frame is the ability for the organization to define where elements reside on the page. For example if you want to highlight the product of the week, where does that belong? If you have news, where would a user find this information?

Again this is very similar to building a blueprint for your dream house but think of this as your dream Web site. You have every opportunity to go back and for with the Site Architect to make sure elements are properly positioned. Once you have approved this process then it is on to building the Web site.

Commenting is not available in this weblog entry.