Plan your site
A careful plan and a sure sense of purpose are the keys to success in building web sites. So before you begin, create an effective plan for your site. With a plan, you have a design reference.
The plan for your web site should not be created and then hidden away somewhere. It should be the basis of your web site and very much a working document.
You should also identify the content information and graphic resources you may need. As an addendum to the plan, you should include a graphical representation of the site. Divide your information into logical content units and structure then divided information into groups by importance, relationship to other units, etc.
Your plan should contain a:
- Statement of Purpose
- List or summary of your main objectives
- Analysis of the target audience
- Concise outline of the information to be included in the site
- Summary of how often information should be reviewed and updated and by whom
Statement of Purpose
The purpose statement should be brief and pinpoint the most importance aspects of your goal. Once the purpose is clearly defined, you can identify the main objectives and the target audience.
List or summary of your main objectives
Your first step should be the codification of your objective(s). Delineate the most important aspects of your objectives and determine the steps involved in their accomplishment. With a clearly stated purpose and objectives, a project has a blueprint to follow.
Analysis of the target audience
Determine who the audience will be for your site. The departments, units and personnel accessing the site should be outlined.
- What information do they require?
- How is information best presented to them?
- Do they have any special requirements?
- What technology do they use for access?
- How familiar are they with the Internet and related media?
Evaluate the viewer's reasons for being at your site and use that to determine the design strategies that should be implemented. Usage that may dictate presentation approach might be:
- Teaching/Training - usually linear in approach but also provides links for self-directed learning
- Education - provides sources of research and development of topic
- Reference - quick look for information
- Service - usually requires the completion and submission of information to receive the required service
Concise outline of the information to be included in the site
Develop a concise outline of the information to be included in the site. Create a design of the page relationships and determine the content for each page. The design can be used in the future to analyze the site when updates arerequired.
Note: The outline should be updated when major changes are made in site/page content or direction.
The outline should reflect the following requirements:
- The navigational construct should be reasonably structured and obvious to the user.
- When a self-directed approach to information gathering is required, flexibility should be supported by appropriately grouped links to reference materials and lists of sites.
Summary of how often information should be reviewed and updated and by whom
Determine how frequently information should be reviewed and changed. This information is vital in the coordination of the overall change control process. The update schedule should be available to users. People need to know how current the information is, particularly time sensitive information. If your data is updated once a month, or once a quarter, that information should be given to the users.
Learn HTML
The fundamental skill for developing web sites is HTML. Many developers today use WYSIWYG applications to create pages. These applications are extremely useful in developing web sites. It is important to remember, however, that these programs can, on occasion, place extraneous items into the HTML code that can have unexpected outcomes.
When designing and implementing your site, consider the following:
- Make sure that each link is thoroughly tested. Everything on your site should function according to design.
- Verify the HTML syntax and construction.
- Keep pages up to date.
- Make your site browser independent, it must be developed for access by all browsers.
- Avoid using distracting controls such as those that blink or are otherwise to busy. Use HTML features wisely.
- Date the pages. It is a fundamental documentation aspect of a good quality control regime.
- Place hyperlinks in strategic locations to facilitate solicitation of comments and inquiries.
- Use HTML conversion program with due consideration. They sometimes have formatting shortcomings.
Hone your writing skills
Creating a web site is writing. All the grammar and editing rules that apply to the paper realm also apply to online. When designing and implementing your site, keep the following in mind:
- Keep pages up to date.
- Correct spelling. Use a spell checker!
- Use appropriate writing skills, skills that communicate a concise and succinct message to the reader. Keep in mind that good copy is a function of both prose and grammar.
Design your site
Your overall site design is the one of the most important decision you make when creating a site. The site design determines the relationship of all the components of the site. It determines how the navigational interface is designed and how the information retrieval process will flow. The site design also determines how the user feels about the site. It provides your visitor with an enhanced sense of comfort and confidence.
When designing a site, keep in mind that you are actually creating a process for knowledge management. Knowledge management considers the synergy between technology and behavior. Proper knowledge management requires that you focus on the merger of data and information processing capabilities and, at the same time, the creative and innovative capacity of the user. Visitors to your site need autonomy in learning and decision making. They want to act in an mode that involves a higher degree of responsibility and authority in the process of harvesting the information you have organized for them.
There are various ways to design a site. Each design variation provides its own unique advantages and disadvantages. However, once you select a design, you will find that no design is absolute. You should, however, strive for consistency, uniformity, and logical organization at all levels of your site.
Web site organization is, by nature, hierarchical, the most important page on top and the subsidiary pages below. The home page is the most important page. It functions as a table of contents and an index to the site. The home page should impart:
- The purpose of the site - Who, what, when, where, and why
- Ready comprehension of the site's content - Design your home page to function as the site guide
- The navigational method - How to access the site content
The success of your Web site will be decided by how well your system of organization matches the expectations of your users. The most successful sites are those where content and navigation is closely linked. Sites where you can not remove content without updating all of the main navigation pages. When designing your sites, keep in mind that sites aimed at information retrieval must be designed for the focused users. Focused users click on the link most likely to yield the information they require. For example, too many graphics can proved to be distractions during information retrieval tasks rather than an aid.
Note: Don't use generic links, it makes it harder for users to predict what they will find. Naturally, this makes development of large Web sites more difficult, because the home page and high-level links may need to change more frequently. However, the benefits outweigh the cost in terms of usability.
Build your site so it is self-contained and transportable from one server to another. Use relative links among files you create and only use absolute/complete URLs when linking to files on another server.
Subdivide the information
Modularization is the optimal design format to use in creating your site. Modular pages dedicated to specific topics are easily and quickly updated. Modular structures facilitate updates minus the burden of changing large chunks of information and the associated page reformatting tasks. The concept is analogous to that of a loose-leaf format used in paper-based procedural manuals that allow easy updates by the simple replacement of one section with new output.
The greatest efficiencies are achieved by dividing content (text and graphic representations) into sections equivalent to two or three printed pages. Longer pages negate the information mapping and navigation benefits inherent in the use of hyperlinks.
Information Mapping is a research-based approach to the analysis, organization, and visual presentation of information. Information Mapping is based on research into how the human mind actually reads, processes, remembers, and retrieves information. It enables authors to break complex information into its most basic elements and then present those elements optimally for readers. The result is a set of precisely defined information modules.
A simple layout, with well-defined, recognizable sections improves the navigation of your site. Do not hide the purpose of the site in deep layers of pages. Present a clear description of your well-organized content. Provide visitors with a good idea of what they will find as they move deeper into the web site.
Once the modules are outline, the module content can be created. In keeping with the philosophy of Information Mapping, each module should be equivalent to two or three printed pages of digestible information. The module should be streamlined to include only relevant information. Hyperlinks should be used to take the reader to subjects that are complementary to the main topic if the writer feels that the viewer may want to investigate a point in more detail.
Your organizational goal should be to keep the number of distinct topics the reader must keep in short-term memory to a minimum. Cognitive psychologists have proven that most people can only hold about four to seven diverse pieces of information in short-term memory.
Site elements
Web sites are composed of various elements that combine to create the environment that is your site. In this section the home page, menus, graphics and hyperlinks are described. Each plays an important role in the design and consistency of your site.
Home page
Every page in your site should link to the home page. Because pages in your site may be accessed from pages anywhere on the Internet, make sure that everyone who follows a link to one of your pages can find your home page. The home page should:
- Welcome the visitor
- Identify your site
- Furnish direct contact information, particularly a functional e-mail address
- Provide a table of contents or index to the web site
Menus
A menu contains a list of choices or selections provided for the user. The choices are designed to aid in the navigation of the site. Menus should provide specific information and direction. Do not use generic names. Let the user know what they really will find when they open a new page.
Frequently, menus are used with tables or frames. Using tables or frames allows you to divide the user interface. Each method has its own advantages and disadvantages.
Graphics
Graphics add excitement to a web site. A picture is worth a thousand words has been said often. The use of color and visual imagery provides cognitive recognition for the user. Of course, the graphic must address the topic of the site. Graphics should be selected based solely on the content of the page.
One use of images is in the creation of hotspots. Hotspots are the area on an Image Map that contains an hyperlink. Image Maps can be made using any standard graphical image.
Make graphics work for you. They should provide understanding and information. They should not overwhelm the content. It is easy to go overboard with graphics. Good design aids the reader without getting in the way. Do not use graphics in circumstances where the inability to access that format would result in a critical message being missed.
The most frequently used graphic formats are the Graphic Interchange Format (GIF) and Joint Photographic Experts Group (JPEG).
Hyperlinks
A hyperlink is embedded in a hotspot, keyword or phrase, that when clicked, will guide the user to another page containing more information regarding that word or phrase. Hyperlinks should fit seamlessly into a document. The use of hyperlinks should not disrupt the narrative or didactic flow of your text. Using phrases such as click here completely defeats the purpose.
Links within paragraphs should not interfere with reading the information either on the screen or when printed. The user will focus on a hyperlink before reading the surrounding text. If information about where the hyperlink leads is only found in the surrounding text, you have created extra work for the user. Many people skim through the text looking for keywords in the hyperlinks to get to where they want to go. The click here practice makes scanning for keywords impossible. In addition, if the page is printed, click here is meaningless.
Hyperlinks should complement sentence and concept structure of the site. They should not destroy the natural flow of the paragraph. The image, word or phrase used in the link should clearly communicate the primary characteristic or attribute of the link itself. Here are some essential techniques for the creation of effective links:
- Hyperlinks should draw attention to themselves. The image, word or phrase containing or defining the link should clearly communicate the primary characteristic or attribute of the link itself. A hyperlink is a simple device and it should be absolutely clear how to use it. When simple things are not readily understood by the user, it is usually a signal of poor design.
- The length of the link text should be reasonable. Too many words will not be effective in catching the eye and providing instant recognition.
- The text used in the link control area should be in harmony with and reflect the title of the linked page.
- If you use different text to distinguish a particular concept or idea, the discrete text must be highlighted.
- Be consistent in the use of text link color, a single color for all links.
Frequently Asked Questions
The Frequently Asked Questions (FAQ) page is where the most commonly asked questions from users are listed along with their answers. FAQ Web pages are ideal for Web sites designed to provide support and information. By creating a well-designed FAQ page and referring users to it, you could significantly improve the user's understanding of the information and services offered through your web site. A FAQ page also will diminish calls and e-mail for routine questions.
The interface
The interface provides the overall appearance and feel of your site. The Internet gives the user the ability to gather information in ways that may not have been considered by the web site developer. The information required and the order of absorption will be different for each visitor to your site. It is important to create a flexible site interface that attempts to meet the needs of all those who use it.
People do not use the Internet the way they use paper. The web is not static like paper. A web page can change at any moment. In addition, the web page can contain sound and video.
A good site is a function of good copy, good graphics, and consistent page design. When creating your interface, don't forget the basic writing principles that have been tested over time. Subjects and verbs still must agree. General rules of grammar still apply. Narrative still needs to be interesting and to the point.
Note: You may want to invest in a writing style guide. There are a number of good writing style guides that may be useful in the development of your site. The Chicago Manual of Style, published by the University of Chicago Press, is one of the recognized leaders.
The important thing to keep in mind is that writing style still matters. No matter how eye catching the site may be, poor grammar and spelling can quickly spell disaster.
Design for searching and scanning
Online document style should be concise and structured for fast scanning. The journalism inverted pyramid style works well on web pages. Put the important facts near the top of the first paragraph where they can be found quickly. Be sure to include the relevant information. The reader will want to know who, what, why, and when. Provide detail without over burdening the reader with text.
Design for the user
- Define and identify the user. Perhaps a better way to state it, identify and define a paradigm, a model of an array of users that you believe are typical to the service niche your site fulfills.
- Analyze the tasks and problems that are paramount to that array of users
- Make sure that the system you design is browser independent
Be consistent with the look and feel. Consistent use of design elements, such as title banners, button bars, icons and buttons throughout your web site will help users navigate your pages. For example, title banners and text subtitles should be designed to orient the user to where they are within the hierarchical structure of your site, and to identify the content of the current page.
Consistent icons, buttons or text links should be available on each page for the user to link to the site's home page, the nearest contents menu page and, when appropriate, to the previous and next pages in a series of pages. Generally, navigation aids should appear at both the top and the bottom of the page to minimize the need for scrolling.
When creating pages the following rules apply:
- Place a title on each page.
- Insure that the title reflects the content of the page.
- Use the proper document and chapter headings when you use lengthy, multi-part documents on your site.
- Design the system so that the text explanation of a control is available when a graphic control is used.
- Use the table of content structure at the beginning of the page when there is the need to catalogue the information presented on the particular page.
- Insure that the HTML and text titles are consistent and in synch with one another.
- Provide a search facility when practical.
- Use Previous and Next directional links. Do not use return to or back controls (buttons and links).
- Use consistent navigational buttons. Do not create a panorama of graphic navigation buttons. It does not provide a professional look and feel.
Navigation
While in the planning stage of your web site, consider how users will find information and navigate the site. The web site should be easy to use and informative. Whatever you design should be consistent - i.e. navigation buttons, links or guides should be featured in the same place on all pages for the site - and where graphics are used the same graphic should mean the same thing on each page.
Your home page should function as a table of contents with hypertext links to secondary menus for each of the major sections of your site. On each page, you should provide hypertext (text or image maps with hotspots) as links to allow the user to return to the appropriate secondary menus and the home page, as well as the previous and next pages in a series of pages. The title banners, titles, subtitles and other elements for each level should be designed to help orient the user within the overall structure.
No Dead End Pages
Pages at each level should provide links to the next and previous pages in a series of pages, as well as back up the hierarchical structure to appropriate contents menu(s) and home pages. Keep in mind that your viewer may access any page in your site via a link from virtually anywhere on the Internet. Make sure you provide the means to navigate the rest of your site. A browser's Back feature will not help in these situations because it simply returns the person to the page they just left.
Users should be able to return to your home page and to other major navigational points. Each page must have at least one link to another section of your site. No page in your site should be a dead end. If a user enters the page via a link from another page, they will need links to guide them. Without links to guide them, they will not be able to access other pages in your site. They may miss vital information or just become frustrated.
When you want to present a set of pages in a particular sequence, include links to the previous and next pages. Even if a user comes into these pages from a search, they will realize that the pages are in a specific order and will be able to follow the information in context and order. When selecting text, Back/Forward can be confusing. Previous/Next are better choices.
Use the following as a guide:
- Provide convenient user access - do not bury information.
- Make access easy for the visitor by using simplicity and consistency when designing your navigational components.
- Promote confidence in your site by verifying and validating as well as considering the esthetic effects.
- Get user feedback to help enhance your design.
- Provide access to your home and menu pages at all levels of the site.
|
