Aug 2004 Index

Home Page

Editor’s Note
:  Alaa Sadik from Quena in Egypt discusses design elements for online distance learning. Using the literature on research, theory, and practice he provides a plan that encompasses technology, curriculum, implementation, and management.

The Design Elements of
Web-Based Learning Environments

Alaa Sadik


Constructing on-line learning environments requires designing and developing various elements. These elements should be available to deliver instruction, enhance the quality of learning, facilitate interactions and support the learner. Examples of these elements are tutorials and assessment components, instructional support utilities, interaction tools, management and monitoring tools and help and support topics. In this article, the tutorial component, for example, consists of modules and lessons. Each lesson is arranged in a hierarchy of new concepts self-assessment, exercises, links to related Web sites and discussion areas. Management and administration tools are designed to help the on-line tutor to control/understand how the on-line class operates and to track students’ progress. In addition, they help students to register with the on-line class, access course grades and edit work. The interaction component is designed to facilitate student-tutor, student-student and student-content interaction.


In the last few years, the Internet and World Wide Web have given new impetus to educators and computer-aided instruction designers who attempt to design and develop interactive, intelligent and human-based courseware to move toward the Internet. Wise (1996) pointed out that the Internet has begun to have a significant role in education and change the nature of teaching and learning, since it provides learners with a wide range of learning opportunities and experiences.

Hites and Ewing (1997) described the Web as a powerful tool that facilitates the distribution of instructional resources regionally and globally. They drew attention to the development in Internet use in distance education by instructors who have begun to use e-mail and discussion groups to enhance and expand instruction and promote interaction. The Web has many of the features of audio-visual media (e.g., text, image, sound and video clips) as well as the ability to support interaction between the learner and others. Asynchronous communication technology is one of the unique features of the Internet.

In a comparison study between the traditional library and the Internet as a global library, Ryder (1996) pointed out that although the Web is likely to yield more up-to-date information and be more accessible than traditional libraries, the traditional library is likely to yield higher quality and more accurate results than the Web. The main difference between the Internet and the traditional library is that not all the items available on the Web are identified or can be retrieved easily by a single search engine.

Although the interactive, global, hypermedial and flexible nature of the Web offers many ways to enrich the learning experience, motivate learners and meet the diversity in backgrounds, ‘many on-line courses lack basic design consideration and that the web is simply being used as a medium for the delivery of instruction created within another framework’ (Chellman and Duchastel, 2000, p. 229). Chellman and Duchastel indicated that it is not appropriate simply to upload traditional textbooks to the Web to create an on-line learning environment.

Powell (2001) also argued that although establishing on-line learning environments and delivering courses via the Web is growing rapidly, many Web developers and on-line tutors struggle with ‘how to successfully use the available tools and technologies to organize instructional content into well crafted teaching systems that support learning’ (p. 44). Powell pointed out that many instructional, structural, technical, navigational and content-related factors should be considered in designing and evaluating on-line learning to maintain and secure students’ interest, motivation, satisfaction and success.

The design elements of Web-based learning environments

To design effective Web pages and content, Harbeck and Sherman (1999) argued that since students may be unable to navigate through a learning environment, deal with sophisticated software and hardware, make appropriate choices, participate in activities or control the programme, instructional designers and tutors should take close look at the design of the user-interface, guiding approaches, methods of encouraging interaction among learners and involving students in beneficial activities and individualised learning.

Ritchie and Hoffman argued that the Web as a hypermedia environment uses graphics, colours, animated images, visual effects, sound and movies, which have long been used as external stimuli to motivate learners. In addition, using the hypermedia capabilities of the Web, developers can offer different levels of instruction for learners who have diverse backgrounds or knowledge, to remind learners of their existing knowledge. Therefore, the learner can select among different links, take decisions and co-operate with other learners. Moreover, using synchronous and asynchronous methods, the on-line tutor can provide students with guidance and feedback during learning. Lastly, the recent interactive Web-based objects (e.g., CGI, Java, and ActiveX) could be exploited to construct online testing and engage students in online exams as self-tests to help the learners to evaluate themselves. In addition, CGI scripts can be used to provide learners with a remedy if they have problems, or to extend their knowledge.

However, stating another point of view, Oliver (1999) believes that although many studies have suggested design guidelines for designing on-line environments ‘the advice is very broad and covers all aspects of instructional design. […] The plethora of advice being offered is often difficult to digest and apply’ (p. 241). Based on the notion of constructivism, Oliver described a framework to identify and distinguish between three main elements in the design of on-line learning environments. These elements that influence learning outcomes are course content, learning activities and learner support (Figure 1).

Oliver believes that, first, the learning environment should provide learners with the content and resources in a variety of ways and ‘as a means to an end rather than an end in itself’ with the freedom of the learner to choose his/her own path through the content. Second, the learning environment should provide the learner with such activities and opportunities for ‘reflection and articulation’. Third, learner support is necessary to guide learners, provide assistance during learning and provide feedback.

Figure 1. Design elements of on-line learning environments
(Oliver, 1999, p. 243)

However, while Oliver (1999) restricted on-line support to a narrower context, known as scaffolding, Simpson (2000) provided a more extensive and wider definition of on-line support. According to Simpson, student support indicates ‘all activities beyond the production and delivery of course materials that assist in the progress of students in their studies’ (p. 6), including academic support (e.g., exploring the course, providing feedback, chasing progress) and non-academic support (e.g., advising, assessment, administration, etc.). Simpson concluded that the Internet could enhance student support in two ways: ‘supplying information of various kinds; and offering interactive and diagnostic programmes’ using e-mail, synchronous and asynchronous conferences and information resources (p.80).

Moreover, Chellman and Duchastel (2000) argued that the design of on-line learning environments should consider ‘the full spectrum of design, including both content and technology elements’ (p. 229). Content elements are the basic instructional design elements (e.g., content, objectives and evaluation). Technology elements are the medium-related features that support learning (e.g., interaction mechanisms, management elements and interactive Web-based elements) (Chellman and Duchastel, 2000).

Elements of on-line learning environments

The review of the instructional design literature showed that various features and instructional and support elements should be available in on-line learning environments. These elements characterise Web-based education in particular and exploit the Web’s capabilities to establish ‘virtual’ learning environments for distance students. The most common elements found in the writings of Carr-Chellman and Duchastel (2000), Chellman and Duchastel (2000), Fisher (2000), Harrison and Bergen (2000), Weston and Barker (2001) and Chou (2003) are addressed and described below. However, pointing out these elements does not mean that all of them must be available in any Web-based learning environment. Developers and instructors could choose the appropriate components they need or modify them according to the course objectives, learners’ needs, costs and any other factors.

First, online modules use carefully designed and multiple forms of media such as hypertext, links, graphics, animation, real-time audio and video and other hypermedia objects (such as Java applets and Macromedia Flash presentations) to improve presentation and involve students in active learning activities (Weston and Barker, 2001). This mix of media should be adjusted to encourage students away from attending traditional classes and towards practicing, discussion and articulating, thus ‘optimising the opportunities for self-directed learning and metacognitive learning’ (Macdonald and Twining, 2002, p. 604).

The basic purpose of on-line modules is to provide the student with a complete and up-to-date picture of the subject matter, including main concepts, links to Web resources, examples, exercises and reminders (Harrison and Bergen, 2000). Links to Web sites with authentic contexts or sites that afford access to primary source documents and immediate automated assessment and feedback are examples of useful active elements that should be included in on-line modules (Weston and Barker, 2001).

A course schedule is needed to arrange the learner’s time during studying and to keep students together as they work through the course material, but without striking the flexibility of the distance education programme. In addition, a study guide, or course outline, is the student’s reference to the course content, tasks and activities associated with the on-line content. Usually, the study guide contains ‘any prerequisites for the class, the objectives, a brief listing of topics to be covered, the required materials such as text, specific grading criteria for the course, participation requirements for the course and bibliography’ (Harrison and Bergen, 2000, p. 59).

Moreover, Web courses should offer an on-line assessment facility using different types of testing, including assignments and quizzes. Students can use these forms for self-assessment at the end of each module or at the end of the course for final evaluation. Students’ responses may be marked automatically and synchronously using CGI or JavaScript programs or sent to the instructor to be marked (Khan, 1997; Goldberg, 1997). ‘The provision of automatic assessment can offer enhanced possibilities both for self-study and for class administration’ (Marshall, 1999, p. 40). Questions and assignments can be submitted via e-mail or discussion boards or off-line for more comprehensive evaluation and to avoid on-line cheating (Weston and Barker, 2001).

Furthermore, an online library may contain a series of well-categorised and searched links to relevant Web resources is needed. Web designers need to exploit this new type of on-line resource in the course and avoid adding it as an additional part or second reference for students, alongside the course materials. The on-line library may contain Web search engines to search for course-related information, which are not available in the course library. However, it is important for the instructor to test search engines and directories, select those that are suitable for students’ knowledge and provide them with help.

Second, although the Web offers many asynchronous and synchronous interaction tools
(e.g., e-mail, discussion boards, listservs, chat room and conferences), a few researchers have offered guidelines for designing technically on-line interactive functions (Chou, 2003). Adding discussion forums and chat rooms, for example, to on-line courses may be a useful way to facilitate student-tutor and peer interaction, encourage co-operative learning, enable the on-line tutor to observe and assess students’ contributions and scaffold their thinking (Angeli, Valanides and Bonk, 2003). In addition, interaction elements can be ‘a valuable teaching tool in countering the isolation felt by distance education students’ (Dymock and Hobson, 1998, p. 157). Using an announcement board, the instructor can post news or announcements to keep all learners up to date and involved (Huang, 2000). Students can access this board regularly to read the instructor’s announcements. In addition, students can post their own announcements to the class.

In addition, students’ and tutors’ profiles could be presented through personal Web pages to foster the sense of community and that the class is not just a group of isolated learners. Personal Web pages that include student’s e-mail address, photo, home town and other information encourage students to learn about each other and encourage individual interaction (McConnel and Sharples, 1983).

Third, class management elements are necessary to ensure that the on-line class operates efficiently, including registration tools, assessment and distribution of grades and student tracking (McConnel and Sharples, 1983). A registration tool, for example, is needed to ease class enrolment and management. Students use this tool to provide personal information and join or withdraw from the class. In addition, server logs can be used to track students’ participation and progress, assignment submissions, completion of quizzes and participation in discussions. 

The above review shows that the features and elements of on-line learning environments could be categorised into four main components:

1.       a tutorial component (on-line modules, study guide and tests, etc.);

2.   an interaction component (interaction tools such as e-mail, discussion boards, etc.);

3.  a management component (class management,  course schedule, announcement board, etc.); and

4.  a support component (on-line library, personal pages and tracking, etc.)
(Figure 2).

Figure 2. Elements of Web-based learning environments

The above figure shows that while the tutorial component seems to be the central and leading component in the learning environment, it is supported by other components and shares many of its features with the learning environment. In addition, many elements could belong to more than one component at the same time. For example, although e-mail and discussion boards are considered as interaction mechanisms, they are useful tutorial methods. Using e-mail, the learner can interact with peers in the class and with the tutor, ask questions, submit assignments and receive feedback. In addition, using discussion boards, students can post messages to the class, read classmates’ posts, respond to teacher’s questions or receive feedback about their posts. Similarly, on-line quizzes could be considered as a tutorial element, to assist in knowledge construction, or as an assessment tool to evaluate learning at the end of each module. The dashed lines indicate that the tools and elements of the components of the environment are not bounded within a single component but could be used flexibly in many ways within the learning environment.

The design of a Web-based learning environment for distance education

To show how these elements look in practice, the design and development of an on-line class, called Wired Class, is described as an example of developing these elements (Figure 3). These components are categorised into five groups rather than separate links. Each group is called a ‘room’ and each room contains components, which serve the same objective or are similar in features (such as interaction tools). For example, e-mail, chat rooms and discussion boards are categorised into one room called ‘Communication Centre’.

Figure 3. Components of Wired Class

1. Tutorials and assessment

Tutorials, also known as content delivery, refer to the course materials that are to be delivered to the students. The course content may be in the form of text, graphs, multimedia presentations or interactive Java simulations. Tutorials (modules and lessons) are the pivotal component in the learning environment and all other components and elements are designed to serve the subject as represented in the modules. Since the subject content, as represented in the student textbook, is not suitable to be delivered directly via the Web, converting the textbook materials to Web pages would make them nothing more than electronic pages for reading via the computer screen.

The need to conduct interactive learning required the traditional content to be re-edited and interaction objects to be added (e.g., interactive graphs, hyperlinks, quizzes, etc.). To achieve this purpose, first, the subject content was logically divided into two modules, each module containing six lessons followed by a revision and exam lesson. Second, each lesson was segmented into seven chunks using the principles and objectives of the teaching approaches. These parts were entitled the lesson, further examples, self-test, exercises, links, discussion and send to the teacher.

Basic elements of the course content (e.g., facts, concepts, skills, examples, etc.) were presented under the ‘lesson’ section. However, they were re-written in the light of constructivist principles. Meanwhile, essential concepts and problems were left to be represented in other parts of the lesson (e.g., discussion). Formatted text (using colours, different fonts and styles, etc.), still images and animated graphs were used to represent the lesson content. At the same time, each lesson was segmented logically into many small chunks, each representing one concept, skill or problem.

However, although the lesson section contains one example or more to illustrate a new concept or problem, additional and different levels of examples were provided separately under the ‘further examples’ chunk, allowing the learner to find more examples and illustrations, if needed.

Self-test is an interactive component in each lesson provided to stimulate learners’ thought and action, encourage them to ask questions, motivate them to learn and help them to know whether they understand the main concepts and ideas in the lesson or not. In this task, the learner answers two questions or more using ‘multiple-choice’, ‘matches’, ‘true-false’ and ‘filling the blanks’ formats. Self-assessment questions allow learners to access areas of the course (within the course or externally on the Web) that have been restricted, or revise specific parts of the lesson again; they are asked to contact the teacher if they repeat a mistake.

Self-test tasks are provided using HTML forms and CGI scripts which run in the Web server. These scripts catch the learner’s answer, check it, generate a HTML page including the appropriate feedback then forward it to the learner’s browser to let him/her know the right answer at the same time. Using Java Scripts in this case was not appropriate because it requires the answer to be included in the HTML code which can be viewed by the learner if he/she is experienced enough. Even using ‘encoded’ or ‘encrypted’ code, it is not possible to generate appropriate feedback pages.  

Exercises are similar to traditional textbook exercises, which are very common task in maths education. In Wired Class, the student needs to print out the exercises page and use paper and pencil to answer exercises (e.g., solving equation, graphing a function, etc.). The objective of exercises is to give the learner the chance to practise more mathematics traditionally (using paper and pencil). The teacher’s role then is to ask learners about their answers and progress in this task by requesting results using e-mail. These exercises allow more interaction between the learner and the content and between the learner and the teacher. 

Unlike CAI courseware, which is restricted by the courseware database, ‘links’ work as a portal to Web resources. In this part, many useful and well-selected Web sites are suggested for learners. These links vary between tutorial Web sites, illustrating the main concepts and facts included in the lesson using other methods, to problem-based solving sites that encourage learners to construct their knowledge using different and high-level techniques of thinking. To select the topic and type of a link, the objectives of each lesson and the needs of other tasks (e.g., exercises and discussion) were considered. For example, visiting these links is necessary for solving problems in the ‘send to the teacher’ task. Many questions were considered when selecting any site to be linked to Wired Class:

  • What is the goal of the site?

  • Is the material designed for students similar to those of Wired Class?

  • Is the information useful and appropriate for the course objectives?

  • Is the author of the site qualified?

  • Does the site provide links to more detailed information or other sites?

For example, if the site provides links to other external sites, these external sites should be reviewed first. In addition, Wired Class students’ attention should be drawn to whether they can continue visiting these external links or not. In addition, since many Web pages are deleted or moved quite often and new Web sited uploaded every day, links can get out of date, therefore links should be reviewed and maintained regularly. 

Peer discussion, also, is one of the essential elements in collaborative and constructivist learning. According to constructivist epistemology, peer discussion offers the chance for students to interact asynchronously, negotiate meaning and reflect on their learning and viewpoints through collaborative problem solving. In this part, students are encouraged  to construct a part of their knowledge via interaction with each other. A problem is suggested, either by the tutor or students, and learners are required to participate by filling-in and submitting a simple HTML/CGI-based form. Then, the learner’s participation is added to the discussion board of each lesson. Therefore, the learner can read others’ participation in the board, compare among different points of view, ask a participant for more explanation or comment on others’ responses. Access to discussion boards could be done via each lesson or from the starting page. The teacher’s role is to monitor the discussion board, motivate students to participate more positively, evaluate learners’ participation and send his/her comments to learners, publicly or individually, if needed.

Lastly, the ‘send to the teacher’ section is the last part in the lesson hierarchy. In this part, the student needs to answer and submit various types of questions using HTML forms. Types of questions are not limited to multiple-choice or filling in blanks. Students can answer essay type, compilation or open-ended questions, which require manual grading by the tutor.

Therefore, this task minimises the problem of ‘textual entries’ that faces CAI programs, whereby textual entries by the learner can be misspelled and the program has to be written in a way that can deal with many probabilities. Using HTML forms and CGI scripts, learners’ responses are collected in a database in the Web server to be assessed and analysed by the human teacher who then sends results and feedback to the learner. This task, in particular, is an extremely important part of each lesson since mathematics requires a human teacher, not an auto-marking program to analyse students’ responses and send the appropriate feedback. In addition it could be used to:

  •  evaluate students’ achievement to know whether the learner understand the lesson or not;

  • help the tutor to keep students notified of their progress and mastery of the lesson content.

  • encourage students to ask the tutor and motivate them to learn.

2. Support utilities

Instructional support utilities include course schedule, on-line library, student’s page builder, Web publisher, Web search tool and on-line notebook

Course schedule

The purpose of the on-line schedule is to guide students through the course and help them to manage their time and group-based activities, without destroying the flexibility of distance education. The importance of the schedule is it keeps students studying together, as far as possible, to offer the chance of interaction and co-operation among them. Therefore, a timed study plan is added to guide learners week by week and lesson by lesson (Table 5-4).

The on-line schedule was developed based on the assumption that traditional class students are able to study the course modules in seven to eight weeks (two times a week). At the end of each module, a revision and test were provided to allow learners to recall, summarise and practise the main concepts and skills included in the module. In addition, the course schedule provides week by week tasks that should be achieved. These tasks (such as discussions and group presentation) are not pre-defined; instead, they are left to the teacher and students to suggest.

The on-line library

The purpose of the on-line library is to employ one of unique features of the Web as a global and easy accessible source of information. The on-line library introduces learners to the Web as a supplemental source of course-related information in different formats. This information could be on-line tutorials, provided by other courses and tutors, quizzes, discussion topics, subject-oriented forums and instructional aids (e.g., graphical calculators) to support students in their learning.

The on-line library catalogue is designed to be searchable using a Java Script-based search engine. Search results are yielded as links and short descriptions of relevant Web resources. In addition, public search engines are made available to search the Web, if the library fails to meet the student’s needs. Students are encouraged to add Web resources to the library catalogue using the ‘add to the library catalogue’ facility

Page Builder

Just as traditional classroom students see and contact with each other, on-line students need to see and know each other. Therefore, students’ personal Web pages could be used to foster the sense of community and minimise the sense that students are isolated from each other. Usually, personal Web pages present the student’s profile (e.g., interests, country, education level, personal photograph, e-mail address and links to favoured Web sites). This information is essential to encourage interaction among students.

However, although there are students who may able to build their own personal Web pages using WYSIWYG HTML editors, designing, building and uploading Web pages for the majority of learners is not an easy task. Therefore, the need was recognised to design a Web-based tool to help students to build their own Web pages. This tool is called ‘Page Builder’. Page Builder is a pre-defined ‘template’ script. This script allows the student to enter his/her personal information (e.g., name, e-mail address, interests, etc.) and personal image then upload it to Wired Class server using a simple HTML form. The script uses this information to generate an HTML page, specifies an HTTP address and links the page to the students’ Web page.

One of the most important features of Page Builder is that it uploads the learner’s image easily from his/her local disk to the Web server. Therefore, the learner does not need any additional programs, except the Web browser, to build a good-looking page. In addition, the learner could modify his/her page later using his/her username and password. This feature encourages learners to update their pages regularly and allows them to correct any mistake they discover in the future.

Web publisher and presentation board

As the on-line learner’s role is changed from recipient to participant, strategies and tools are needed to add an additional interaction dimension to Wired Class. One of these interactive strategies is asking learners to provide course-related presentations. In the traditional classroom, learners can use different types of media to present their work to the class (e.g., whiteboard, graphs, maps, etc.). A similar tool can be provided in Wired Class called the Web Publisher. Using HTML forms, the learner can submit his/her work to be added to the presentation board where students publish their work. In the presentation board, students’ presentations are listed, ordered and linked to the presenter’s name. In addition, the presenter is able to re-edit his work using his/her username and password. 

Web search

To search the Web, relevant search engines were selected to be used by the learners in Wired Class. However, to avoid having access each search engine’s Web site separately to seek for course information, these search engines are gathered in a simple HTML form using Java Script. All the learner needs to do is to type a search keyword, or keywords, and select an appropriate search engine, from an opposite drop-down menu, to show the search results in an internal frame within Wired Class.

Learning aids

The purpose of learning aids is to provide students with interactive and support tools that can be used in mathematics learning. Examples of these tools are calculators  (numerical and graphical) and equation solvers. Using only Java enabled browser, graphical calculators can help students to examine and visualise graphs of functions, define their domains, investigate relationships, compare functions and zoom in and out. Many mathematical tools were designed, adopted or employed to help students in their learning, particularly with the lack of face-to-face tutor support.

On-line notebook

Students’ notebook is an on-line notebook that allows the learner to save any course related information (e.g., comments, exercises, teacher’s feedback, etc.) in a personal and secure file in the Wired Class server, using his username and password. Developing a ‘notebook’ is a relatively difficult task and not found in many learning environments. However, using CGI scripts it is possible to allow the students to transfer and keep their information in the Web server and retrieve it again using their Web browsers only. Functions such as ‘copy’, ‘cut’ and ‘paste’ are used to facilitate information editing. The most important advantage of ‘notebook’ is that learners do not need paper and pencil or additional software to manage their tasks.

On-line help

Help topics are an essential feature in courseware development and student support. Therefore, a simple and easy access help system was designed to provide students with the information they need to use the various features and elements of Wired Class, including the function of each element and information about the Internet, the Web, search engines, etc.

Help pages are accessed from the ‘help’ icon or from within any component in Wired Class. In designing help topics and index, the standard MS Windows help style was considered as an easy to use and familiar style of design. In addition, learners are able to get any information they need by clicking on the help node to show a pop-up sub-window. Moreover, a short preview and graphical presentation were provided allowing the learner to learn how to use Wired Class and its components.

3. Interaction tools

Interaction tools varied between asynchronous (e-mail and discussion boards) tools and synchronous (chat) tools.


E-mail is one of the most popular and widely used asynchronous interaction tools in the Internet and the Web. The potential of e-mail is that it is a very fast text-based mechanism for conducting interaction between the tutor and students. Web-based e-mail in particular has shaped a new revolution in popularising e-mail using an easy access, simple user interface. For these reasons, a Web-based e-mail service was selected to serve in Wired Class.

There were two possible ways of offering an e-mail service via Wired Class. The first was to install e-mail server software in Wired Class server to work as an independent Web-based e-mail service, taking domain name of Wired Class Web server. Although this option allows a full control over the e-mail service, it is very costly and only suitable for big organisations. The second option was to subscribe to a free e-mail service on the Web. Currently, the number of free e-mail service providers is estimated at more than hundred. These services varied in their capabilities and suitability for Wired Class students.

Although there are numerous chatting systems available which vary in their capabilities (using text, audio and video), most of them are not suitable, either technically or educationally, to the students’ level or to be hosted in Wired Class Web server. However, suitable chatting systems were found to be too expensive to be used in small-scale educational applications or at schools. For these reasons, it was necessary to design and develop a simple, and efficient, chat system for Wired Class students. A text-based chat system was found to be the most popular type for easy and fast interaction via the Web. This kind does not require a high specification machine or any additional software in the user’s machine except the Web browser.

Technically, conducting a chat room requires running a script in the Web server to be used by two users, or more, at the same time. The main functions of this script are receiving one participant’s inputs, using HTML form, then forwarding them to the other participant browser who are running the same chat script. The chat system was designed as two windows in the student’s Web browser. The upper window allows the student to input his/her information and a short message. At the same time, the lower one shows students’ names and their participation (Figure 5-10).

The essential idea behind this simple design is that a CGI script handles each participant’s inputs from the upper form, saves them in a temporary text file, then forwards them (after 5 seconds for example) to the other participant’s lower window. The last task is achieved by involving the HTML command ‘refresh’ in the HTML code in the lower window. The complete CGI scripts in conjunction with HTML forms were designed and developed with students’ needs and level in mind. Additional features were added to the chat system make it easy to use and interesting. For example, the learner can establish any number of new rooms and invite others for conversation. Alternatively, others can access a room already established already by the teacher or someone else using the option ‘enter a room’.

Chat rooms

Using these chat rooms, learners can interact synchronously with each other to share ideas, solve problems and work collaboratively on a project. Designing a chat system means designing a real-time and multi-user channel for communication via the Web. Although there are numerous chatting systems available which vary in their capabilities (using text, audio and video), most of them are not suitable, either technically or educationally, to the students’ level or to be hosted in Wired Class Web server. However, suitable chatting systems were found to be too expensive to be used in small-scale educational applications or at schools. For these reasons, it was necessary to design and develop a simple, and efficient, chat system for Wired Class students. A text-based chat system was found to be the most popular type for easy and fast interaction via the Web. This kind does not require a high specification machine or any additional software in the user’s machine except the Web browser.

Technically, conducting a chat room requires running a script in the Web server to be used by two users, or more, at the same time. The main functions of this script are receiving one participant’s inputs, using HTML form, then forwarding them to the other participant browser who are running the same chat script. The chat system was designed as two windows in the student’s Web browser. The upper window allows the student to input his/her information and a short message. At the same time, the lower one shows students’ names and their participation.

The essential idea behind this simple design is that a CGI script handles each participant’s inputs from the upper form, saves them in a temporary text file, then forwards them (after 5 seconds for example) to the other participant’s lower window. The last task is achieved by involving the HTML command ‘refresh’ in the HTML code in the lower window. The complete CGI scripts in conjunction with HTML forms were designed and developed with students’ needs and level in mind. Additional features were added to the chat system make it easy to use and interesting. For example, the learner can establish any number of new rooms and invite others for conversation. Alternatively, others can access a room already established already by the teacher or someone else using the option ‘enter a room’.

Discussion boards

The discussion board is a virtual area where learners exchange their personal ideas and examine them against others’ points of view. Using discussion boards, students can post and read messages addressing course-related information and problems. An investigation of discussion board programs available on the Web showed that using one of them in Wired Class would not be suitable to the students’ level and discussion objectives. These discussion boards are ‘threaded’ discussions, which are suitable for debating more than one idea or topic in the same board. In addition, the thread style discussion was taught to be unfamiliar to students and it would not allow them to take advantage of messages presented under sub-titles or view all relevant information while commenting (Schoonenboom, 2002).  For these reasons, a simple discussion board was designed and developed.

 The design of the discussion board interface consists of two parts: The ‘send’ form and list of participants’ messages to the board. This design allows the learner to submit his/her message to be added below at the top of the list. So, the learner can read others’ messages to the board and compare his/her point of view against theirs. Technically, all posted messages are organised and saved in a HTML file in the Web server called a ‘discussion file’. Every ‘discussion file’ in the server has a unique name. Every time the learner executes a discussion board script in the server side, the script generates an HTML page combining the HTML form (for inputs) and the specified ‘discussion file’ to appear on the same page in the user’s browser.    

On-line students’ page (who is on-line?)

Since students access Wired Class at different times during the day, the on-line students’ page presents a list of students who has logged-in to the class, with the time of logging-in/logging-out and links to those students’ personal pages. The importance of this tool is that it allows the learner to know who is on-line while he/she studying, encourages students to contact each other and minimises the sense that everyone is studying alone

4. Management and monitoring tools

Course administration refers to the different options available to the on-line tutor to manage his/her learning environment, enable/disable access rights of students, monitor students’ progress and contact students. In Wired Class, management tools include control panel, student enrolment, students’ grades and notice board. 

Tutor’s control panel

The control panel is a group of easy-to-use tools allows the tutor to manage, contact, support and monitor student’s performance using the Web browser. Using the control panel the tutor is able to:

  • send instant message to any student using his/her username only;

  • ask one student or a group of students to contact him/her while they are studying;

  • receive and organize students’ messages in one window;

  • send public messages to the entire class via the notice board;

  • search and update the on-line library catalogue;

  • monitor students’ participation and participate in discussion boards;

  • track students’ pathway through Wired Class components and modules;

  • turn on/off the feature of ‘on-line tutor’, allowing students to know whether the tutor is on-line or off-line;

  • update student’s grades in each lesson; and

  • access Wired Class MS Access database to get information about student’s performance and progress.

The control panel is used by the on-line tutor as long as he/she is available. At the start of any learning session, the tutor selects the ‘Available’ radio button then clicks the ‘Update’ button to inform students that he/she is on-line and able to receive and answer their questions. Messages sent by students appear at the bottom of the control panel and the tutor can reply to students instantly without leaving control panel or while doing other tasks.

In addition, since the tutor is not in direct contact with students and does not have traditional type records to monitor their performance and track their activities, the control panel allows the tutor to trace all site pages visited by the student, the number of tasks completed, tests taken and the time spent in learning the course material. Using this information, the tutor can encourage and support struggled students, diagnose students’ difficulties and provide the appropriate feedback to every students.

Student enrolment

On-line student enrolment is one of the unique features that characterise Web-based learning environments. Unlike other media (such as television) the Web offers the possibility of enrolling students directly. Paper-based forms, post and telephone are replaced by HTML/CGI forms. In Wired Class, students are enrolled using a registration form, which requires the student to enter his/her personal information (e.g., name, gender, school, date of birth, etc.) and choose a username and password. In addition, the student is able to register him/herself in other services, such as e-mail. After registration, the student cane use his/her username and password every time he/she accesses Wired Class.

Student’s grades

The student’s marks page is a grade tool allows the learner to access his/her own grades in each lesson, as entered by the tutor. The grades page consists of two parts: the editor and the viewer. The editor allows the tutor to update the learner’s grades page regularly using only the student’s username. However, the viewer allows the learner to view his/her marks in previous lessons.

Notice board

Notice board is similar to the traditional class wallboard on which notices are fixed. In Wired Class, a need was perceived for a similar board on which the teacher and students could show their notices. However, although it was easy to specify an area in Wired Class to show the teacher’s notices, it would not be practical for the teacher to receive and publish daily and weekly notices using the HTML editor. For this reason and to encourage learners to show their notices in Wired Class, a tool was designed to help the teacher and students to post their notes.

Using ‘notice board editor’, the teacher and students are able to post their notes only by filling-in a simple form. The notice board can be used for many purposes. The teacher could use it to arrange for on-line discussion or announce about new arrangements or changes in the class system. At the same time, students themselves could use the board to announce an event or indicate to a public event.

The figure below shows the relationship between these elements and explains how they work and facilitate learning and interactions.

Figure 4. Elements of Wired Class


In designing for the Web it was found that Web-based learning environments require the design and integration of various tutorial (e.g., modules and tests), management (e.g., schedule and grade distribution), interaction (e.g., e-mail and discussion boards) and support (e.g., on-line library and help topics) components that work together to enhance students’ performance and interactivity of learning. In designing learning activities students need to pass through various cognitive activities and participate in self-based and collaborative instructional tasks (e.g., self-tests and discussion boards) to construct their learning.


This paper is based on the research conducted for my Ph.D. dissertation. Therefore, I am deeply grateful for Dr. Ken Spencer, Institute for Learning, University of Hull, UK for his supervision and valuable comments on this part of research addressed in this paper.


Angeli, C., Valanides, N. and Bonk, C. (2003). Communication in a Web-based conferencing system: the quality of computer-mediated interactions, British Journal of Educational Technology, 34(1), pp. 31-43.  

Carr-Chellman,A. and Duchastel, P. (2000). The ideal online course. British Journal of Educational Technology, 31(3), pp. 229-241.

Carr-Chellman,A. and Duchastel, P. (2000). The ideal online course, British Journal of Educational Technology, 31(3), pp. 229-241.

Chou, C. (2003). Interactivity and interactive functions in web-based learning systems: a technical framework for designers, British Journal of Educational Technology, 34(3), pp. 265–279.

Dymock, D. and Hobson, P. (1998). Collaborative learning through audioconferencing and voicemail – A case study. Distance Education, 19(1), pp. 157-171.

Fisher, M. (2000). Implementation considerations for instructional design of Web-based learning environments, In Abbey, B., (Ed.) Instructional and Cognitive Impacts of Web-Based Education, London, Idea Group Publishing.

Goldberg, M. (1997). Using a Web-based course authoring tool to develop sophisticated Web-based courses, In Khan, B. (Ed.), Web-Based Iinstruction, Englewood Cliffs, Educational Technology Publications.

Harbeck, J. and Sherman, T. (1999). Seven principles for designing developmentally appropriate Web sites for young children, Educational Technology, 39(4), pp. 39-44.

Harrison, N. and Bergen, C. (2000). Some design strategies for developing an online course.

Educational Technology, 40(1), pp. 57-60.

Harrison, N. and Bergen, C. (2000). Some design strategies for developing an online course. Educational Technology, 40(1), pp. 57-60.

Hites, J. and Ewing, K. (1997). Designing and Implementing Instruction on the World Wide Web: a Case Study. Center for Information Media, Retrieved February 13, 2002 from

Huang, H. (2000). Instructional technologies facilitating online courses. Educational Technology, 40(4), pp. 41-46.

Macdonald, J. and Twining, P. (2002). Assessing activity-based learning for networked course. British Journal of Educational Technology, 33(5), pp. 603-618.

McConnel, D. and Sharples, M. (1983). Distance teaching by Cyclops: an educational evaluation of the Open University’s telewriting system. British Journal of Educational Technology, 14(2), pp. 109-126.

Oliver, R. (1999). Exploring strategies for online teaching and learning. Distance Education, 20(2), pp. 240-254.

Powell, G. (2001). The ABCs of online course design. Educational Technology, 41(4), pp. 43-47.

Ryder, M.(1996). Affordances and Constraints of the Internet for Learning and Instruction, Paper presented at a joint session of the Association for Educational Communications Technology, Brent Wilson University of Colorado at Denver.

Schoonenboom, J. (2002). A template for discussing large texts on the Web: the Pragglejaz site, Colloquium. British Journal of Educational Technology, 33(1), 103-107.  

Simpson, O. (2000). Supporting Students in Open and Distance Learning. Open and Distance Learning Series, London, Kogan Page.

Weston, T. and Barker, L. (2001). Designing, implementing, and evaluating Web-based learning modules for university students. Educational Technology, 41(4), pp. 15-22.

Wise, N. (1996). Using technology to integrate learning into the real world. Paper presented to Australian Computers in Education Conference, 9-12 April, Canberra.

About the Author

Alaa Sadik
(Ph.D., University of Hull, UK, 2002)
Lecturer in Educational Technology
Department of Curricula & Instruction
Faculty of Education,
South Valley University,
Qena 11183, Egypt

Home Tel: +20 96221280
Mobile: +20 103866817
Alaa Sadik []

Dr. Sadik is lecturer in educational technology, Faculty of Education, South Valley University, Egypt. He received his Ph.D. in educational technology from the University of Hull, UK in 2002.

He teaches courses for undergraduate and postgraduate students (computer-based instruction, educational technology...) and is interested in e-learning and distance education.

His current research includes: Measurement of Attitudes Toward Personal Use and School Use Computers Among Egyptian Teachers.

Recent publications include:

Sadik, A. (2004) Directions for Future Research in On-line Distance Education, Turkish Online Journal of Distance Education 4(4), available online:



go top

Aug 2004 Index

Home Page