Human Factors Standards for the Design of Online Syllabi

 

Andrea L. Buuck, Neil Dishman, Sean Hanrahan,

Jennifer Oser, Melanie Perry, M. Paava Stults, and

John H. Krantz

Hanover College


Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

Introduction and Goals

Computers are becoming a staple of the American classroom. Nearly every student at every university and college now has access to a computer. As a result, communication between students and faculty via computer is becoming increasing popular (Quigley 1994). Likewise, computer resources and online syllabi are being used at an increasing rate. Because of the demand for online syllabi, and the confusion over what style of syllabi would be best for the average student, our Human Factors class at Hanover College has created a standard syllabus that can serve as a model for all online syllabi. This syllabus has been created with current scientific research in mind.

The goals of the standard syllabus are threefold. First, we have created a syllabus to give educators a sample, universal syllabus to incorporate into their classrooms. Many educators do not know where to start when creating a syllabus or they may design syllabi according to their whims. Hopefully, this soundly-based syllabus will serve as a standard. Our second goal for the standard syllabus is to let it function as a site for preliminary course information along with daily activities and learning aids in a way that is quick, easy, and user friendly. Judith Grunnert, author of The Course Syllabus: A Learning Centered Approach, says that syllabi are shifting to become more "learning centered" (Grunnert, 1997). Our goal is to accommodate this shift by creating a syllabus that provides tools that will be helpful to the course such a links to resources, tutorials, and forums. This goal closely follows our third goal, which is to provide a way for students and professors to interact with each other and other experts in the discipline. By closely following these three goals, the standard syllabus will be useful and productive for all students and faculty.

 
Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

 

Special Features

Our model syllabus was created with the user in mind; therefore, the syllabus contains many features that the user can easily access. The basic features are common to traditional syllabi, such as schedules and grading policies. Unlike a traditional syllabus though, this model syllabus contains many other features that can only be provided online and is meant not only for students in the class but also students who are considering to take the class. Therefore, the standard syllabus is important throughout the year and not just when the class is in session.

At the top of the page, the syllabus contains the basic information about the course, such as the instructor’s name and telephone number. The user has the option of going into detail about the specifics of the class from the left menu.

The left frame contains most of the rest of the class information on the menu. It includes several items such as the schedule and assignment. When accessing this information, the user will find the date and its corresponding lecture, discussion and/or assignment. Links to other resources and tutorials are also possible from here. The course objectives are located under the assignments along with the course policy, which could include the section on grading along with it. Next, the materials section is designed to be a general area to account for the different materials and the text the class follows. Additionally, a link to the professor’s e-mail is available on the menu to provide a fast way to contact the professor. Hitting a hypertext link to the e-mail at the top on the banner frame may also access this option.

Once the class has progressed and students are aware of how the class functions, the syllabus needs to serve a different purpose; supplementing the class. Therefore, several features are on the model syllabus to accommodate this new demand. First, students will see the announcement section on the largest frame of the syllabus every time they access the site. The announcement section will allow students to be easily updated on new happenings in class. Professors often refer to the announcement section as the most important part of the syllabus. Likewise, to keep in line with our goal of making the online syllabus a place of learning, a discussion section is also featured within the menu. This option allows students to talk about issues in class and discuss homework. This option is important because it can be used to keep students coming back to the syllabus and thus seeing the other essential items such as class announcements. Lastly, there is a resource icon located near the top of the large scrolling frame on the bottom right. This icon allows students to have a direct link to the class resources such as sites on the web. When the icon is hit, a separate page will come up revealing the resources. Consequently, students can easily access the resources without having to search for them under a multitude of other options.


Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

Navigation

 Frames
One of the most basic questions that comes into play when designing a web site is whether or not to use frames, which divide the online syllabus into multiple sections thus allowing users to view several windows of a site at the same time. When we surveyed several students and faculty, it became evident that frames are well-regarded as a way to present information as long as there are not too many frames on a site and the frames are uncluttered. Too may frames cause confusion, primarily from packed information. In 1995, Hannafin and Sullivan found that high school students preferred computer instruction programs that were frame-based instead of programs which required long scrolling due to no frames. Students reported that they liked the additional control that they had to skip through information that they did not want. Scrolling programs did not offer this control. Essentially, frames helped the students to pick information that was relevant to them.

There are many other advantages to using frames as well. According to a tutorial on frames created by the Netscape Corporation, frames allow the designer to present information in a flexible and useful fashion. Additionally, frames allow us to provide static areas that remain fixed as people visit various portions of the site. Moreover, each frame can be given an individual URL; therefore, it can load information independent of the other frames on the page. In addition, frames can be given a name, allowing them to be targeted by other URLs. A user can access the individual frames by themselves without the rest of the frames. For these reasons, we recommend that web-based syllabi should use frames as ours does.

There are a few disadvantages to using frames. Not all people prefer frames. Therefore, our syllabus includes a no-frames version that can easily be accessed when the user first gets on the page. A few other problems could occur as well. Frames can be used ineffectively so that the page is cut up into too small segments, thus not allowing the user to search the page well. This problem can be avoided by following a few suggestions from Bremser (1997) and Kadanoff (1996). First, frame layouts should be kept simple. In addition, no more than three frames should be presented on a screen at any one time. The table of contents should be easily located and salient. Finally, only one window should be scrollable at any one time. All of these principles have been considered on the design of the standard syllabus we have assembled.

The model syllabus that we have configured has three frames to reflect the research that we have gathered. One frame rests on the top of the page and spans the entire width. Another frame is on the bottom left and the third frame, which is the largest, is on the bottom right. Refer to Figure 1.

Figure 1. The model syllabus
 
Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

Spatial Organization

When formatting a web site, spatial organization must be seriously considered because better organization facilitates better searching. Research by Coll and Wingertsman (1990) shows that when interfaces are either too simple or too complex user performance decreases. A good syllabus will be moderately complex, as is the syllabus we have designed. Additional research suggests that spatial organization needs to be consistent throughout he interface. On the standard syllabus, the format stays consistent in that the page looks the same and only the large information box changes. In other words, there is not crowding onto one side of the syllabus and spacing is evenly distributed.

Our knowledge of spatial organization also has been generated from user feedback. Students from Hanover College who reviewed different online syllabi concluded that web pages are easier to read if they are symmetrical, are at least somewhat balanced, and have limited dead space. Various students responded by saying that frames should include clearly defined borders between them to make work easier. When asked about scrolling, and information within the frames, many students suggested that only one frame should have information change within it (in other words, only one frame should scroll). We responded by keeping the top frame, the banner, and the left frame both constant and static. Nevertheless, the right frame can be scrolled down.

 
Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

Menu Design and Scrolling

Equally important to frames and spatial organization is menu design. These considerations are all closely related, along with scrolling. Much research has been done on menu design. The creation of a menu within a site should be considered with the user’s task or goal in mind, according to McDonald, Dayton, and McDonald (1988). Because the goal of the student will be to find information as quickly as possible, menus should be designed for fast recognition.

For faster search, it is better if the depth of the menus is limited (Gilliand & Schmitt, 1993; Sisson, Parkinson, & Snowberry 1986). Likewise, Carey, Mizzi, and Lindstrom note that sub-menus can confuse the user, especially a novice (1996). Additionally, users can get lost when doing a menu search. If the navigation does not include options to easily orient the user, much confusion is inevitable. Therefore, broad menus should be seriously considered because of the simultaneous searching that they allow. Essentially, the table of contents on the model syllabus is a menu. It is broad and has no sub-levels.

Faster search is also possible by designing manus to have several other characteristics. Research shows that vertical menus are better than horizontal ones. Additionally, Walker suggests that borders around menus are also important so that the eye can focus on the options better (Walker, Smelcer, & Nilson, 1991). Menus should have meaningful and descriptive option names so that they are retained and recognized more easily (Smelcher, & Walker, 1993). All options are distinct and clear on the model syllabus. They are also clear so that they conform to the research by Coll in 1990 which suggests that clarity decreases search times. Options in menus should also be organized functionally. The most used items should be listed at the top (Halgren, & Cooke 1993). (The process of putting options in their most functional place is described in more detail in the section about placement.) Lastly, searching is greatly enhanced by highlighting the menu options after they are selected. The purpose of this suggestion, based on research done by Fisher in 1989, stems from the knowledge that by highlighting the options that have been selected, users will know where they have already been and can make faster decisions about where they need to go next (Fisher, Coury, Tengs, & Duffy, 1989).

Because of the great number of factors that are involved with searching for information on a syllabus, it is wise to have many different avenues for searching. In our model syllabus there are many different ways to approach the search. First, a frames or no frames version can be selected. Additionally, the user can either click on a menu option or, if desired, scroll down without using the menu. Research by Elkerton in 1984, Van Hoe in 1990, Girill in 1992, and Hall in 1995 all point to the fact that sites need to have various ways to navigate and find information because of the different personality types of the user, the experience of the user, file length, target type, and window size (Elkerton & Williges, 1984; Van Hoe, Poueye, Vandierendonck, & deSoete, 1990; Girill & Luk, 1992; Hall & Bescos, 1995). Elkerton suggests that web sites should become adaptive interfaces that alter according to the user's style. In the model syllabus, all of these variables were considered in the design and thus there are different ways to approach a search.

Scrolling is another important option to consider when designing a syllabus. Research shows that scrolling is not favorable over windowing, paging, and various other types of navigation (Bury, Boyle, Evey, & Neal, 1982; Beard & Walker, 1990). Scrolling may mislead novice users who do not realize that the menu needs to be scrolled down. Therefore, they miss the rest of the menu that is hidden. Using a menu is faster than scrolling mainly because users frequently lose their place when they are scrolling and often have a difficult time finding their place (Brooke & Duncan, 1983). Nevertheless, some people like to scroll. Therefore, the model menu has a combined menu-scrolling system that reduces the negative effects of scrolling.

Unfortunately, there is a conflict between the menu and the scrolling. Broad menus are favorable to keep the number of submenus small or non-existent; however, a broad menu may necessitate scrolling when there is a limited amount of space for the menu, as there is on the model syllabus. To keep the effects of this problem minimal, the options on the menu are as general as possible to keep the number of options low. This seems to be especially important when small screens are considered, which tend to add scrolling to make up for the lost space. On the model syllabus, the number of options has been reduced to nine (excluding the "etc." option, which is unnecessary).

Several students and staff were surveyed to see if the model syllabus was better than other types of online syllabi in terms of the frames, menus, scrolling and amount of information. Four different syllabi prototypes were presented: one with scrolling only, one with only a hierarchical menu system, the Human Factors course syllabus at Hanover College, and the Sensation and Perception online syllabus at Hanover College (Krantz, 1998). Those surveyed were asked to rank the syllabi from best to worst and then explain their choices. The Sensation and Perception Page consistently received the highest rankings. Those surveyed like the syllabus' frame layout, menu, and scrolling. This general favor for the Sensation and Perception syllabus contributed to the similar deign of our standard online syllabus. On the other hand, the necessity to scroll down the menu on the left frame was not favored, neither was the dark color. Therefore, we have improved on the Sensation and Perception Page. The syllabus from the Human Factors course was liked for its lack of scrolling; however, it was consistently criticized for its crowded appearance due to too many frames. It was interesting to note that some people rated the scrolling-only syllabus and the menu-only syllabus high due to their simplicity. Nevertheless, they were both highly criticized as well. The reasons behind this seem to be due to user preference.


Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

Appearance

 

Color and Contrast

The model syllabus is colored according to the guidelines set forth by current research. We wanted the colors to maximize the user’s ability to search the page with the least amount of visual strain. The human eye is able to perform much faster if the color and contrast is set up within the capabilities of the human eye.

Colors on the online syllabus must have the appropriate contrast ratio. Hoffman and Kenneth noted that "when picking colors to represent diverse information select colors that are as different as possible from each other." (Hoffman & Kenneth 1990) The reason behind this is that similar colors do not allow the eye to see fine details very well. As a result, attention is decreased. Additionally, science tells us that a minimum contrast ratio of 3 to 1 or 4 to 1 has the best effects (Krantz, Silverstein, & Yeh 1992).

Colors such as blue and yellow provide the best contrast. On the model syllabus the background is a basic black and white which provides the best contrast.

When choosing the colors of the site, it is important to start by picking the colors of the entire scheme before choosing the colors of the individual elements. This order of planning will help to prevent inappropriate contrast. The number of colors should be kept at a minimum, around five or six, to prevent cluttering. Bright colors are best to use for primary tasks due to their luminance and their ability to attract attention. Dark colors are more appropriate for the background and secondary tasks so that they will not disturb the focus on the primary task. The model syllabus has been restrained to about three colors.

It is good to note that the appearance of the model syllabus is merely a prototype and therefore instructors can add designs and different colors to the site to make it more desirable to look at. Pictures and graphics are encouraged, as long as they do not clutter up the page. Coll found in 1990 that cluttering up the screen would decrease user performance.

 
Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

Placement of options

The placement of elements on the syllabus should enable the user to spot information quickly and transfer from one syllabus component to another with ease while minimizing the time of transition. In order to do this, we have made use of the process of link-analysis, which is a study of the importance of display elements, percentage of time spent using each element, and the sequences in which the elements are viewed. Based on the results of a link-analysis, one can place the elements in the most effective areas for users to access them.

In order to determine the data needed for the link-analysis we asked several students and faculty members to comment on how the needs of the user can be met best and what they felt were the most important items on an online syllabus. While students generally remarked that they most often use the syllabus to look at assignments and the schedule, professors noted that general information on a syllabus is very important as well so students can easily determine the policies of the professor. In response to this information, we decided to place the most general and important information on the top banner, which we decided was the course name and number, the meeting times, and the professor’s name and location. The announcement section was determined to be very important as well; therefore, it was placed at the top of the scrolling frame to be seen every time the syllabus is accessed.

Determining the sequence of the elements that students would use was a priority in determining the placement of the menu options. Based on the information that students often go to the schedule after they see the announcements, we decided to place the schedule close to the top of the menu near the announcements. The rest of the information on the syllabus has been placed according to the results of what we found were the items most likely to be used. Similarity between elements was also a deciding factor of where items should go. For example, because the meeting times information is directly related to where the class will be located, and a student may want both pieces of information at the same time, these two items have been placed together.

 
Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

 

Conclusion

The design of a syllabus is not a science and should be done with flexibility and careful consideration of the task. The number of factors that go into a syllabus are very great; therefore the model we have created should serve merely as a guideline and resource for the construction of syllabi.

Nevertheless, the model syllabus is a universal sample that educators can use for any discipline. By having such a standard syllabus, educators can now effectively use a course site to help supplement their classroom. Additionally, the syllabus helps to assure that communication between educators and students continues to be effective through the course of the computer age.

The model syllabus provides course information and learning aids quickly and in a user friendly way. Options are clear and distinct. Primary information is easily accessed for the student and the prospective student who is looking into the class. Likewise, the syllabus is a link to many resources on the web. It provides a resource that can not be done on paper quite as easily. Moreover, the site provides a new way for communication to transpire between the student and teacher, other students, and possibly experts in the field. Because the syllabus is structured with the aid of research and scientific principles, it can be a soundly based component of the classroom. Moreover, because the model has been created with the user and his/ her task in mind, and several students and faculty have been consulted in the production of the syllabus, the finished product has been shown to be user-friendly as well.



Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References

 

References

    Arend, U., Muthig, K.P., & Wandmacher, J. (1987). Evidence for global feature superiority in menu selection by icons. Behavior & Information Technology, 6, 411-426.

    Baecker, R. M. & Buxton, W. A. S., ed. (1987). Readings in Human- Computer Interaction. Morgan Kauffman Publishing: San Mateo, California. P. 304.

    Beard, D. V., & Walker, J. Q. (1990). Navigational techniques to improve the
display of large two-dimensional spaces. Behavior & Information Technology, 451-466.

    Bremser, W. (1997). Making frames fit- Used with care, frames can strengthen your pages. Internet World, 8, 90-92.
 
    Brooke, J. B., & Duncan, K. D. (1983). A comparison of hierarchically paged and
scrolling displays for fault finding. Ergonomics, 26, 465-477.

    Bury, K. F., Boyle, J. M., Evey, R. J., & Neal, A. S. (1982). Windowing versus
scrolling on a visual display terminal. Human Factors, 24, 385-394.

    Carey, J. M., Mizzi, P. J., & Lindstrom, L. C. (1996). Pull-down verses traditional menu types: An empirical comparison. Behavior & Information Technology, 15, 84-95.

    Coll, R., & Wingertsman, J. C.(1990). The effect of screen complexity on user preference and performance. International Journal of Human-Computer Interaction, 2, 255-265.

    Elkerton, J., & Williges, R. C. (1984). Information retrieval strategies in a file-search environment. Human Factors, 26, 171-184.

    Fenton, D. M. (1987). Computer menu design: An investigation of the interface between user characteristics and menu structure. Australian-Psychologist, 22, 233-243.

    Fisher, D. L., Coury, B. G., Tengs, T. O., & Duffy, S. A. (1989). Minimizing the time to search visual displays: The role of highlighting. Human Factors, 31, 167-182.

    Gilliand, S. W., & Schmitt, N. (1993). Information redundancy and decision behavior: A process tracing investigation. Organizational Behavior & Human Decision Processes, 54, 157-180.

    Girill, T. R., & Luk, C. H. (1992). Hierarchical search support for the hypertext on-line documentation. International Journal of Man-Machine Studies, 36, 571-585.

    Gray, S. H. (1988). Sequence control menus and CAI: A follow-up study. Journal of Computer-Based Instruction, 15, 57-60.

    Grunnert, J. (1997). The Course Syllabus: A Learning-Centered Approach. Jaffery, NH: Anker Publishing.

    Halgren, S. L., & Cooke, N. J. (1993). Towards ecological validity in menu research. International Journal of Man-Machine Studies, 39, 51-70.

    Hall, L. E., & Bescos, X. (1995). Menu- -what menu? Interacting with Computers, 7, 383-394.

    Hannafin, R. D. & Sullivan, H. J. (1995). Learner control in full and lean CAI programs. Educational Technology Research & Development, 43, 19-30.

    Hoffman, K. (1990). Computer Graphics Application. Belmont California: Wadsworth Company.

    Kadanoff, M. (1996). Move over Mensa. Marketing Computers, 16, 54.

    Krantz, J. H. (1998). Human Factors, Psychology 330, Spring 1998 

    Krantz, J. H. (1998). PSY 331: Sensation and Perception [Online]. Available: http://psychlabl.hanover.edu/classes/psy331.html

    Krantz, J. H., Silverstein, L. D., & Yeh, Y. (1992). Visibility of transmissive liquid crystal displays under dynamic lighting conditions. Human Factors, 34, 615-632.

    Lee, E., MacGregor, J., Lam, N. (1986). Keyword-menu retrieval: An effective alternative to menu indexes. Ergonomics, 29, 115-130.

    MacGregor, J. N. (1992). A comparison of the effects of icons and descriptors in videotex menu retrieval. International Journal of Man-Machine Studies, 37, 767-777.

    McDonald, J. E., Dayton, T., & McDonald, D. H. (1988). Adapting menu layout to tasks. International Journal of Man-Machine Studies, 28, 417-435.

    Mehlenbacher, B., Duffy, T. M., & Palmer, J. (1989). Finding information on a menu: Linking menu organization to the user’s goals. Human- Computer Interaction, 4, 231-251.

    Netscape Communications Corporation. (1998). Frames: An introduction [Online]. Available: http://home.netscape.com/assist/net_sites/frames.html

    Norman, K. L., & Chin, J. P. (1989). The menu metaphor: Food for thought. Behavior and Information Technology, 8, 125-134.

    Parkinson, S. R., Sisson, N., Snowberry, K. (1985). Organization of broad computer menu displays. International Journal of Man-Machine Studies, 23, 689-687.

    Quigley, D. (1994). The evolution of the online syllabus. Computers and Composition, 11, 165-172.

    Schwartz, J. P., & Norman, K. L. (1986). The importance of item distinctiveness on performance using a menu selection system. Behavior and Information Technology, 5, 173-182.

    Schwarz, E., Beldie, I. P., & Pastoor, S. (1983). A comparison of paging and scrolling for changing screen contents by inexperienced users. Human Factors, 25, 279-282.

    Seppaelae, P., & Salvendy, G. (1985). Impact of menu hierarchy on performance effectiveness in a supervisory task: Computerized flexible manufacturing system. Human Factors, 27, 713-722.

    Sisson, N., Parkinson, S. R., & Snowberry, K. (1986). Considerations of menu structure and communication rate for the design of computer menu displays. International Journal of Man-Machine Studies, 25, 479-489.

    Smelcher, J. B., & Walker, N. (1993). Transfer of knowledge across computer command menus. International Journal of Human-Computer Interaction, 5, 147-165.

    Vandierendonck, A., Van Hoe, R., deSoete, G. (1988). Menu search as a function of the menu organization, categorization, and experience. Acta Psychologica, 69, 231-248.

    Van Hoe, R., Poueye, K., Vandierendonck, A., & deSoete, G. (1990). Some effects of menu characteristics and user personality on performance with menu-driven interfaces. Behavior and Information Technology, 9, 17-29.

    Walker, N., Smelcer, J. B., & Nilsen, E. (1991). Optimizing speed and accuracy of menu selection: A comparison of walking and pull-down menus. International Journal of Man-Machine Studies, 35, 871-890.

 


Table of Contents: Title....Introduction and Goals....Special Features....Navigation....Spatial Organization...
                                Menu Design....Appearance....Color and Contrast....Placement of Options....Conclusions....References