WEB PAGE DESIGN



The structure of a web page can attribute to the success or demise of your business.  Prior to developing the site, it is important to determine the market you wish to attract and what you want your page to accomplish.

The purpose of your site is to let viewers know who you are and what you do.  If your web page is difficult to follow or doesn't provide a user-friendly format, viewers will leave; thereby generating lost business or potential contacts. The Sharp Group, an Internet Business Services company, indicates "a powerful visual impact is necessary to open the mind of the viewer".  Your site must be appealing yet easy to read and navigate, thus providing the viewer the information he/she is requiring.

Critical Thinking/Planning

When developing a web site it is important to keep the visitor's perception in mind.  A large number of visitors are first-time users, therefore, first impressions are crucial.  For planning purposes, keep in mind that "bad or worst sites" have been identified as including  1) a bad design (too bold, too busy, backgrounds and fonts and or images are difficult to read, etc.); 2) unuseful content; and, 3) a site that is hard to navigate.  Therefore, carefully plan your site so as to benefit from the best design.  Design your site to be a "good example" for developers, novice or professional, versus a "bad example".

Allow your mind to be creative during the development of your site.  Try to plan ahead as to how you would like the information structured, what symbols/images represent you or your business, etc.  Make a plan then follow that plan.  As information changes you can update your site accordingly.  A good point of reference when developing your site with regards to backgrounds, design, layout, images, fonts, etc., is magazine and TV formats.  One concept is to follow the flow of chapters in a book, using a title page, page titles and pages consisting of shorter content versus extremely long pages.  This concept provides direction to the reader so they know where they are in your site.

Spelling/Punctuation/Grammer

Be sure to use accurate spelling and correct punctuation and grammer.  Improper use of these basics will quickly diminish the credibility of your site.  HINT:  Always keep a dictionary and Thesaurus handy for reference.

Directory Structure

The quality of your site may be based on your directory structure.  Directory pages should not be cluttered with links, frames, etc.  Use these tools to your advantage providing a beneficial navigational tool for the viewer.  Therefore, when offering directory choices limit the number to between two and 10 the fewer the better.   http://www.webdevelopersjournal.co.uk/columns/ajs_navigation.html
Providing in excess of 10 choices becomes confusing for the viewer.  Keep in mind this differs from the choices utilized in navigational bars as discussed below.

Navigational Tools/Links

The use of navigational tools and appropriate links can lend to the credibility of your site.  In addition, navigational tools provide options some viewers may not realize prior to accessing the tool bar.  This is helpful especially when the viewer has a limited knowledge of your site.  This site is an excellent example:   http://www.nazarene.org/  When developing a commerial site, maintain links that compliment your site information, thereby lending credibility to the informatin.

Background/Font Choices

Choose a background that will pull the reader to your page, not push them away.  Provide an appealing, soothing choice for your page which will make the site something someone will enjoy visiting and navigating.   If it's appealing to their senses, the viewer will continue through your site.  If not, they will leave - thus lost business or contact.   Coordinate your font, frames, styles, etc. with the background so you achieve a professional, credible look.  If the background and content are so busy it causes the reader to see wavy, jumpy lines or words it probably is not a good choice.  In development, any consistency you can provide for each page will lend a coordinated feel to your site.  This will identify you to the viewer much like a company logo.

Page Length

Page length is important as viewers usually will not stay with long pages of content.  An exception to this would be research topics consisting of narrative subject matter.  Thus, use tables, bullets, numbers, etc. when possible to provide for speed reading.  While these styles provide an easily read format, be careful not to overuse them in your design.   http://www.webdevelopersjournal.co.uk/columns/ajs_navigation.html

Graphics

Graphics can lend an important component to your site. However, use them only when they add something necessary to the presentation.  Keep them simple and the file small so they can be downloaded quicker.  Most viewers will not wait for long downloads when "surfing" for information. http://webdevelopersjournal.co.uk/columns/abc_mistakes.html

In summary, the main thing to keep in mind when developing your site is 1) how will a first-time user work with the site; and, 2) will viewers know who you are and what you do by visiting your site.  Will they find it easy to use or difficult.  Upon completion of the design, go back and tour the site as a first-time user.  This should provide valuable insight to the development of the page.  Finally, strive to maintain credibility with your site so viewers will realize you are a good risk.  For commercial sites, this may be where you get your "business referrals".

Good Design Examples:

http://www.nazarene.org/ - I like the way this page has been layed out.  I feel the options menu available on the left provides for ease in navigating through a variety of information.  The more I browsed the more I wanted to browse to see what other information was available.

 http://www.olivet.edu/ - I like the feel I get from the home page.   Although the background is dark, it presents a good contrast with the frames.  The menus on the right are easy to interpret and easy to navigate.

http://www.sauder.com/ - I like the way this site works.  The graphics allow you to see what the item actually looks like.  They've lined to local retailers which makes it a real workable site.

Bad Design Examples

 http://www.angelfire.com/pa3/dinosaurus/ - This site is real "goofy", however kids might like it.

http://www.spring-tree.com/ - This page took a long time to load, plus the busyness of the page made me want to move on.  In addition, the color schemes on subsequent pages were difficult to read and some didn't make alot of sense.

Resources:

http://www.geocities.com/SiliconValley/Campus/2597/home.htm
http://www.marionia.com/toolbox/index.html
http://webdevelopersjournal.co.uk/columns/abc_mistakes.html
http://www.users.nac.net/falken/annoying/main.html
http://www.webdevelopersjournal.co.uk/columns/perpend1.html
 http://www.webdevelopersjournal.co.uk/columns/ajs_navigation.html