Chapter 2. Planning Makes Web Design Easier

In This Chapter

  • Pinpointing your Web site goals

  • Understanding the benefits of developing a plan

  • Stepping through a project plan

  • Accommodating new ideas while sticking to your plan

  • Creating an organized, consistent design

If a potential partner approached you with a "great new business idea" guaranteed to make you money, you'd probably ask a lot of questions before you even considered writing a check to get things started. You'd probably also develop a business plan, or at least explore in detail how the new business would work, how much it would cost you, and how much money you could expect to make in return.

If you're considering creating a Web site, or redesigning the one you already have, I recommend taking the same cautious approach. After all, a good Web site is an extension of your business — and, in many cases, a new product, service, or storefront that deserves the same level of planning as any other serious business venture. Even if you're creating a site for a hobby, vacation photos, or pictures of your family, the principles covered in this chapter will help ensure that developing your site goes smoothly and the final result gains you all the approval and praise you deserve.

This chapter is designed to help you carefully consider the many aspects of planning a Web site before you start building. You'll also find a series of questions to help guide you through the early stages of the development process.

Tip

If you can complete the exercises in this chapter with a business partner or someone you trust to provide a reality check, I recommend it. You know what they say about decisions made in a vacuum: They generally suck. If you're reading this book, you're probably already convinced that you should create a Web site, and you may even have a pretty good idea about how you want to design it. Before you dive in, talk through the process with someone else who can provide a fresh perspective and help you consider aspects you may have overlooked. It's also a lot more fun to go through the exercises in this chapter and answer the questionnaires with a partner. Don't worry, though, if you're on your own (or you're determined to keep your project a secret until it's done). Consider me your virtual partner and let my questions and planning tips in this chapter serve as a guide to get you started.

Developing a Project Plan

As with most project plans, a good Web site plan is made up of a series of tasks, a budget, a timeline, and a list of the resources and materials you need. Taking the time to create a detailed project plan gives you a structure within which you can work with greater confidence, and a much better chance of meeting your original goals on time and on budget.

The following list provides a step-by-step approach to creating a project plan:

  1. Define the goals and objectives of your site.

  2. Create a content list.

  3. Create a task list.

  4. Set a timeline.

  5. Establish a budget.

  6. Assemble a team.

  7. Create a site design and navigation structure.

In the sections that follow, you find out the details involved in each of these steps (with the exception of Step 7). Creating your design and navigation is such a big step that it gets a section all its own later in this chapter, "Designing Your Web Site."

In the sections that follow, you find out the details involved in each of these steps.

Defining goals and objectives

The series of questions in this section are designed to help you assess how a Web site can best serve you, your business, or organization. Taking the time to answer each question should help you define the goals of your site and create a guide that you can use as you organize and prioritize the development.

Before you start sketching out the home page (also called the front page), define the most important aspects of a Web site to identify what you really need. Remember that you can always start small and develop a Web site over time. And there's no rush to get the site up as fast as possible — the Web isn't going anywhere, and the best uses of the Web are the ones that will be around for a long time.

Before you even start, make sure that you and your staff (or friends and family) are clear about why you're creating a Web site and what it will take. Spend a little time answering each of the following questions, and use your responses to shape the planning and implementation of your Web site. Creating an outstanding Web site takes effort, and that effort can take time away from other things that are important. The more you plan, the more you have time left over for a little fun and relaxation (at least once in a while).

  • Why is having a Web site important to you?

    Separate the pipe from the dream and get clear on your true motivation.

  • What are your objectives?

    Determine whether you will use your Web site to promote your business, sell products or services, cut costs, showcase clients, provide customer support, stay in touch with friends and family, or do something that no one else has ever done.

    Note

    As you go through the planning and development process, write down your top goals and refine them until you have two (at most, three) clear objectives for your site. Then keep your list somewhere that you're forced to look at your objectives regularly, like the edge of your computer monitor or the bathroom mirror. Whenever you have a question about any aspect of the design, content, or development of your site, refer to your list of goals and make sure that your decisions remain true to your objectives.

  • How will you measure success?

    You won't achieve success with your Web site project unless you can effectively measure its results, so be sure that you can voice your objectives in measurable ways. The more specific and quantifiable you can be, the better. For example, rather than just state, "The goal is reducing the telemarketing staff," assign an amount and a timeframe to make an objective quantifiable, such as, "The goal is reducing the telemarketing staff by 20 percent in six months." Doing so helps you make sure that you're taking the necessary steps to achieve that goal.

  • Whom do you want to visit your Web site?

    Consider your audience above all else. If you're creating a sales site for real estate investors, you should probably take a different design approach than if you're creating a game site for 12-year-olds. If you're not sure what 12-year-olds want on a Web site, round some up and ask them.

    Note

    Clarifying the target audience of your Web site should be a key factor in how you plan and develop your site, from the vocabulary you use to how public you make the information. For example, a site for doctors might include complex medical terms, whereas a site for patients needs more common language. Similarly, an architect might create a Web site with a public section where potential clients can view photos of completed projects and testimonials, and also create a password-protected section where current clients can view plans as they're being developed.

  • What do you want a user to gain from visiting your Web site?

    One of my favorite benefits of a Web site is instant information at 1 a.m. without having to talk to anybody or wait on hold. Take time to consider what you want your visitors to learn from your site, and then make sure that the information is front and center in your design and development plans.

  • What do you want users to do after or on visits to your Web site?

    The more specific you can be about what you want visitors to do on your site, the better. Do you want visitors to buy a product, hire you to perform a service, join an association, call and ask for an appointment, sign up for a newsletter, or just tell their friends and family how cool your Web site is? Whatever you desire, you want your site's design to encourage visitors to take that action and to make it as easy as possible for them to do so.

  • How does your idea for a Web site compare with others?

    Taking the time to research what other people have done with their Web sites before you get too far into developing yours is an important part of the planning process. An afternoon spent surfing the Web for related businesses, and even unrelated businesses that have similar features, can help you identify things you may want to include on your own site and help ensure you're not starting a Web site in a category that's already so competitive you'll need to really distinguish yourself to attract an audience.

  • Do you expect to make money on your Web site?

    If your answer is, "Of course I do!" that goal should shape everything you do as you design the way visitors will use your site. Pay special attention to the section "Establishing a budget," later in this chapter, to help ensure you see a return on your investment.

    Note

    Besides being potential cash generators, Web sites can help you be more competitive, advertise your store or services, schedule and inform staff, and reduce travel and other types of expenses. Web sites are a great way to introduce yourself to the world and help other people introduce you when they make a referral. Some of the most successful Web sites are designed to save money by reducing long distance phone charges and other customer support expenses.

Creating a content list

All the text, graphics, and multimedia that you want to display on the pages of your Web site are commonly referred to as the content of your site. To help guide your work and planning, your content list should include all the photos, graphics, biographies, product descriptions, maps, video files, and any other items that you might want to feature on your site.

The best way to start creating a content list is to brainstorm all the things you think you might want to include, such as contact information, product descriptions, logos, pictures of the staff, and biographies.

Even if you think you already know what you want on your site, you may be surprised when you start brainstorming by the ideas you come up with, such as gathering testimonials from happy customers. Creating a detailed content list is well worth the time because it will serve as a valuable tool that you can refer to as you develop your project plan, site map, and task list. As you continue to develop the project plan and ultimately the site, you'll probably discover more things that you want to add to the content list, so make sure to create it in a way that's easy to add to and edit as you progress.

Tip

A program like Microsoft Word (or, if you prefer, Excel) is an excellent tool for this task because you can easily make additions and move content around as you develop your list.

Use the content list as you create the site map (covered later in this chapter, in the section "Creating a site map"), and you're likely to think of additions to the content list as you work on that step. For example, as Pamela creates the About Us page for her Pet Services site, she might realize that she wants to add a picture of her own dogs and a map to her grooming salon.

Creating a task list

The task list — the heart of your project plan — is a list of tasks that must be accomplished to meet your goals and launch your Web site. Your task list should include everything from registering your domain name to promoting your site after it's launched.

You can create a task list in many ways, including a few software programs designed to help with project management. If you're creating a relatively simple Web site and you're working alone or on a very small team, you might not need much more than a list with a few notes and dates attached to each task. If you're working on a more complex project with a team, you might want to further define the task list by using a program like Microsoft Project, which includes a variety of features designed to make it easy to plan and track tasks.

When you create your task list, keep in mind that gathering your content is one of the most time-consuming aspects of any Web site project. Most people underestimate how much time they'll spend taking pictures (or finding the ones they already have); gathering digital versions of logos and other graphics; and writing all the text descriptions, biographies and other elements for their Web site. Creating a comprehensive content list at the beginning can serve as a great first step and an excellent guide to help you gauge how long it will take you to gather, create, and review all the contents of your site. Here are a few suggestions for breaking down the complex task of gathering the materials you'll need in your site:

  • Gather existing content. You might already have much of the content you need in brochures, press releases, or other materials related to your company or organization. Start with the easy stuff; it will give you a sense of accomplishment right away and help you determine how much more you'll need to do.

  • Digitize your text. If you're including existing content in your site, you might still have to do some work to get it all in digital format, where text is converted into a word processing or other text file. For example, you may have to retype text files to be able to use them on your Web site. If you have a lot of text, consider scanning the documents and using Optical Character Recognition (OCR) software to transform the scanned text into editable text.

  • Digitize images. If you already have photos, a logo, or other graphics you want to use, those images might have to be scanned. Even if you already have digital photos, before you can add them to a Web page, they must be in the correct format and optimized, a process that helps them to be downloaded as quickly as possible over the Internet. (You can find step-by-step instructions for preparing and optimizing images for the Web in Chapter 5.)

  • Create new content for your site. You might want to create a photo tour of your shop (to feature on the home page) or write or update biographies of key personnel.

Tip

If you hired a graphic designer to create your logo or brochure, you may want to go back to that person to ask for digital copies of the text and graphics, but don't expect to get it overnight. Plan ahead and request any materials you may need from other people early in the process so you'll be less likely to have to delay launching your site because you're still waiting for them.

Setting a timeline

With your task list ironed out, you're ready to create a timeline. Several popular task-management programs can help. Microsoft Project can help you define a task, specify how long it should take, and then associate it with other tasks on a timeline. If you don't want to spend the money on Microsoft Project or take the time to learn this somewhat complex program, you can create a simple project plan in any calendar program or even in a spreadsheet or word processing program. It's even okay to use the old-fashioned approach of writing your tasks on a printed calendar page. (I rather like having them up on the wall in my office for easy reference.)

Note

Your main goal is to create a timeline that can be adjusted if someone misses a deadline or if a project takes more (or less) time than expected.

Be sure to give yourself a realistic timeframe to do a good job, and factor in a little more time than you think you need, especially if you're new to Web design. Setting and enforcing deadlines can help you stick to your timeline: Even if you're working on a Web site by yourself, or with a very small team, setting deadlines can be one of the most important parts of your project plan — and your best chance of finishing. Most good Web sites are never-ending projects because you can always add more content and develop them further although you shouldn't let that keep you from getting your site launched. Set a deadline for at least the first phase of development, and then hold yourself to it.

Tip

Tying a deadline to a special event or occasion, even if you're creating a personal site, can help make you stick to the date. For example, set a launch date for a family Web site on an occasion like your grandma's birthday so that you can make it a surprise for her. Or, plan to publish the redesign for your small business site in time for a trade show or annual sales event. When a deadline has a specific date and a clear goal associated with it, it's easier to take the deadlines seriously.

Establishing a budget

"How much does a Web site cost?" is often the first question asked by someone who decides that they want a Web site. But, if you think about it, it's a little like asking how much it costs to build a house: "It depends." The answer depends on how many rooms you want, whether you want a marble or cement staircase, and whether you want a swimming pool in the backyard. You may have no idea how much it costs to build a home. After all, different contractors provide different price quotes based on how experienced they are or the kinds of materials they plan to use. If you're planning to build the house yourself, it becomes your job to figure out whether the features you want are reasonable and affordable.

Fortunately, most Web sites (at least the kind you're likely to build yourself with the templates and instructions provided in this book) don't cost nearly as much as a house (or even a dog house). Before you can set a realistic budget, though, you need to break down the project into pieces (by following the steps outlined earlier in this chapter) and then start adding prices to the task list in your project plan. Determining the cost of each element of a Web project helps you manage the cost and scope and estimate the overall costs. Among the key costs you can expect are the ones in this list:

  • Web hosting: This service can cost as little as a few dollars per month or as much as a couple of hundred dollars (if you plan to include high-definition video files, which require more space on a server and more bandwidth to download). E-commerce features can also add to the cost of monthly hosting. (You find suggestions for choosing the best hosting service for your site in Chapter 3.)

  • Domain names: A domain name costs between $8 to $20 per year, depending on the registration service you use and any special features you request, such as private registration, which is a lot like having an unlisted phone number. You can even register more than one domain name for the same site, but only if the name hasn't already been registered by someone else. (You find tips about, check the availability of domains, and register your own domain names in Chapter 3.)

  • Software programs: The tools used to create a Web site can range from free to expensive. At the very least, consider getting an image editing program like Adobe Photoshop ($650) or Photoshop Elements ($99; a fine alternative if you're not a professional graphic designer). For Web design, I find that Adobe Dreamweaver ($399) is well worth the price. However, Microsoft Expression Web is also a great Web design program, and Microsoft lowered the price of its most recent version to just $149. You can use any of these programs with the templates and lessons in this book. You find a more detailed comparison of the options to help you find what's best for your site in Chapter 1.

  • Your time: If you're building a site yourself, one of your biggest costs is likely to be the time you spend working on it. Don't underestimate the value of your own time if you run your own business. It may be well worth hiring a student or an assistant to help with time-consuming tasks, such as adding text and images to all the pages of your site, or scanning lots of photos and graphics.

  • Consulting services: Another major cost for do-it-yourselfers is any consulting service you use to augment your own skills. For example, you might hire a graphic designer to create a logo; an editor to review text; or a programmer to create complex, interactive features, like a password-protected section where you keep clients informed as you work on their private projects.

  • Shopping cart and e-commerce transaction features: If you want a shopping system, compare the costs of a few and then include a rough estimate until you make a final decision. (You find recommended services in Chapter 15.)

  • Traffic reporting services: Most Web hosting companies provide basic traffic statistics about visitors to your Web site, but you will almost always get more detailed reports if you use a dedicated traffic service, such as Google Analytics, covered in Chapter 10.

Note

As you put together your budget, start with the clear-cut costs, like paying for a domain name and hosting, and then move on to other items specific to your needs and include your best estimate. After you have a price quote for each element and begin putting the pieces together, you can distinguish the more expensive features and better decide which ones you can afford now and which ones you may want to add later.

Assembling a team

Don't go it alone! The best Web sites are developed by a team of people with a variety of skills, including writers, designers, programmers, and multimedia producers. If you're developing a relatively small, simple Web site, you might not need a lot of people with specialized skills on your team, but the more you can divide the work among experts, the better. Although the instructions and templates included with this book are designed to help you do it yourself, you occasionally still have to seek out specialists — like a good editor to ensure that your text is well written, or a programmer who can create advanced features, like password-protected sections of a Web site.

Throughout this book, I've worked hard to give you the best and easiest ways to create a Web site on your own, but I would be remiss not to point out that hiring a specialist or two once in a while can be a helpful way to complement the work you do yourself. Don't be afraid to ask for help if you need it.

Designing Your Web Site

No matter how technically sophisticated a Web site is or how creative its writing, most people notice a site's design first. If you want to make the most impact with your Web site, make sure that you leave plenty of time or reserve funds in the budget to develop (or buy) professional-looking graphics.

The best design is one that suits your audience — and that may or may not mean lots of fancy graphics and animations. To pinpoint the right design for your site, follow these guidelines:

  • Before you develop the design, think about whom you want to attract to your Web site. A gaming Web site geared toward teenagers should look much different from a Web site with gardening tips or an online banking site for adults.

  • Review other sites designed for your target market. A good way to determine what might work best for your audience is to study similar sites, taking note of how they use images, set up navigational links, and organize information. You don't want your site to look exactly like your competition because you want your site to stand out (and you shouldn't just copy someone else's design), but you can certainly gain useful ideas from reviewing other people's sites.

  • Consider the limitations of mobile devices. Increasingly, people are visiting Web sites from cellphones, looking for things like a new restaurant for lunch while they're running errands or the address of a business they want to visit while they're driving there. Mobile devices are a great way to find what you need, when you need it, but only if the Web site you're trying to visit is designed to work on a mobile phone. As you create the design for your site, keep in mind the limitations of small screen sizes and how much harder it can be to click links without a mouse. Today, you have two options if you care about visitors using mobile phones. Keep things relatively simple so they work on most devices or create a second, simplified version of your sites specifically for the mobile phone. To learn more about designing Web sites for cellphones and other mobile devices, read my upcoming book Mobile Web Design For Dummies (Wiley).

  • Keep in mind how your design decisions might affect download times. Consider your audience's time constraints, attention span, and (most importantly) goals. If you design your site to provide information to busy businesspeople, you want fast-loading pages with limited graphics, video, or other multimedia. If you design your site for entertainment, your audience is likely to wait a little longer for videos and other interactive features.

Creating a consistent design

Most Web sites work best, and are easiest to navigate, when they follow a consistent design. Here's a case in point: Most readers take for granted that books don't change their design from page to page and that newspapers don't change headline fonts and logos from day to day. Consistency is one of the primary tools used in books and newspapers to help readers easily distinguish different elements and follow a story or theme.

As you lay out your Web page, keep related items close to one another and be consistent about how you design similar content elements. Viewers should instantly understand which pieces of information are related to each other.

Here are a few good ways to distinguish different kinds of information:

  • Design: To ensure a consistent style, define a set of colors, shapes, or other elements that you use throughout the site and then stick to them. Choose two or three fonts for your Web site and use them consistently. For example, a common practice is to use the Arial font for headlines and Times for the text in paragraphs. Then you might use a special font for a logo or for advertising so that it stands out on the page. Using too many fonts makes anything harder to read and confusing.

    Tip

    You can easily get dazzled by all the special effects you can add to a Web page. Don't fall into the trap of using fancy features just because you can. ("Look, Ma — I made the text on my Web page blink in neon pink!") Keep in mind that the most important thing is to make your photos and Web pages look good and download quickly on the Internet. A clean, classic design will almost always look more professional than a busy design loaded with blinking or animated images.

  • Location: The position of elements on a page can strongly affect the amount of attention they receive. Many Internet studies have shown that text and images toward the top of the page get the most attention, which is why putting your most content toward the top of the page is best. Some things are commonly placed at the bottom of Web pages, including copyright information and links to legal notices, such as privacy information or terms and conditions.

  • Prominence: Give elements of similar importance the same weight on a page, and change the prominence based on priority. If all your headlines are the same size, it's hard to tell what's most important, which is why most news sites and print publications use larger text for the biggest news stories and smaller and smaller headlines for less important news.

Tip

Here's the exception to the rule. Strive for consistency in your designs except when you're trying to be unpredictable. A little surprise here and there can keep your Web site lively. A touch of red or a special icon can bring attention to a special section or newly updated information.

Mapping the structure: Organization, navigation, and links

Helping visitors find their way around your site is a critical part of your site's design. As you start planning the organization of your home page and the main sections of your site, consider these questions:

  • When visitors arrive at your home page, how will they find what's most important to them?

  • How can you divide the information in your site into sections?

  • How will visitors move from one section of the site to another?

  • How will you encourage visitors to find the information that you most want them to find or to take the action you want them to take (such as buying a product or ordering your services)?

A good way to help answer these questions is to imagine that you're a typical user of your site. For example, you might say, "If I were a busy attorney who came to my site looking for a new couch for my living room, what would make it easy for me to find the color and style I want in my office?" Or, "If I had a shaggy dog that needed a haircut every week, how could I easily find the scheduling and pricing information for the grooming salon?"

As you plan what appears on the first page of your site, draw on your answers to these questions, and revisit the exercise throughout the design process to make sure that your most important visitors can easily find what they need. In fact, here's a great practice professional designers use: Create a few profiles of typical users and then return to these profiles as you design the site.

Designing the home page and main sections

One of the biggest mistakes in Web design is cramming your home page so full of information that it's hard to find anything. Studies show it's better to guide people through a series of simple choices with two to five options each, than to overwhelm them with all options at once.

Tip

As you consider what information you want to appear on the home page and how to organize the information in your site into subsections, think about guiding your most important visitors through a series of choices. For example, Pamela's Pet Services site might include a few general service categories on the home page, such as grooming, boarding, and walking, and then link to subsections that offer more specific information, organized by the kind of pet or grooming service.

As you plan your initial site structure, think also about where you're likely to add content down the road. Be sure to include these considerations in the planning process by asking questions, such as these:

  • For a site that sells products: What will you do when you have more products to add? Where will you put new lines of products? How will you locate new product information pages or more detailed descriptions? How will you handle price changes or inventory fluctuations?

  • For an online magazine: How will you handle breaking news? Where will you add new stories on a regular basis? How will you archive old stories? How will you connect related stories over time?

  • For a service site, like my fictional Pamela's Pet Service: Where will you add new services? How will you add new photos of pets? Where will you include seasonal specials or discounts?

Note

Whatever you do, never let users "get stuck" on a page because the link is broken or labeled Under Construction. Good Web sites are always under construction. Let visitors know that new treats are coming by putting notices on pages that already have content. You find more about creating links in Chapter 6 and tips about finding and fixing broken links in Chapter 10.

Setting up navigation links

After you determine how you're going to organize your information into sections on your site, you've done most of the work needed to create the navigational structure of your site. Creating a menu bar — or navigation bar — that includes links to each main section of your site is one of the most important ways you can make your site easy to navigate. Adding that same navigation bar to every page on your site makes it easy to access all of the main sections from anywhere within the site.

Here's an example of a navigation bar you might create with a row of links to the main sections of a small business site:

Home Page ~ About Us ~ Products ~ Services ~ Contact Info

Note

A good Web site is designed so that users can easily access key information from more than one place in the site and can also move back and forth between the main sections.

As you plan the navigation of your site, make sure that visitors can

  • Follow different paths to the same important information. Providing more than one link to the same page can seem repetitive but makes it easier for visitors to find their way around your site. For example, if you have a family history section, you might link to that page from pages throughout your site, such as the page about your daughter's wedding as well as the page about your grandparents.

  • Move back and forth between pages and sections. Links that help users move forward and backward through a series of related pages can be especially useful in a slide show or an image gallery.

  • Search your site. If your Web site is packed with content, users are likely to appreciate the ability to search through your pages. One simple solution is the Google Search tools, which you use for free by signing up at Google.com and copying a little bit of code from their site to yours. (You find instructions for adding Google AdSense to your pages, which works much like Google Search, in Chapter 14.)

Tip

Follow the three-clicks rule, which states that no important piece of information should ever be more than three clicks away from anywhere else on your Web site. And the most important information — such as contact information — should never be more than one click away.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset