graddy.PDF 51 HIERARCHICAL MENU STRUCTURES AS TEACHING/LEARNING ENVIRONMENTS by Duane B. Graddy* Abstract Student-centered learning requires innovative pedagogical approaches for presenting ideas and materials that challenge learners to expand their depth of understanding. Hierarchical menu structures provide a self-contained pedagogical framework for focusing student attention on the subject matter of a course. Students can identify, clarify, and expand the course content quite easily within this frame of reference. The key to this approach is providing the student with a web interface that keeps them in the course environment as they navigate the specific lectures, assignments and projects. I. Introduction Maintaining the students' focus throughout a course in Economics is challenging to say the least. Students tend to wonder away from the material as the topics become more diverse and difficult. Using the Internet to supplement course materials may improve the results somewhat but even here students are pulled away from the course environment as they surf the Web for the answers to specific questions and assignments. Hierarchical menu structures are one way a teacher can create a self-contained course environment Students can use a hierarchical menu structure to maneuver through their course materials in an efficient and effective manner. Hierarchical menus can be designed for ease of use in identifying, learning, and researching course lectures, assignments, projects, and examinations. By using a hierarchical structure, students stay within the course interface while following the complex set of hyperlinks necessary to complete class assignments or projects. II. Pros and Cons of Hierarchical Menu Structures A hierarchical menu structure is an interactive menuing system that provides information in an outline format. Primary topics have a series of subordinate folders or child topics that contain hyperlinked material at every level.1 The outline can be as simple or as detailed as the instructor deems necessary for the particular course being taught. An entire course can be integrated into the hierarchical menu. Restructuring a course in this way has both advantages and disadvantages. The hierarchical menu structure is advantageous to students in several ways. 1. Having nested groups of topics facilitates previewing, studying and evaluating course materials. 2. Relating course material to external sources is simplified within the hierarchical structure. 3. Research assignments are easier for the students to follow when topics are listed in an outline format. 4. Student interest is enhanced by the system's ease of use and locational focus within the frame set. 5. The student stays in the course environment while working on assignments and projects. Nevertheless, using a hierarchical menu structure to present course materials is more time-consuming to implement than straight hyperlinking of web sources so the question arises whether it is worth the effort to develop such a system. Of course, I believe the answer to this query is yes. After the initial start-up, the system is relatively easy to expand and maintain. Another issue for the nonprogrammer, like myself, is that small scripting errors can become major Saturday projects. All in all, however, the advantages for the students outweigh the front-end and maintenance costs. * Professor of Economics and Finance, Middle Tennessee State University, Murfreesboro, TN 37132. Email: dgraddy@mtsu.edu 1 Jeff Frentzen and Henry Sobotka, JavaScript: Annotated Achieve, Berkeley, California, 1998, pp. 496- 497. 52 III. Example of a Hierarchical Menu System This section highlights some of the pedagogical aspects of a hierarchical menu system. I refer to this particular system as the course knowledge base. The design of this system includes material for four courses. The initial entry point for the course knowledge base is an icon for one folder. It is pretty unassuming to begin with but explodes to reveal an intricate menu of course materials and sources. The URL for this site is http://www.mtsu.edu/~dgraddy/Load-me.htm. The hierarchical menu has fourteen primary topics that constitute the knowledge base, or stated somewhat differently, establish the course environment. Clicking on any of these primary topics reveals a detailed structure of subtopics or subfolders that contain material useful for the courses. For example if a student was assigned a project that required use of Federal Reserve Board (BOG) statistical information, she/he could click on the primary topic, Policy and Regulation, and then go directly to the BOG Statistical Releases used in the course. An important aspect of this process is that the student doesn’t have to leave the course environment because within this frame set design the student has access to the complete hierarchical menu at all times unless the designer chooses to open a separate window. Coding in a second window may be advantageous at certain times for example when you want to access the knowledge base while using an on-line workbook or problem set. The advantage of the student being able to remain within the course environment or knowledge base can be illustrated by assuming that he/she is uncertain about the definition of one of the interest rates listed in the BOG release. Take for example the definition of the Federal Funds rate. Going to the left frame of the knowledge base, the student selects Financial Markets. The student then clicks on Financial Instruments and next selects the Money Markets subfolder. A list of money market instruments drops down. The student chooses federal funds. A description of federal funds appears in the right- hand frame. Another advantage of a hierarchical menu system is for organizing course materials. The instructor can provide a detailed outline of how the course material is organized so the student knows all of the resources 53 available at the inception of the course. Using the first course as an example note the hierarchical structure of the material. The initial groupings: course announcements, lectures and quizzes, searches, data for in-class, assignments, workbook, and library, establish the general outline for the instructional resources. Under each of these folders are sets of subordinate folders that contain hyperlinks to the specific course materials. Basic resources are listed first; the course syllabus, purpose, assignments, downloads, and an interactive question and answers page. Students can submit questions about the material anytime they desire. The Lectures and Quizzes folder houses much of the class resources. Included in this folder are the lectures for the course, a series of self- studying quizzes, review exercises called lecture vocabularies, interactive tests that are old exams from the course, and an other category for on-line handouts. The other three courses follow a similar format adding features unique to the particular subject matter. Consider the following hypothetical assignment as a way to illustrate the usefulness of the hierarchical menu approach to the course interface. This assignment relates to policy making at the Federal Reserve System and requires use of materials from the WWW. To begin with the student reads the an article entitled, Fed Hikes Rates by One Quarter, describing the Federal Reserves a decision to increase interest rates by 25 basis points. 1. The article mentions that "the FOMC raised its target on the Federal funds rate from 4.75 percent to 5 percent .. ." "The Fed also kept the discount rate at 4.75 percent .. ." Describe the structure and decision-making process of the FOMC. What is the Federal funds rate and what is its role as a Fed target? What is the Fed discount rate? Find historical data on the Federal funds and the discount rate for the years 1990 - 1999. 2. The article goes on to say "Changes in the Fed funds rate are typically matched by banks' prime rates, short-term interest rates on Treasury bills ...." Contrast the definition of the Federal funds rate (or federal funds) from question one to prime rates and Treasury bill rates. 3. "Fed chairman Alan Greenspan signaled the policy change in testimony to the Joint Economic Committee two weeks ago ..." Review this testimony and give your assessment of Greenspan's position. By the way, who is Alan Greenspan? Give a brief summary of his background. 4. Irwin Kellner, Chief Economist for CBS.MarketWatch.com stated " If you believe in the wealth effect -- and I do -- it is adding fuel to the fire ..." What is Kellner implying about the future state of the economy? The student might use the following process to complete the assignment within the hierarchical interface. a. Go to Policy and Regulation then to Federal Reserve System. Click on Open Market Operations. b. Click on FOMC in the Open Market article. c. Go to Federal Reserve System to Discount Window and click on Discount rate in the article. d. Go to Financial Markets to Money Markets to Federal Funds. 54 e. For the historical data go to Financial Markets to Money Market Rate. f. Go to Treasury Markets to Definitions to Treasury Financing. g. Go to Policy and Regulation to Federal Reserve Information to BOG Testimony. h. Go to Federal Reserve Information to FOMC Member to Alan Greenspan. i. Go to Class Material for Economics 321 to Searches to Yahoo enter "wealth effect" review the search result. IV. Folder Tree Script The hierarchical menu system used for the Course Knowledge Base is an adaptation of a JavaScript developed by Marcelino Martins. The script is a free download at http:// www.geocities.com/Paris/LeftBank/2178/index.html or from other sources such as JavaScript: Annotated Archives Code with Commentary by Jeff Frentzen and Henry Sobotkan, Osborne/Mc Graw-Hill, 1998. A copy of the script is included as an appendix to this paper. The Folder Tree script consists of three files plus a series of icons, which can be change if desired. 1. Load-me.htm is the frame-maker script. This is the file that contains all of the folder titles and hyperlinks to the information in the hierarchical menu. Load-me.htm creates a menu in outline format where each top-level heading has a series of subordinate topics. The tree is displayed in terms of eight GIF images.2 2. Basetree.htm is the frame that holds the hierarchical menu system. The hierarchical menu is displayed through several GIF files which contain the open and close folders, the document and link icons, the three line shapes -- vertical branch, bottom corner, and vertical with right branch -- that establish the tree/branch structure and blank for areas where no lines exist. 2 The components of the tree are part of a 1x2 table. The left cell encloses one more of the GIF files. The right cell contains the accompanying text derived from the string in generateTree(). Frentzen and Sobotka, p. 507. 55 Introduction To Knowledge Base


SITE KNOWLEDGE BASE

The Site Knowledge Base provides a core learning structure for the courses included in this web site. In this area you will find what you need to be successful in the courses; that is, if you use it wisely. This site is best viewed with Internet Explorer 4.0

3. Basefldr.htm is the file that makes up the initial target frame. The target frame holds the content that is identified in the hierarchical menu. V. Cookbook Approach to Constructing Folder-tree The following steps may help you construct your own hierarchical course menu system. 1. Go to the folder-tree web site at http://www.geocities.com/Paris/LeftBank/2178/foldertree.html or other script library and download the three basic files necessary to construct the hierarchical menu system. 2. Download all of the icons necessary to construct the exploding menu or choose some different icons for the basic folders. 3. Begin editing the Load-me.htm file to meet your course needs. (Keeping all of the copyright notices in the script.) One way to edit the script easily is to copy and paste it into a Word web page template at the HTML source level. Of course, many other editors are available so it is really a matter of personal preference. This page provides the framework for developing an outline for your particular course needs. New folders and subfolders can be added to facilitate the construction of almost any course environment. 4. Modify the basefldr.htm file to make your own entry page in the left frame. See the box below for a modified version of the basefldr.htm file. 5. Load all of the files to the server and give the usual permissions. Continue to expand and upgrade hierarchical menu by adding new folders, subordinate folders, and hyperlinks. 6. Maintain the hierarchical menu by correcting broken hyperlinks and eliminating outdated material. VI. Conclusions Exacting course requirements necessitate innovative approaches to the teaching/learning environment. Hierarchical menu structures provide a means of presenting all of a course’s resources in a compact system of folders and subfolders. The hierarchical menu outlines the entire course with each category or subcategory containing the material for that particular topic. Essentially the students work on specific lectures, assignments and projects within the context of the entire course. Developing a course knowledge base enhances the teaching/learning framework by providing a more complete interface for the students' to interact with. 56 For the nonprogrammer, the Folder-tree script is an effective way to develop a course hierarchical menu structure. The script is easy to adapt to different course environments and can be expanded to meet the needs of most courses. Folder-tree provides an effective framework for structuring course resources. References Burns, J. JavaScript Goodies, Indianapolis, Indiana, Macmillan Publishing, 1999. Frentzen, J. and H. Sobotka. JavaScript: Annotated Archives, Osborne/McGraw-Hill, Berkeley, California, 1998. Graddy, D. " Course Web Sites as Learning Environments for Economics Students", Journal of the Tennessee Economics Association, Fall 1998, v.3, no. 1, pp. 35-42. Holzschlag, M. Web by Design, SYBEX, San Francisco, California, 1998. Appendix Brief Comments on the FolderTree Script This section provides some brief comments about the FolderTree, Version 1 script. The reader will want to hyperlink to http://www.mtsu.edu/~dgraddy/Load-me.htm to view the FolderTree script. These comments about the script are in the context of the Course Knowledge Base discussed above. A complete annotated reference on the FolderTree script is presented in Frentzen and Sobotka, 1998. Note that the three levels of the hierarchical menu are represented by three variables that are declared by the generateTree function. Aux 1, aux2, and aux3 indicate the array level within the menu. For example in the Course Knowledge Base, Policy and Regulation represents a first level folder, the second is Financial Statutes, Policy Issues, and so forth. The aux1 folders are appended to the Knowledge Base folder. The string is aux1= appendChild(foldersTree, folderNode(“Policy and Regulation”)). Then the second level of the menu is aux2= appendChild(aux1, leafNode(“Financial Statutes”)). The appendChild () function adds new branches (arrays) to the foldersTree. The string for the first hyperlink in the Financial Statutes folder is appendChild(aux2, generateDocEntry(0, “USC Title 12: Banks and Banking”, “http://www.law.cornell.edu/uscode/12/”, “”)). The 0 or 1 entry in the string generateDocEntry() indicates whether the page will be displayed in the right-hand frame or a new window. Use of this feature depends on what the instructor is trying to accomplish with the hyperlink. For example, a student workbook is included in one of the courses. The workbook comes up as a separate window so the students can more easily maneuver back and forth from the workbook to the Knowledge Base and vice versa. The other two elements of the string are the link’s title and URL. The generateTree() function is triggered by the onLoad handler within the frameset code, onLoad= ‘intializeTree’. GenerateTree calls on the two array makers (tree branch creators) folderNode() and leafNode() to declare new branches for the hierarchical menu. Each of the branch creators generates a four member array with the last member being the folder’s name. The other three components are flags that track various aspects of the array. The first two flags indicate whether each node or folder is open (1) or closed (0). The third flag shows whether the branch contains subfolders (0) or documents (1). The appendChild() subroutine attaches new objects to the end of the foldersTree. The additions to the array can be from folderNode(), leafNode(), or generateDocEntry() depending on whether they are primary headings in the hierarchical menu, subheadings or linked documents. In the Course Knowledge Base all of the links are prefixed by http// ,even local documents, so they carry an anchor tag of 1.