> articles > Website Design Decisions

You may be on your first website. But more likely you're faced with redesigning a website that isn't functioning as well as it should. I see 12 vital decisions involved with developing a website, and I want to explain them with you in mind:

You're the owner or marketing director of a small business and know that getting your website to pull its share of the load is vital for success. But your budget is severely limited!

You've just been assigned the task of redoing your company's website. Congratulations, now you can be blamed if things don't work well. :-)

You've volunteered to take on your church or organization website and make some sense out of it -- without offending the person who built it in the first place.

This time around you've decided to outsource the job, but you have no idea of how to supervise a design company to make sure it does what you need. Good luck!

There are twelve critical places in building a website where you must make the right decision, or you'll have to repeat this task again and again until you get it right. I won't be talking about how to write html; I want to help you with the mindset, the basic approach. I want to take you by the hand and lead you through the critical decisions. The better you grasp these essential points, the better your website will work and the happier camper you'll be.

Okay, let's roll up our sleeves and get started. By the way, why don't you print out this document and then mark it up with your thoughts and ideas as you read. It's designed to serve as a worksheet to clarify your thinking and provide direction at various stages of the project. If you decide to outsource the project, you'll want to share a copy of your marked-up copy of this document with your website designer. Print it out!

1. Determine Your Website's Chief Purpose

When you begin a website, you must have your main purpose clearly in mind. I say this because it's easy to have conflicting purposes.

If you're a website design firm, you may want to show off your high tech goodies with your client's site as the showpiece.
If you're an employee stuck with this task, you may want to look good for your bosses and not do anything for which you can be blamed -- you've got to protect your backside.
If you're a volunteer, you may just want an excuse to tinker and be praised for it.
If you're a business owner, you probably care about the bottom line. You're wondering, How much this will cost? and Will it be worth it in the long run?

Dear friends, recognize your own needs -- they're legitimate. But to build an effective website, you've got to look at the business's or organization's needs and make those primary. From the organization's perspective, what must this website do in order to be successful?

Let's look at some common website purposes. Put an X next to all that apply.

Build your brand. Create an online brochure that will help potential clients, customers, and partners learn about your company and look at it in a favorable light. You're trying to enhance your brand or organization image. I've heard people disparage this kind of website as "brochure-ware." But this is very legitimate for some kinds of companies, especially local businesses or organizations that aren't trying to conduct national or international commerce. You want people to know who you are, what you do, where to find you, and how to contact you.

Provide product information to drive local sales of your products and services at dealer locations. Auto sites are a good example. Many manufacturers don't sell on their sites, but point people to retailers who carry their products.

Sell advertising. A few sites are designed to sell advertising -- Yahoo!, Google, and other portal sites are examples. But these days, there's far too much advertising space and not nearly enough money to fill it all. Internet advertising is improving, but is still under-priced. You may be able to sell a little advertising if you're a portal site for an industry, or perhaps put some Google AdSense ads on your site. But these aren't big money-makers. Look at advertising sales as a hopeful bonus, not as a sure thing.

Sell products or services directly over the Internet. You want to conduct e-commerce and sell to a national or international market. You'll have some kind of ordering system for one or more products, or perhaps an extensive online catalog. You may offer an online service that can be delivered over the Internet or that can be initiated online.

Earn affiliate commissions for sales and leads generated through links on your website. Savvy marketers are building microsites designed to generate search engine traffic for a particular hot product or service. When a visitor clicks on one of their links, he is referred to an e-commerce site, and, if a sale results, the affiliate gets a commission. Perhaps a form on your site generates leads or subscriptions for another company.

Provide customer service and support. Websites are a great place for troubleshooting guides, FAQs (Frequently Asked Questions), technical information, etc. You can generate Return Merchandise Authorization (RMA) labels. You can provide multiple ways for your customers to contact you (see under Point #9 below).

Save money by means of online efficiencies. Companies have used the Internet to save billions of dollars. Taking orders online with real-time credit card authorization saves paying call center operators and cuts entry errors. Online catalogs save lots in paper, printing, and distribution costs. Online FAQs and knowledge bases cut the number of customer service personnel you need. And I'm just scratching the surface here.

What's the design decision here? To be clear and focused about your site's objectives and purposes.

2. Decide Whether to Outsource or Do It Yourself

After clarifying your purposes, you need to decide whether to outsource the design of your website or to do it yourself. Let me tell you my bias. For nearly all businesses and larger non-profits I recommend outsourcing website design

Website design done right is complex and requires a number of different skill sets that aren't commonly found in any one person, especially someone that doesn't do this for a living. Some of these skills include:

html savvy. Good web design software can help. But the kind of html code produced by many WYSIWYG ("what you see is what you get") programs can be kludgy and hard to maintain. Fine-tuning your design requires you to get into the raw html code.

Graphic design, color experience and good artistic taste. No software package bestows artistic taste on its user, but good taste is indispensable for an attractive site. Of course, graphic software expertise is required to produce attractive and clean photos and site graphics, optimized to the smallest possible file size for quick loading.

Website navigation design and implementation. Helping visitors get where they need to go quickly and efficiently is difficult, especially on sites over 20 webpages or so. Good navigation design comes from experience, not from good software.

CGI and database programming. Even smaller sites use a "contact us" form and often a site search program that require CGI program installation and configuration. Larger sites may need to be integrated with an online database, which is no job for the faint of heart.

JavaScript and Flash programming. Functional websites are dramatically helped by Flash and JavaScript features such as animation, drop-down navigation menus, and small windows that open to answer a hyperlinked question. Automatic pop-up windows that encourage e-zine subscriptions can be effective, but can be annoying if you don't make them to turn off after one pop -- and these days are increasingly blocked by pop-up blockers.

Marketing and business experience. An outside company doesn't really understand your business like you do. Make sure you communicate exactly what you need to achieve. The best website design firms understand how to build Web marketing into the site design to make it search engine friendly, to make the sales pages really sell, etc.

What does outsourcing cost? For a simple five or six page website, expect to pay $750 to $1,500. For a more complex site you may pay $3,000 to $10,000 and up. For database-driven sites you'll need custom programming. Of course, sites designed for high traffic or for Internet-focused companies can cost much more.

If you have no money, it is possible to teach yourself website design. I did. Arm yourself by reading some website design books first and expect to make some mistakes. 

Another approach is to a build a site using built-in templates and site-building wizards that come with proguams such as Ken Evoy's Site Build It! Evoy's Site Build It! has the added advantage of a dozen tools to help increase your rank on the search engines. http://sales.sitesell.com/buildit/

Another approach is to hire a website design firm to design the website templates, navigation system, CGI and JavaScript programming, and perhaps do usability testing. They would set up the basic structure, and you could build it out using their template and design. Make sure they spell out in writing exactly what they agree to do for how much money, and provide a firm deadline by which their work will be completed. Partial payments should be made as specific milestones are reached and approved.

What's the design decision here? To decide whether to outsource none, part, or all of your website project.

3. Divide Your Website into Logical Sections

A website needs to be organized both logically and with multiple directories, one for each section. Here's a typical small-site structure:

This site layout isn't meant to be prescriptive, but only suggestive. Get a blank piece of paper and begin to lay out what your site will look like, with similar functions grouped together.

Don't be afraid to create multiple subdirectories to keep your site organized. When you're setting up newsletter archives, for example, create a directory for each year of issues so a single directory doesn't get too cluttered. Remember, you're not designing for just the present moment, but for the growth your site may undergo over the next two or three years.

Your home page should provide a statement of exactly what your company or organization does. Preparing a Unique Selling Proposition (USP) for your company is a great way to begin. I'm amazed at how many websites don't really tell me what they do. I have to nose around trying to figure it out. State precisely what you do, and then provide links to the rest of your site so your visitor can learn more.

What's the design decision here? To structure your site and break up your webpages into logical directories and subdirectories to avoid confusion later.

4. Develop a Site Navigation System

Now that you've laid out your website, you can see how important a good navigation system is. One of the chief complaints that visitors have is that they can't find the content they're looking for. The larger your site, the more important redundant navigation systems are -- more systems than you think you might need. Here are some of the basic systems and a few you might not have thought of:

• Left-side menu lists the various sections of your site, and perhaps some of the subsections, too.
• Tabs near the top of the webpage help the visitor quickly see the most important sections of your site. This facilitates browsing.
• Search the site or the product database. Larger sites need a search feature so visitors don't get lost.
• 10 most common gifts, etc.
• View today's specials or recent news releases.
• Bottom links provide hypertext links to all the sectional pages.
• Site map shows the structure and has links to every page (or sectional page).

Except for the very smallest five- or six-page sites, I encourage you to implement two or more of these systems. Over-kill, that's the ticket. What may be obvious to you and your designer after looking at the site for weeks may not be obvious at all to your visitor. Each separate navigation system gives her another opportunity to find what she's looking for.

If you're a do-it-yourselfer, consider using a free search engine such as Atomz Express Search (www.atomz.com/applications/search/trial.html) or FreeFind (www.freefind.com) for your search function. Another approach is to use Google Free web search with site search (www.google.com/searchcode.html).

Some websites are "button happy." They have graphic buttons down the left side of the page and across the top. They may look nice, but there's a big cost in download time. There's a strong trend on high traffic sites toward text menus made with html characters, not GIF images. Look at a text menu you admire and study the html by viewing the source. Text is good; buttons are bad -- especially when overdone. Got it?

What's the design decision here? To make clear, redundant navigation a priority -- for your customers' sake.

5. Give Your Website an Attractive 'Look and Feel'

Why should a website look good? Why should it look professional? Because like the sign hanging over a store in the strip mall, your website reflects upon you and your business. If the sign's lettering looks crude and homemade, people won't say, "The thrifty shopkeeper is trying to save money by making his own sign." They'll say, "How tacky! If this is how the sign looks, then the products and services can't be of very high quality either!"

You owe it to yourself to make your website look top-notch. To succeed, you'll need some artistic flair, or perhaps you should hire a graphic designer's talents for the basic design and site graphics. 

I'd like you to look with me at IBM's homepage. It is a well-designed page, but it isn't "graphics heavy" and doesn't take a long time to download.

I won't be exhaustive, but I want you to notice:

The site is clean and understated, not gaudy or in-your-face. Few colors with lots of white space contribute to this light, airy feeling.
The page is designed with colored cells of html tables that take practically no download time. Most of the parts that are blue, black, dark grey, and light gray are table cells.
Graphics are few. The largest is a gif image 25K in size. Other gif images are small, with some reusable "go" and "search" buttons.
The left-side menu is text.
The navigation system consists of: (1) left-side menu, (2) site search in the top right corner, (3) four major categories in the black bar at the top, (4) solutions (browse by industry), services, and shopping in the gray blocks, (5) recent news releases, (6) selected popular products highlighted with graphics, (7) company-oriented menu in a black bar in the bottom left corner.
Photographs contribute to the classy, professional look. Photos can be very effective on business websites.

I could take you to many websites, but you can do that yourself. Become a student of how to create a simple, clean business look. It takes a lot of skill to design a site this well and with this kind of restraint.

Let me tell you a secret. Some graphic designers like to build sites with lots of graphics. They have fast LAN or DSL connections and have no idea how long their sites take to download on a 56K modem. Try to keep your homepage to 60K maximum, counting the file sizes of all the graphics and the html. (It's a hard, but an important exercise.) Resist a designer's yen to show off his skills. Quick loading -- that's important.

There's no way I can educate you on complementary colors, warm and cold colors, heavy and light colors, etc. But bear in mind that everything you do has some effect on your visitor's perceptions of your company, her state of mind, and her emotional response.

One of your best website investments will be in a few excellent, royalty-free stock photos. Well composed photos add a touch of class to your webpages. They provide a visual center of interest in an otherwise plain webpage. They add spice and color. You don't want just dull pictures of business people in suits. To create a sense of energy and maximum effort, you might use a theme of photos from competitive sports, for example. Use your imagination.

What's the design decision here? To develop a quality, professional appearance for the website that represents your organization.

6. Build Basic Webpage Templates

Commercial websites are built from templates. You or your designer will create a template that constructs each part of a typical webpage, with a "hole" in the center for the unique page content. This takes many hours to build from scratch, but it's worth it. Now you can create page after page from the template. For each webpage you'll insert a page title, meta tag content (see Point #7 below), a headline, and the text content, each in its appropriate spot. Have fun!

Modern websites control the font sizes and colors using Cascading Style Sheets (CSS). When you change the font size on a single master CSS file, it changes the fonts and colors in all your webpages. Cool! Make sure your website designer builds webpages using a single CSS file, since it saves maintenance costs in the long run.

The design decisions that you need to consider here are many, since they involve every detail of the look and feel of your basic template. Hopefully, you'll decide to employ Cascading Style Sheets (CSS) that make your entire site easy to modify and maintain. Also consider features available with XhtmlL.

7. Construct Your Site to Be Search Engine Friendly

With a little practice, anyone can build a webpage. But a webpage that search engines love to visit and index -- vital if you expect your site to get traffic -- that's another story. So many, many business websites don't have a clue how to do this. Let me mention two important aspects of building a search engine friendly site:

A. Make Each Webpage a Search Engine Siren

In Greek mythology, as you know, partly-human female creatures called Sirens lured mariners with their singing. Your webpages ought to entice search engine spiders or robots to index your site. Each webpage you construct needs to contain the following elements. Note the careful placement of keywords, the search words people would use to find this particular webpage.

Title -- provocative and descriptive, containing the most important keywords from that webpage, no more than 80 characters. This is what shows up hyperlinked in search engine results, so make people want to click on it.
Meta tags -- The description meta tag should include one or two sentences (up to about 250 characters) describing the contents of this particular webpage. Work into the sentence the most important keywords and keyphrases that occur on this page. Some search engines will display your description. I still include a meta keywords tag, since Yahoo currently uses it for indexing, though Google doesn't.
Headlines -- H1, H2, H3 in html parlance. Your headline and subheadings should include your important keyword at least once.
Body text -- The first paragraph of the content of your webpage article or text should contain the main keywords for that page.
Hyperlink text and filenames -- Search engines believe that the words contained in hyperlinks on your webpage (such as widget) are important, and thus rank them higher. If the filenames contained in the hyperlink URLs contain important keywords (such as widget.html for the filename of your widget order page), so much the better.

Don't emphasize the same keywords on every page. Let the actual content on that page dictate what keywords should stand out. Your goal is not to trick the search engines in some kind of bait-and-switch scam, but to help the search engines recognize and index appropriately the actual content of your webpages. Construct every webpage with search engines in mind, and it'll help your rankings. Of course, search engine rankings are heavily influenced by incoming links to your site, but constructing your webpages with an eye to search engines is very important, too.

B. Search Engine Savvy Navigation Systems

Navigation systems are built to help actual humans find their way around your website. But these navigation systems had better be designed carefully or the search engines will throw up their hands in disgust, with the result that actual humans will never get to your website. Search engines need a chain of hypertext links -- starting at your homepage -- that will take them, page by page, to every webpage in your entire site. But let me explain three common navigation design problems that can disrupt search engine indexing of your site:

1. Frames (mentioned in Point #4 above) produce a navigation system where the menu on the left scrolls independently of the page content on the right. Unfortunately, frames can wreak havoc with search engines. (a) Unless you are careful to include <NOFRAMES> tags, search engines may not be able to find the content pages. (b) Even if search engines do find your content pages, these pages can show up in response to a search engine query all by themselves, without the navigation system and links necessary for a visitor to find the rest of your website. Don't use frames. If your current site has frames, make plans to rebuild the site without them.

2. JavaScript and Flash are programming languages that can make very classy, animated menu systems. For example, a menu item might have a drop-down sub-menu that will wow your visitors (you hope). The problem is that if JavaScript and Flash systems replace plain hyperlinks, the search engine may not be able to find the underlying pages. Most search engines have posters on their walls saying, "I don't do Flash." Stubborn creatures, these search engines. One solution: retain your fancy menus, but include hypertext links at the bottom of the page to your sectional pages, with links on your sectional pages to all the subpages in that section. You can also submit a site map webpage to the search engines that contains a link to every page on your site.

3. Dynamically generated webpages, created "on the fly" from a database, are more difficult for search engines to index, since these webpages don't exist in real time. They appear when a visitor clicks on a link. Then the database whirrs and spits out a transient webpage for that visitor and that visitor alone. Database-driven content management systems are the only way to keep your sanity if your site contains thousands of webpages, but they cause search engine problems. 

A question mark or a long session ID string can be a red flag to search engines. Many will stop and throw a hissy fit -- or perhaps index more slowly and less comprehensively. A bunch of over-sensitive search engine divas? Yes. But it can happen. Don't use content or catalog management software that produces long URLs if you can help it. You can get around this in three ways: (1) URL rewriting at the server configuration level, (2) building a set of focused content pages (see Point #8 below), or (3) paid inclusion submission to search engines.

What are the design decisions regarding search engines? A commitment to design (a) each webpage and (b) the site navigation system with search engines in mind. This is a marketing, not a techie priority, so you may have to insist that your website designers work with search engines on their minds.

8. Write and Fine-tune Focused Content Pages

If you've ever been in charge of building your company's website from scratch, you've learned that one of the most time-consuming tasks is to write the copy or words that appear on the website. It's plain old hard work. It's easier to build the second or third version of your website, since the writing is already done.

Or is it?

One of the keys to generating search engine traffic is to get your site into the top 5 or 10 positions on the search engines for the keywords and keyphrases that matter to your business. It's often hard to get your home page to score high for specific keywords or keyphrases, since it is the most general entrance to your entire website content. Your best strategy is to write a series of focused content pages, each of which features a particular topic and keyword or keyphrase. These pages aren't general, but very specific.

For competitive words, you can't rank high on Google and other search engines without lots of incoming links, so work on linking strategies, too, such as reciprocal linking with complementary sites. Nevertheless, these focused content pages should be an integral part of your website strategy to boost rankings.

Note: The doorway or gateway pages recommended in years past can be penalized by search engines as duplicate content. I recommend that you dismantle them and play by the new rules of, "Nice search engine. Good boy. Don't bite."

The design decisions? A functional website must generate traffic, so you must intentionally include focused-content webpages in your site to pull that traffic to you.

9. Incorporate Customer Communication Systems

Websites are two-way, interactive communication systems. You communicate your company's marketing message to potential customers and make it easy for them to reciprocate by communicating with you. The better the communication, the more trust increases, and customers feel comfortable to do business with you.

Of course, on your contact page, include full contact information -- name, address, phone number, etc. I'm amazed at the number of sites that don't include any contact information, but still expect people to do business with them. Full contact information builds trust -- even if your customers never need to use it.

One key communication tool is the "Contact Us" response form. Such a form includes fields that ask for your visitor's name, contact information, and his question or comment. When the form is submitted, it sends an immediate e-mail to you as well as an e-mail assuring your customer that you'll be reading the message and responding soon. And you need to keep your word. Respond to your customers' e-mail promptly!

The poor man's response method is a mailto link (such as username@domain.com) that allows the customer to use his own e-mail program to send you an e-mail message. The problem with this approach is that you often don't get vital contact information from the customer, such as his phone number. With e-mail that comes from a form, you can easily filter it via the subject line into the appropriate folder for immediate viewing. E-mail that comes through a general e-mail address, on the other hand, easily becomes confused with spam and could be overlooked.

One of the most popular form-to-email programs, Matt Wright's FormMail ver. 1.92 (www.scriptarchive.com/formmail.html), was updated on April 19, 2002 to plug some serious security holes. It is an excellent tool -- and free, also.

However, there are other ways you can make it easy for customers to communicate with you. These include

Instant text chat systems such as LivePerson (www.liveperson.com).
Instant Messaging (IM) systems are in widespread use by your customers. Why not list all your usernames and numbers on your site for quick response to customer questions?

One excellent way to save time for yourself and your customers is to develop a Frequently Asked Questions (FAQ) page. It'll cut down on your customers' need to contact you.

Excellent customer service is the basis of any successful business -- on or off the Internet.

The design decision here is to incorporate multiple ways for your customer to contact you.

10. Create and Test Effective Sales Pages

For many business sites, the purpose is (1) to sell a product, (2) to have the visitor go through an affiliate link to buy a product on another site, or (3) to generate contact information for a future lead or follow-up. For organizations, success may be measured in memberships or subscriptions. Whatever your purpose, you must work to optimize responses.

Good sales pages result in a high ratio of sales to visitors -- called the "conversion rate." A good site might have a conversion rate of 3% to 5%, some higher and many lower. Over the past few years, marketers have developed the art of increasing the conversion rate. This is especially important when you are purchasing Pay Per Click (PPC) ads to drive traffic to your site. Your profit is closely related to (a) the cost of the click and (b) the conversion rate of the "landing page," that is, the sales page to which you direct interested shoppers.

To scientifically and systematically increase your conversion rate to the maximum, you must carefully track sales percentages for each product you sell. Then make incremental changes to the landing page or the order system and see if the conversion rate rises or falls. Over a period of careful study and change, you'll maximize your sales.

Here again are the steps you'll go through:

1. Set up an ordering system (e-commerce capability)
2. Create a landing page
3. Boost sales on your landing page by testing

What's the design decision here? To commit yourself to seriously working to increase the response rate.

11. Conduct Usability Trials and Incorporate Changes

We've almost finished our survey of 12 Website Design Decisions. But before you quit, you need to test your site thoroughly. All newly constructed websites contain unseen glitches -- especially those created by inexperienced developers.

Here's how to conduct your first few usability trials. Ask to meet with a friend who is an Internet novice. Seat him in front of a computer, stand near him, and direct him to your site. Tell him that you'd like him to talk out loud to you about what he is thinking and the questions that occur to him as he pokes around your site. Explain to him that you won't be able to answer any questions at this time, but you want to hear them just the same. Now watch and take copious notes. Observe what confuses him. See where he gets hung up. Listen to his questions.

After 10 or 15 minutes of this humbling exercise, you'll detect plenty of small changes to make. You'll also learn how effective your navigation system is.

To discover 85% of the usability problems on your site, repeat the usability exercise a total of five times, each time, of course, with a different person who can look at your site through completely new eyes.

What's the design decision here? Submit your site to simple usability testing with five subjects. Your site will be much better as a result.

12. Plan to Maintain Your Site for the Long Haul

Building a site for the first time is exciting. Maintaining it for the next two or three years can be extremely frustrating unless you've set it up with maintenance in mind. By maintenance I mean:

1. Changing the content of existing information, such as upcoming events, new industry directions, new personnel, etc. Life isn't static. Websites shouldn't be either.
2. Adding new webpages, such as archiving copies of your newsletters, adding new products and services.
3. Changing the content of your home page so your site looks active and up-to-date.

If your business is too small to have an in-house person with html skill, your web designer may offer a maintenance service. Maintenance services are cheaper than hiring someone just to maintain your website unless you are updating your website many times a day.

What's the design decision? Make sure that you plan for site maintenance rather than let it fall through the cracks.

That's it -- the 12 crucial design decisions. Of course, there's much more to a website than what I've mentioned. But this will get you started in the right direction and get you asking the right questions.

The Next Step -- Marketing Your Site

A website without marketing is like a candy shop on a dead-end street. You've got to let them know you're there. Your website designer will probably submit your home page to the search engines, but that's only scratching the surface.