Introduction

Document design

Navigation of hypermedia documents often confronts users with problems of disorientation, lost focus, cognitive overload and metaphor communication, and forces the student to deal with an unfamiliar environment (Dillion et al, 1992). Navigation around the Internet creates a situation where the traditional problems of disorientation are increased by the use of heterogeneous information types (which may or may not be appropriately presented).

Students are still educated mainly using linear texts with hierarchical indices and minimal cross-referencing. Moving to a network of related information may mean that information is mapped better to the topic domain. Students, however, have little or no concept of the scope and contents of the topic domain when they commence their studies, so a network should facilitate learning of interrelationships rather than provide the navigation mechanism needed for retrieval of information. It is worthy to note that hierarchical structures can, of course, have network structures within them. As the pool of information grows, the student can glean from these relations the structure of the topic area.

Many students find that the amount of information they are required to understand is overwhelming. The size and weight of books can quite often show the student what is expected from them and make their task seem daunting at times. Hypermedia allows the hiding of much of this detail at first, and can allow progressive revelation of new and related information as the students require it. Such a strategy may be detrimental in giving students a false sense of the total amount of knowledge they possess at any one stage of the course.

Pictures increase the amount of information that can be held in short term memory. Providing icons can help the user to identify the area they are currently browsing, the type of request, the age of information and the time it will take to download that information. Making buttons obvious in shape and purpose helps novice users identify that they are a 'trigger' for some action. Even in computing courses there are still numbers of students who are unfamiliar with the Internet. It seems common place that authors can use pictures as menus. However, this seems to be an idea based in games (which a WWW based resource is not) and some other WWW pages. Students often find this is an initial hurdle, which can be solved by making the area look raised like a button.

WWW capabilities such as Frames are helpful when they are used as a constant feature of the document. Possible uses are as message windows, navigation bars or tool bars. It is often better to make these windows borderless so that they do not look like separate areas of a document. It is rare that students would have come across a 'windowing' concept in documentation on anything but a computer, increasing the likelihood of unfamiliarity and disorientation.

Provision of back buttons to main menus can be confusing because the novice user often confuses back buttons in the document with the back button on the browser. Products such as Netscape Navigator 4 provide drop down back and forward buttons allowing the user to change documents by selecting from a list. To this end documents should be named properly with a title tag so that a sensible name appears in the list box (as well as ensuring that information is listed correctly in any search engines).

Content

Goal-oriented content helps students both motivationally and navigationally (Rada, 1991). Students tend to focus on the tasks they are assigned. To this end they tend to navigate and understand better when information presented is related to the tasks they undertake. If information is presented in a work/task oriented manner it will be more likely to be found when needed by less able students than information structured in a concept-oriented network.

Links to related sites should be provided if applicable. Where information can be obtained at another site, link to that information (if the author permits) to allow students to get into the habit of looking for additional information in the Web.

Presentation of varying media types should be carefully considered when using the myriad of different packages available. Many of these formats require plug-ins which, in addition to being available on the local network, should be available for download when students connect from home. Detailed instructions should be provided on how to set up these components, even if their installation is straightforward.

Development Tools

Different browsers should be considered when creating Web documents. Use of HTML specific to a certain browser (such as Marquees in Internet Explorer) may mean that important information stored in them is unreadable in anything but Internet Explorer. As software production companies regularly go outside of the HTML 3.0 specification and rarely collaborate in doing so, it is unwise to use their special tags.

People tend to work best with interactive documents. Presenting a set of HTML documents with no feedback mechanism and no way of making comment about the content of the document reduces the engagement with the material. In order to produce documents which people can contribute to, CGI scripts can be used for feedback (such as at this example Anonymous Feedback Page) and annotations to documents.

If documents need to be created for multiple subjects, a portable template should be used. CGI programs can provide much of this, and teamed with server side includes and in-document environment variables (such as in Web servers like Apache 1.2) documents can be customized for a subject with relatively few changes to the document source. The sets of Web pages at Monash University's SFT2200, SFT3200 and SFT1101 are produced from the same template, which takes approximately 20 minutes to set up per subject (which will be further reduced when Cascading Style Sheets (CSS) are added).

Network issues

The Internet trend of big pictures and big download time counts against the development of on-line course work, as the course work designer now has to play graphic artist in order to 'wow' the students. There are, however a few tricks that can be followed in order to get relatively high impact documents that are easy to maintain and take a minimal amount of time to load over a modem.

The key to creating images that look good is to go with a simple set of colours and a good graphic package. The fewer the colours saved in the image, the smaller the image. Use JPG rather than GIF because of higher compression ratios. For diagrams and simple pictures, very high compression can be used with very little loss in readability (for example see the diagram in this Assignment Specification ). This concept also encourages simple designs for icons and headings, allowing for higher compression. Remember that background colours are hard to read from , so often a gray or a white is best. Black is high-impact but suffers from colour bleeding where the phosphor in the screen adjacent to characters lights unlit areas making the letters look blurry (Marcus, 1992). A standard background colour will also mean that transparent GIFs can be used if necessary.

Consider using the new facilities that browsers give for displaying text with different fonts rather than immediately resorting to graphics. This is both faster and less time consuming. Remember the saying, 'A picture is worth a thousand words of writing time!' In addition to using tables to de-limit areas, colours can also be used. Most browsers allow for tables with individual cells of a certain background colour and no border. This allows for area definition so less white space is used in a document. On the page on The Department of Software Development C++ Coding Standards the author was faced with a situation where various comments needed to be added to the document at the top, after the document was published. Using background colors draws attention to these changes and separates the concepts within the document. New layering facilities also allow text and tables to be layered over pictures and make it easy to place pictures over menus.

The use of Java applets is increasingly feasible. Many programs, such as Toolbook, allow for automatic generation of Java Applets, which can be included easily into web documents. It should be noted that large applets take time to download, and running Java programs is quite memory-intensive.

Transportability

There are still many places in the world which have slow network connections. At the time of writing this document, the author was considering the problem of a slow connection to another location teaching the same subject. This connection is often slow enough not to allow for even one transfer of an HTML document in a reasonable time, let alone 20 simultaneous ones. For this reason, it is advantageous to rely very little on 'on-the-fly' CGI-generated documents where this situation arises. Rather, allow either copying to disk or shipment via e-mail to be easily carried out on a regular basis.

When writing content for an unknown computing environment, the lowest common denominator must be considered. If documents are to work on a Windows 3.1 machine running a 16-colour palette, allow for non-subtle differences between colours.

Use and feedback

There are all kinds of usability tests and ideas that people will come up with during the development of on-line courseware. The problem is that many of these ideas may take quite some hours of programming and be totally useless. As a first cut at any WWW information system, develop the lowest useful and navigable set of information conveying the details needed. Include in this set of information a feedback mechanism and let the students make comments on the features they wish to see.

The feedback can also allow students to tell staff if something is not working correctly either on campus or at home, and keep staff more in touch with the problems students are facing. However, students who are not used to the workload of university tend to complain about the amount of work rather than concentrate on getting the work done. This seems to improve in second semester when students are more attuned to what is required of them, and the kind of learning environment they are dealing with. Students can be given replies to their feedback, which are placed on the same page as their feedback. This facility must be protected to prevent students from misrepresenting the staff. If the server being used does not give access protection to CGI scripts, the script can check the REMOTE_HOST environment variable (set by the browser), in order to limit access based on domain. If it is not possible to limit via domain, a username and password system may have to be constructed. (The ultiBASE article Student feedback via the World Wide Web by Dianne Hagan provides a further discussion of student feedback.)

Conclusion

References

Dillon, A. 1989, 'Designing the Human-Computer Interface to Hypermedia Applications' in Designing Hypermedia for Learning, Jonassen & Mandl (Eds.), Berlin: Springer-Verlag, Chapter 11.

Marcus, A. 1992, Graphic Design for Electronic Documents and User Interfaces, New York: ACM Press, Chapter 3, pp 51- 73.

Rada, R.. 1991, Hypertext: From Text to Expertext, New York, McGraw-Hill, pp 27 - 39.

About the author

Jason was winner of the 1996 ASCILITE award for the best World Wide Web project with Diane Hagan.