Developing a Web Site

While developing a website is a different undertaking each time a new project comes along, well designed websites have many things in common.  Usually, these commonalities provide a range of services that the developer must implement differently for each project.  So, while the implementation may differ, the existence of best practices for designing a web site does not:  good web sites use best practices - bad ones do not.

Assess your Target Audience

This is the single most important facet of Web Design.  Without a target audience, the need for a website would not exist.  Simply put, the needs and desires of the target audience should be considered first before any decision is made regarding the implementation of the site.  Each and every time you as the developer try to implement some facet of the site, the primary question to be answered is "How will this benefit the user?".  Sometimes, the question is rhetorical.  Other times, some hard decisions - and often compromises - must be made.

Let's assume, for the moment, that you've got a message to deliver through a website.  In order to define your target audience and its needs, you'll need to answer at many of the following questions:

• The Primary Audience
  Who are the primary users of the site?  This is often not as easy as it seems - and it will affect how you design your site profoundly.  For example, suppose you were going to build a site for an elementary school.  Almost certainly, you would design the site differently if your target audience were the students rather than the teachers.  You might even consider a third group: parents.  It is your job to determine, from the get-go, who the primary audience is.  By no means, however, does this have to be restrictive.  Using the above example, you can design pages for kids with helpful links for parents and/or teachers - and vice versa.  The point is that designing for the primary audience is the key to answering this question.

• Navigation
  How will your users move through the information you are providing?  There are countless ways to provide navigation controls on a website.  They may be a horizontal list of links at the top of each page.  They may be a column of links on either side of every page.  You might provide intuitive icons for navigation on every page.  The list goes on but notice the phrase included in each scenario - on every page.  And that's the key to providing navigation.  Never let your users get lost or stuck on any page you develop.  Try to let them know where they are, where they've come from. and where they can get to all the time.

• Compatibility
  Is there a reasonable assumption to be made about how users will view your site?  You will need to make assumptions to answer this question.  You must put yourself in the position of the user and ask yourself:
  a. What browser and which version would I have?
  b. What is my connection speed?
  c. Will I turn off the graphics?
  d. Are Cookies allowed on my system?
  e. Can scripts run in my browser?
  f.  Do I have any plug-ins to handle multimedia?
  There are countless other questions to ask but you get the general idea.  These questions should be answered BEFORE designing the site as changing them later is often much more of a headache.  You must try to gauge the level of technology as well as the level of expertise in using that technology of your primary audience.

• The Look and Feel
  What does the primary audience expect to see?  Some factors to consider are a color scheme, page backgrounds, iconography, and other style issues.  You can choose to make the site as flashy or subdued as you'd like - as long as you keep the primary audience's needs in mind.  The site you design for your DHTML showcase is likely to be different than the one you design for the insurance agency.  In the long run, the only real thing you must address is consistency.  Make all of the pages in your sites as much like every other page as possible.  Keep the navigation tools in the same location on the page; use the same colors for every page; make sure that anything that looks like a button acts like a button.

• Your Own Objectives
  What are your design objectives for this project?  Here is where you may need to make some compromises.  If you'd like to include a flashy DHTML or Flash animation in your design, you'd better make sure that your target audience has the software necessary to view it.  There is nothing more unprofessional than publishing a site that doesn't work as intended - especially for the primary audience.  Once you define your target audience, then choose your technologies.

Desirable Site Elements

There are many things that you can use to make your website more functional for your primary audience.  Some of them make your site easier to use, some of them create a channel of communication, some of them just plain look good.  How and when you use these things is, again, up to you.  There are, however, some elements that exist in most well designed sites.  By no means do you need to implement all of them.  But you should try to include as many as are appropriate.

• Navigation Structure
  This one is imperative.  You must provide a way for your users to navigate your site.  There is nothing more frustrating to a user than to get lost within a website with no idea how to get out.  Try to provide "state" for your users.  That is, they should be able to tell where they are, how they got there, and where they're going.

• Feedback Mechanism
  If you include a way for your audience to contact you - they will feel more like a community, involved in the design of the site itself.  This fosters repeat visits - something every designer strives for.  Most people will feel more welcome at a site where they know they can contact the designer.  Yes, often you'll hear complaints from users, but aren't those same users the primary audience for your site?  Don't you want to know how your audience thinks the site can be better?  Try to provide a feedback mechanism on every page so that your users can get to you from anywhere on your site.  And, by all means, try to provide a timely response to them.

• Update Information
  It's important to update your site with fresh information as often as is necessary.  Don't, however, waste your users' time by putting the newest stuff down at the bottom of the page.  Try to let the user know at the top of the page when the site was last updated and, if you have room, what was done.  Trust me, your users will appreciate not having to scroll down to the bottom of your pages only to find that there's nothing new.

• Multimedia Content
  Multimedia is a two-edged sword in the context of web design.  On the one hand, clever use of multimedia can set your site apart from your competitors' sites.  On the other hand, multimedia files are notoriously big and take time to download.  Here is where a well-defined target audience comes in handy.  As an example, suppose you were designing a site for a company that sells music in the form of MP3s.  Almost certainly, you'd provide a way for users to hear the songs you hope they'll purchase.  But don't blindside your users by forcing them to sit and wait for the song to download before they've decided they want to hear it.  The same thing applies to large image files or animations.  If your file sizes are large, provide thumbnail images or links that indicate the file size of the larger images so that users can choose what they'll wait for.  In short, multimedia is a great way to spice up your site - as long as you don't cram it down your users' throats!

• Other Niceties
  There are some other elements you might consider when designing your site.  Some of them foster that sense of community, others make your site easier to use.  Following is a short list of some of those things you should consider:
  a. Table of Contents/Site Map
  b. Search Capabilities
  c. Guest Book
  d. Discussion Groups
  e. Chat Rooms
  f. Mailing Lists
  All of these elements are relatively self-explanatory.  For instance, imagine navigating Microsoft's site without the ability to search.  Not much fun at all.  These elements, however, need only be used in their proper context.  If your site is small and the navigation structure is well defined, a search engine might be overkill, or worse, distracting.

Design for the Widest Audience Possible

This one makes perfect sense: you should strive to make your pages accessible to as many users as possible.  This includes an International audience as well as a disabled audience.  Here's an example:  in the US, the traditional color worn to a funeral is black.  In Japan, the color usually worn is white.  In the US, a traditional bride would wear white to her wedding.  In Japan, she'd wear red.  Try to keep things like this in mind when choosing the colors for your site.

In terms of the disabled audience, believe it or not, browsers exist for blind people, for the hearing impaired, for the paralyzed, and for many other disabled web surfers.  Something as simple as providing alternate text for your images can greatly enhance a blind user's experience (typically, that browser reads everything to the user).  The disabled audience, along with senior citizens, is one of the fastest growing segments of society gaining access to the web.

Finally, one of the most often seen gaffes of novice designers is the site that's designed to look good only on their own machine.  Usually, that kind of site involves horizontal scrolling because the designer has his monitor set to display more information than a typical user's monitor.  The site looks great at 1024 by 768 but the typical user, set at 640 by 480 must scroll back and forth each time the end of the line is reached.  Make this your number one rule: Avoid horizontal scrolling like the plague!

Does this mean that you must design to the least common denominator?  Unfortunately, many times the answer is yes.  Of course, that depends on who your primary audience is.  If your audience is primarily using Internet Explorer 3 (which came bundled w/ Windows 95) or an earlier version of Netscape, or even America Online, much of the newer technology simply won't work.  Don't try to force your users to upgrade their software - they probably won't anyway.  They'll go elsewhere.  Rather, design your site so that your primary audience's needs are satisfied as much as possible.

Test Your Work

Make no mistake - testing your work is your job and your job alone.  Once again, a well defined target audience can come in handy.  If you know that your primary audience will have browsers that support Cascading Style Sheets, then feel free to use them.  Since there are only 3 browsers that support CSS (can you name them?), your testing cycle becomes a little shorter.  If, on the other hand, your primary audience is broad, you'll have to test more browsers (in case you didn't know, web pages look and function differently in different browsers).  Try to test your site in as many browsers as possible so that you don't limit your audience or, worse yet, force them to upgrade their software to view your site.  Many time users will just go elsewhere.

The other facet to the testing process is connection speed.  If your target audience exists on an Intranet, you can be sure that your site will download quickly.  On the other hand, if your site exists on the Internet, you can be relatively sure that most of your target audience will be connecting using POTS (Plain Old Telephone Service) at 56Kbps.  You'll have to adjust your design accordingly.  Most web development tools perform an estimate of the time your pages will take to download.  As a general rule, they are pretty close - as long as the page being estimated is the first one visited.  There is no substitute, however, for testing yourself.  Try to test at as many connection speeds as possible.

That's a brief exploration of some of the things that make websites "good" - whatever that means.  Of course, we haven't talked about the ultimate design element: content.  On the Internet, content is king.  If your message is well formed, your target audience well defined, and your design sound, you'll be well on your way to becoming a Web Developer!