A PLAN FOR PLANNING A WEB SITE


So lets begin planning a web site. to help us we need a plan for planning! here is one that is guaranteed to work, if you stick to it. Here is a good plan to start with.


PLANNING A WEB SITE
1 PURPOSE

2 OBJECTIVES OR GOALS

3 DETERMINE MAIN TOPICS

4 PLAN ORGANIZATION/NAVIGATION

5 PLAN FOR VISUALS/SOUND

6 IDENTIFY POINTS OF INTERACTIVITY

7 STORYBOARD & DESIGN PAGES

8 PROGRAM EACH PAGE

9 TEST PROTOTYPE

10 REVISE

11 LOAD ONLINE & TEST

12 MAKE FINAL REVISIONS


Organizing your content
The first thing we must consider is how the content of the site is to be organized. This means that you must be very clear about what a student should gain from your site and how they will be able to do this when given certain information resources.

Purpose of the site
The first thing is to precisely know what the purpose of the site will be. You should be able to clearly state this in one or two sentences. If you can't do this or it takes a much longer description, then you may not be clear as to what your site will provide. You may also be trying to make the site do too much, a problem that can be remedied by creating more than one site and possibly linking them at certain points. Some of the things you will want to consider beside what content is to reside on your site is who the target audience will be; a certain class or a larger group of students, possibly linked by age, grade level, or maybe by needing specific skills. Knowing your audience will be an important bit of information throughout the design process, so be very clear about who the intended group of visitors will be. This doesn't mean that other students will not find your site interesting and useful, but you should have one group in mind to start.

Goals and objectives

As you were writing down you site purpose, you probably thought about, not only who will be accessing your site, but about what they should gain from it or be able to do once they have been there. All this means is that now you must go farther than simply specifying the purpose of the site, you need to define your goals or objectives. If you are a teacher, I don't need to say more, you can skip the next paragraph, if not, then let me tell you a bit about objectives.

Objectives, sometimes called behavioral objectives, are precise descriptions of what a student will gain from a particular instructional interaction. Just as I have described the objectives of each module of this course at the beginning of the module, you should be able to do the same with your web site. What is important is that you carefully spell out exactly what the student should gain and how they should gain it. Avoid vague descriptions such as "will appreciate", or "will understand" and replace these with statements that tell what the student will "do" or "find" or "list" using action verbs that describe how the student will demonstrate that learning has taken place. OK, OK, sometimes we can't be that definitive, but always keep in mind that clearness of objectives make it easy to tell if we have achieved our purpose. Be clear!

Always let your student know what the objectives of a particular site may be because most students are reasonably discriminating and they need to know if the site will provide what they are looking for or what it should allow them to do at the end. You may not always want to spell the objectives out in such formal terms, especially for younger children, but you can always tell them less formally what they are going to learn about or be able to do when they complete the lesson.

Two-way interaction is very difficult, so it will be very hard to tell if students have achieved your objectives. In this case, you may want to build in some self checking mechanism that students can use to self-evaluate their progress and learning. For instance, you might ask students to do things like define, describe, list, give examples etc., and then provide them with the criteria to check themselves. It isn't perfect, but it allows some reasonable progress checking.

Use the structure of the content to structure the site
Now we get down to the real core of the structuring task, that of building a site structure that fits the content to be included. Carefully think through the content to be included in your site, and first determine if it has a structure of it's own. This can best be done by identifying all of the main topics you wish to cover. List them roughly in the order you would like your visitor to encounter them. Many times the content is so logically structured that it stands out clearly. An example can be seen in a lesson on the causes of the Revolutionary War. Even though, since it is a historical topic, one would expect the structure to be linear and chronological, it really isn't, but rather divided into economic, social, and political concepts. In this case, it may be best divided into three modules or pages, each which come together into a chronology (fourth page) of events and results. When you are evaluating any potential topic examine it carefully for any inherent structure and if none seems apparent, then look for a hierarchical, chronological structure. If nothing seems obvious, then possibly some type of random structure may be the best in that it allows students to explore and set their own structure. One last word, however, while a structure may not be readily apparent, one may evolve during the creation of the site, necessitating a last minute redesign. Try to avoid this happening by good planning up front.

Time to start planning
Now is probably a good time to sit down and carefully describe what the purpose of your first site will be. Take some time now and write it out.

Now that you have a purpose firmly in mind, why don't you think about your topic and objectives and identify the main points to be covered. Try to find or organize a working structure for your site. If it helps, sketch out a rough idea of the structure.

Come back here when you are done.


PLANNING YOUR STUDENT'S BROWSING
The links within your site do more than just get visitors from one page to another, they tie it together and form the glue that holds together the various parts, concepts, or topics. Even though each site is really a collection of pages, they should seem to be one big page that can be easily accessed. Good navigation makes this possible.

Navigation

The activation of URL's for each page should be seamless, that is, the visitor should be reasonably unaware that different pages are being linked, only that they are moving around based on a logical plan or logical choices they have made. Good navigation makes it easy for students to quickly gain information from the site and move around in a comfortable manner.

Links should be clear and obvious

The "hot" text links should be descriptive and other activators should be easily recognized, but most importantly, the logic and organization behind each link should be sound. A simple click should take the visitor to the appropriate page, location on a page, or external site. At that location a return link should always be provided, using the browser's "Back" function at external sites. on the other hand, users can only go where you allow them to, so provide links only to those locations you want them to access at a particular time. For instance, if you do not wish students to access an advanced level diagram until after they have read some descriptive information, place the link at the bottom of the page or on a later page that can only be accessed through the information page.

Program control

The very nature of web browsing is that of user control over where they go or don't go, and the order in which the pages are visited. You pretty much have to accept this and use it to a creative advantage because students can develop unique, new views of the information presented. Sometimes, however, you as the instructor/designer need to exert some control over the the student's path or sequence through the site, if only to make it more meaningful to them. In these cases, you can make decisions about when or where to allow students to link to certain locations or make returns from specified locations. To determine if you need to do this, simply "walk" through the site as if you were a student and decide if there are links that should or should not be available at each page or location. Remember, you are the person who can offer specific options at specified times and places.

Options and supplemental materials

One useful ability of a web site is to make available to students a wide variety of resources such as glossaries, pictures, indexes, or maps of the site. each of these can reside on a different pages, accessed by a link from any page in the site. If you decide to do this remember that the appropriate access button and return must be provided. While providing these types of resources on-line is the most obvious, don't forget that they can also be provided as part of a hardcopy courseware packet. This may not seem as "high tech", but it may be just as useful (or even more so) particularly if a lot of links to access them would be required. Remember, "Whatever gets the job done!"

External links to some sites may also provide important resources, just be cautious that the student doesn't become lost in navigation. Again, the "Back" button will be all that is needed. You may also find a great deal of information available on other types of media that can be incorporated into your instruction, but are not part of the web site. things like CD-ROM's and video tapes can provide material that would be prohibitive to place on your site, either for copyright reasons or for sheer size of the information files. Get into the mode of thinking about your site as only part of the instructional package, serving as a base or control center for other types of instruction and instructional materials.

Attention, aesthetics, and motivation
There are several other factors to be considered in organizing an effective web site. Often overlooked, is an understanding of how the visitor browses the site and the role of attention and motivation in learning from web based instruction.

When students browse a web site they do it in ways different from using a text book. First, browsing has evolved as a more cursory type of interaction in which individuals read less, link more and more frequently, and rely more on visualization. It is also a medium where the userŐs attention is redirected frequently and where interest can be lost easily, probably due to competing information. To provide instruction under these conditions, we must be particularly concerned with organizing the information presented in ways that it can be quickly and efficiently browsed and the important points identified and learned. Of course, all of this doesn't mean that we should make web learning a superficial process, but it does tell us that we need to be aware of this as we plan any site because it will have an effect; Students are becoming used to this type of web interaction.

The first thing a designer should be cognizant of is getting and holding the student's attention. We attend to things that draw our interest, seem different, look attractive, and provide us with, or at least, promise us information, For these reasons, the initial visual impact of a web site is critical. We want students to notice it, to become intrigued with it and to want to see more of it.

Aesthetic appeal is very important to this process. It may seem simple, but it is a major consideration for any site that it be attractive, appealing to look at and thereby attention gaining. What this means to the designer is that first off, the pages must look good. They should include some form of attention gaining visual and have an aesthetically appealing layout of text. the colors used should be bright and interesting and the overall "feel" should be coordinated as a unit. Suffice it to say, good design dictates against awkward layouts and dissonant color combinations. Of course, there is more to attention than simple visual or aesthetic appeal, but the initial attention of the student is usually achieved through visual means.

Research on attention and motivation has shown that, while visual appeal is important for initial gaining of attention, it is not enough to lock it in and hold attention for longer periods of time. For this to occur, we must provide more meaningful, interest-gaining and maintaining stimuli. For instance, we could incorporate visuals or text that portray a paradox, mystery, unique question or problem, that will stimulate the visitor's curiosity. There is much more to motivating the learner, but the first step is gaining and holding the user's attention. Once that is done, the lesson content should be presented in such a way as to maintain interest.

Clarity and convenience

A well designed web site will make it easy for the student to interact with and to find the needed information. A site that is difficult or inconvenient to use will usually be passed over quickly. Students who cannot find things become easily frustrated and don't give the site the attention desired.

First and foremost in building a convenient site is making it logical. Most of us, students included are pretty savvy in figuring things out, but that all takes time and if options are not obvious and accessible in ways we are used to, we all tend to skip them or look elsewhere. Put buttons or menus where they can be easily seen and organize your text in a logical manner. Don't force visitors to look all over just to figure things out.

Number of pages and logic of organization

Novice web site designers tend to place everything into one page, erroneously thinking that one page is simpler to construct than many. This type of planning almost inevitably results in a huge, disorganized page that is much harder to design and construct than a number of smaller pages, carefully organized and inter-linked. A web site can consist of almost any number of pages (the amount of space they take up on the server is almost negligible). The following diagram compares navigation within a single page site with the links in a multi-page site.

[ Image ]

By creating several pages, you can break down the task into smaller units while, at the same time, modularizing the jobs into manageable blocks which often work better, on-line. As you think through the main topics of your site and organize the content, plan on dedicating single pages to each of the conceptual units or main points. not only does this make the planning process easier, but it makes for a much better, more logically organized site. Then, well thought out navigation links will tie all of the parts together in a seamless site. Plan on as many pages as the logic and content of your site suggest; donŐt be afraid to create a number of pages!

Back to work
This section should have raised a lot of questions in your mind. Now is the time to answer them! Think through each of the points raised and describe, to yourself, just how they should look or work in your site. Answer these questions on paper so that as you build a site map and storyboard in the next sections, you can design the site effectively.

Come back to the lession when you are done.


DEVELOPING THE SITE MAP

If all of this planning is starting to make your head swim, don't feel alone, it is a complex business. Web site designers are people too and they don't try to keep all of this floating around in their heads. The first thing you should do as you begin to think through your site and answer some of the questions raised here is to put it all down on paper. In fact, the paper planning of a site is the most important step in the entire process because that is where the real content of a site is brought together. Programming is more or less just the process of building pages from the "blueprints" created here. Another good reason for "paper planning" is because changes or mistakes made here can be easily made with the stroke of a pencil, they don't require lots of valuable computer programming time to correct.

The first document of this process is the "Site Map" which is just that, a map of your site showing each page and the "roads" or links which join them. A site map is akin to a computer flowchart, but much easier to create and comprehend. The site map shows the overall structure of your site as well as the relationships between each page in it. What it does not show is the content of each page; that is for another planning document called a storyboard which will be described a bit later.

Show organization of the site

If your site is organized hierarchically or chronologically you can easily represent that in the sitemap. In fact, any structure can be represented here, all you need to do is create a separate page for each of the major conceptual units that comprise the content you will be presenting. Once that is done, simply link the pages in the way you have conceptualized someone navigating among them. When you do this, you will have a graphical representation of the entire site which shows the main components and the relationships among them. One tip, if the site includes a page or link, it must be shown in the sitemap.

Show navigation and external links

Be especially careful to show all navigation links and to remember to indicate which ones are two-way. Every button or hot text link must be accounted for. Of course, your site map should show all of the external links that you plan to make accessible to your visitors. This will speed things up when you begin designing the pages because you will have an accurate list of the sites and their URL's which can simply be inserted at the appropriate places. Remember that it is often a good idea to place external links near the end of the page or site. In this way, visitors will have interacted with more of the page or site before they leave to visit another site. Also, before they depart for an external site, remind them to use the back button to return, eliminating possible confusion or "getting lost".

Be sure all of your external links work! Do this by visiting them to make sure they are functional. Sometimes websites are changed and there is no way of easily notifying people except to post a notice at the old address. Additionally, check out the content of the site to be sure that it is still the same as when you last visited it and is still appropriate for you instructional needs.

Now its time for you to do it

The only thing that remains to be done about a site map now is to actually do it, and in this case that is easier done than said. Since you will only need to draw some squares or rectangles and lines, all you need is a ruler, but a small rectangular template will make the job even easier. I like to use an old 2x2 photographic slide with the film punched out. This gives you a reasonably small rectangle, but large enough to write in URL's and other notes while keeping the overall map size to a written page.

Of course you can use any of a variety of graphics or drawing programs available for use on your computer; many of them are free or are shareware, and all do an excellent job. They all produce a neat product that is easily modified, but they may take a bit of learning to master the application. I still like the good old pencil and template.

After you designate the pages, draw in the links between them using straight lines. I usually show a single directional link with an arrowhead at the destination end and a two-directional link with arrows at both ends. You may want to indicate external links by an arrow going off to the side with the URL at the end. When you are done, mentally "walk through" the site as if you were a visitor following each link, both ways to make sure no one will get lost and to insure that all of the needed links are there. Remember, this map is a literal depiction of your site, show everything that is in it, and don't add anything that will not be in it. This map should show anyone exactly what the structure, pages and links are in your site. A sample site map is shown here.

[ Image ]

One nice thing about creating the site map on paper instead of on the fly is that it can be tested out and changed with little effort. Now is a good time for you to sit down and begin to plan your site. get the necessary tools and try laying out a site map for the site you have been working on so far.