The basic language of the web is HTML (HyperText Markup Language). With HTML you are able to primarily present text and graphics. You also can use principles from hypermedia as well as use links to create a higher level of interactivity. We will take a look at some examples. Many of these examples have been done by students in our Studio.

Let's begin with a brief statement about instruction. While Gagne suggests that there are 9 events of instruction, it is simpler to look at Alessi and Trollip's 4 event model. In this model, they suggest that you have to:

• Present your information
• Guide the learner as they acquire the knowledge
• Allow time for Practice
• Evaluate the learning

When looking at HTML, you can do many of these things. However, HTML is best used for presentation and perhaps some guidance. It is possible to have it take care of the other two events, but there are other web technologies much better suited for these events.

Let's take a look at some sites that demonstrate what I am talking about.

A very easy thing to do is to put together a powerpoint presentation and put it on the web.  One way to do this is to just put it up and assume the user has powerpoint.  Teacher Portfolios  Another thing to do is to save it as html resulting in something like this.

Here is our Studio site. It uses frames and its structure is based on the "farm house" metaphor. It is interactive in the sense that you can explore information about the Studio.

The IT Studio

Here is a hyperText book to give a sense of what hypertext is all about. It is called Lasting Image.

This next site is modeled after the classic tutorial. You present some information in text and graphics, then you provide a guiding question.

This tutorial on Waves was done by Steve Hardwick.

Tools:

MS Office, Dreamweaver, Photoshop (or equivalent)

Skills:

Good writing and organizational skills; Skills in images or access to someone who does.

 PDF Files

Sometimes you just want to distribute printable stuff. The web is very efficient for this. Here is a book on Authorware written by Dr. Rieber that can be downloaded from the web. You can download the preface for free, after that you need to pay $20. This book allows for presentation and guidance and practice. This is a typical hands-on book.

Tools

Adobe Acrobat or PageMaker

Skills

Page layout and writing/editing
 
 

Multimedia

Another method for presentation is to use multimedia. You can stream audio and video. Video is pretty expensive, but is done more and more. Audio can be a powerful instructional media, particularly if it is supplemented with other interactive elements. Epic Learning does this well using their implementation of Placeware. The teacher transmits audio and students can ask or answer questions from something like a chat window.  A really interesting solution if you want to get into the streaming area is to use a mac with iMovie or Final Cut Pro to produce your video and a QuickTime server to serve your streaming video.

Try CNN or NPR. Also, Epic Learning uses Windows Media Player for archived classes.

Tools

Real Media; Windows Media Player; Apple Quicktime

Skills

MIS and video and audio production skills
 
 

 HTML with Javscript

A way of providing better guidance in a web based training system is to use javascript.. With javascript you set variables and use control structures. With variables you can do cute things like ask them their name at the beginning, store that variable into a cookie, and refer to the learner by name when providing feedback. Also, you can conduct evaluations which allow you to save progress into a cookie as they answer questions. The problem, of course, is that the cookie exists on their computer. Getting the data back to the instructor is a bit troublesome. Their are some low cost solutions (like embedding the data of the cookie into hidden elements in a form and having the form action send an email with the data to the instructor) or higher cost solutions like writing the data to a database on your server.

Here is a girl scout leader training example done by Cara Paisley, one of our Masters students. You can either go to beginning where it is all html presentation or you can go to what is like an evaluation at the end or you can go the beginning of the whole project.

Tools:

Your favorite editor

Skills:

Programming ability
 
 

DHTML

Dynamic HTML is simply an interaction between HTML, Javascript and the Document Object Model (DOM). The result is that you can add simple animations to your presentations. Often animation can explain things much better than still pictures and words. Of course, since it involves the DOM, the differences between Netscape and IE are made quite clear. These differences are difficult on the developer.

Here is a silly little example of animation, but it gives you a sense for what can be done.

Rollovers are a big part of what can be done with DHTML, here is another example from the Smithsonian on the American Flag.

Tools:

Dreamweaver (BTW, Dreamweaver has a add on product called Course Builder that may be of interest) or your favorite editor

Skills:

Good computer tool user or programming experience
 
 

HTML and Database Connectivity

There are many ways to do this, but the question is why do it for learning or instruction. The answer is the management of instruction. Later you will be introduced to Epic Learning's site. It makes a great deal of use of a large scale database to manage instruction.

Tools

Cold Fusion, ASP (Macromedia's UltraDev), Vignette

Skills

DBA and Programming
 
 

Flash and Director (Shockwave)

Perhaps a better way of handling the problem of an animation being worth more than a thousand words and a picture, is to embed a self-contained little program (Applet) or animation. With Director you are more able to create a little program, but the distinctions are blurring between these two applications.

Here is a nice demonstration of an animation in flash to explain cellular metabolism.

Another use of the applets generated for shockwave is to allow for practice with the content that you are teaching. Dr. Rieber has done much with WWILD Team.

Tools:

Macromedia's Flash and Director Browse their site for many more examples

Skills:

Very good computer tool user (best if they are trained with these tools) or some programming
 
 

Authorware (Shockwave)

Authorware is a tool that is much more oriented towards training than most any other product on the market (Toolbook would be the exception). One of the advantages of this tool, is that you can develop both for the web and CD-ROM. You just shock the pieces that you want on the web. This tool can be used for all four instructional events. There are many built in functions for question asking which is well suited for Evaluation.

Here is a very good children's example by Allen Bullock

Tool

Authorware

Skills

Authorware; Programming may help here as well
 
 

Applets in Java

You can also create an applet that does not require a shockwave plugin (though with version 5 of IE, shockwave is already packaged with the browser). Java is the tool for this (others such as C++ will work as well). It is a programming tool that is cross platform and is designed for use on the web. The only drawback is that it is a programming language, not a tool. It can be used to create a highly interactive module for the purpose of practice.

A good example is the the Chat Rooms in WebCT. See the link below:

Skills

Definitely programming
 
 

Communication Software

This category of web application is a very interactive one, but it does not necessarily fit the 4-event model described above. A more current model for learning is called Cognitive Apprenticeship. Within this model are the dual ideas of Articulation and Reflection. These two "methods" can be easily implemented in these applications. Also, a hallmark of the Cognitive Apprenticeship is collaboration. These tools also support collaboration. There are basically two kinds of web-based communications software - Bulletin boards and chats. I personally use chat for office hours and the bulletin boards for problem solving. Here is a link to a WebCT demo class.

Tools

There are many programs on the market. Of course there is WebCT, at Epic they use Eshare and there are many others. Another emerging solution is an authoring tool for the web that integrates all these things.

Skills

MIS to set it up and a good community builder to run it.