A PERL Script to Generate HTML Pages Containing Multiple-Choice Questions

1 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1

T H E C H E M I C A L E D U C A T O R h t t p : / / j o u r n a l s . s p r i n g e r - n y . c o m / c h e d r

© 1 9 9 6 S P R I N G E R - V E R L A G N E W Y O R K , I N C . 1 0 . 1 0 0 7 / s 0 0 8 9 7 9 6 0 0 5 5 a

Co mpu te rs in Chemis t ry

A PERL Script toGenerate HTMLPages ContainingMultiple-ChoiceQuestionsRONALD L. EARP AND BRIAN M. TISSUE*Virginia Polytechnic Institute and State UniversityBlacksburg, VA [email protected]

Educators can

concentrate on

developing

educational

content without

worrying about a

user’s computer

preferences….

his paper describes a World Wide Web (WWW)-based PERL script that generates hypertext markuplanguage (HTML) documents containing interactivemultiple-choice questions. The script reads

information from a separate data file on the WWW server andsends a form-based HTML page containing the question andchoices to the client. After the user selects an answer, the scriptevaluates the selection and returns a response page with anexplanation of the correct answer. This paper provides detailson adapting the script to other WWW servers, as well as a briefoverview of interactive WWW methods.

IntroductionThe World Wide Web (WWW) client-server architecture

T

2 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1


© 1 9 9 6 S P R I N G E R - V E R L A G N E W Y O R K , I N C . S 1 4 3 0 - 4 1 7 1 ( 9 6 ) 0 5 0 5 5 - 8

provides a graphical, operating-system-independent platform to develop and delivereducational material over the Internet [1–3]. Educators can concentrate on developingeducational content without worrying about a user’s computer preferences, and studentshave a consistent interface to access educational material. Many chemistry educators areusing the WWW to supplement traditional text and lecture methods, [4–6] includingonline homework and quizzes [7–10], interactive simulations [11], and as a means ofcommunication and collaboration [12, 13]. Simple Web pages, which are essentiallystatic and noninteractive, are described by hypertext markup language (HTML) [14].Most early Web sites were depositories to disseminate text, graphics, and computerfiles; however, by interfacing programming techniques with HTML, it is possible tobuild interactive Web pages for a variety of uses. As the capabilities of WWW browsershave increased, Website developers have added more sophisticated material forvisualization and interactivity. The interactive functions are primarily accomplishedusing HTML form elements [15], which provide the Web page interface to scripts andprograms [16, 17]. There are a variety of form elements ranging from multiple-choiceselections to text-entry fields. The user input can be processed by a script or program tosend the information to an email address, save it in a database, use it in calculations andreturn a response, or manipulate it by any other type of programming function.

The hyperlinks in hypermedia can provide in-context access to remedial, enrichment, orevaluation material. Educational hypermedia can be designed to follow a linearprogression, similar to print media, or can adopt other organizational models [10].Depending on the design, the user might have primary control over the path takenthrough the material and on how much time to devote to each topic. (As with print, thehypermedia author has no control over how much time the user actually spends readingthe material.) Links to self-evaluation questions can be placed at any location within ahypermedia document or set of documents. This provides a mechanism for users to testtheir understanding before continuing to new material. The immediate feedback providedby self-evaluation questions can alert a user to misconceptions and provide theopportunity to review the relevant tutorial documents. Although not implemented in thesimple example described in this paper, a script on a remote server can also log a user’susage and answers for tracking or testing purposes.

This paper describes a WWW-server-based script (mcsimple.cgi) that generates Webpages containing multiple-choice questions [18]. It is a part of our ongoing efforts todevelop and disseminate prototypes and development tools that allow educators to easily

3 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



incorporate interactive capabilities into WWW-based educational material. The script iswritten in PERL1 because the PERL interpreter and libraries are widely used for theWWW and are freely available [19, 20]. The script generates question-and-responsepages from information in a data file and is, therefore, generic and can serve all of themultiple-choice questions on a WWW server. Little or no scripting experience isnecessary to install the script on a WWW server, and the only system-administrativeconsideration is in file management, because each question is contained in a separatedata file. Once the script is installed on a WWW server (that allows CGI programs),interactive exercises can be added without knowledge of programming. An author writesthe question, choices, and explanation in a standard data file format, copies the data fileto the appropriate directory on the WWW server, and incorporates a hyperlink on a Webpage that calls the script and specifies a data file.

Overview of Interactive MethodsSeveral common programming methods for incorporating interactive material in Webpages are described here to provide an overall perspective for selecting the mostappropriate method for a desired task. The largest distinction between the differentinteractive methods is that some are client-side, in which all processing in done on theclient computer, and others are server-side, in which all processing is done on theWWW server. Client-side methods include client-side image maps, JavaScript,2 andJava. The question-and-answer information for client-side image maps and JavaScripts iscontained in the HTML file and users have access to the information by looking at theHTML source code. Server-side methods include server-side image maps, and scripts orprograms accessed through the Common Gateway Interface. Server-side methods aremost appropriate for delivering interactive exercises that access existing databases ofinformation or require tracking or grading capabilities. Client-side methods are mostappropriate for practice exercises. They have a major advantage in delivery speed overserver-side methods in that they transfer the processing load from the server to the clientmachine. This can be a very important consideration when trying to simultaneously serveinteractive material to a large number of users or if the exercises require repetitive 1 Commonly called Perl, although it is an acronym for Practical Extraction and Report Language.

2 Not to be confused with a server-side version of JavaScript, which is under development. Java andJavaScript are trademarks of Sun Microsystems.

4 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



actions. Combinations of client-side and server-side methods are possible. For example,a client-side JavaScript can check the format of data entry before it is submitted to aserver-side program for evaluation.

Multiple-choice exercises can be produced without any programming by simply usinghyperlinks for each answer choice. When a choice is selected, the link retrieves a newHTML page that indicates if the choice was correct or incorrect, and can provide anexplanation or a return link to try the exercise again. An extension of this simplehyperlink method is to use a clickable-image map, which is essentially an in-line imagewith active areas that define hyperlinks. This approach can not be extended tointeractive material that requires relational or calculational evaluation of a user’s input.These more sophisticated exercises require a programming method that can be interfacedto the Web.

JavaScript is an object-based scripting language that is supported by Netscape Navigator2.0 and equivalent browsers. It is like other scripting languages in that it is fairly easy touse, and it allows Web authors to write programs without a full-featured compiledlanguage [17]. The JavaScript code is contained in the HTML document, and thestatements are interpreted by the client’s browser. These scripts can recognize andrespond to a number of user events such as mouse clicks, form input, and pagenavigation. The Web browser provides all of the tools and resources to interpret andexecute the embedded code, making the scripts platform independent. Some JavaScriptprototypes for educational tasks are at our Website [18].

Java was developed by Sun Microsystems in an attempt to create a simple object-oriented and architecture-neutral programming language that would be highly portableand allow for the distribution of application programs over the Web [21]. Theseprograms, called applets, are included in HTML documents and are identified with aspecial applet tag. When the client’s Web browser encounters one of these tags, it willattempt to download the specified Java applet, interpret the Java object code, and run itin a window on the browser screen. Applets are stand-alone programs which canaccomplish a broad array of functions such as animation, calculations, graphing, etc.,and could find wide utility in the creation of interactive learning material. However, Javais a highly syntax-dependent language, requiring some programming skill3 by the applet 3 JavaScript is also at an early stage of development, but uses less rigorous variable typing and istherefore more forgiving.

5 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



author, and the language is still at an early stage of development. Microsoft® isdeveloping a similar technology called ActiveX™ [22]. Currently, Internet Explorer 3.0supports Java and ActiveX, but Netscape Navigator™ 3.0 supports only Java.

The Common Gateway Interface (CGI) is a standard protocol that allows information tobe passed between a browser program running on a client computer and an applicationprogram running on a WWW server. A *.cgi file contains the script or program that runson the server when a browser requests the file. CGI can interface to any language thatcan be executed on the Web server. C/C++, FORTRAN, TCL (Tool CommandLanguage), PERL, Microsoft VisualBasic™, Claris HyperCard™, and AppleScript® arecommon. Noncompiled languages, such as PERL, are usually preferred due to their easeof modification, maintenance, and debugging. CGI programs are executed on the WWWserver using the resources of the server computer. Processor-intensive applications orthe ability to serve many clients simultaneously can create a heavy load for a WWWserver, requiring a powerful computer. The advantages of the CGI interface are theability to use sophisticated programming languages and use of the server’s hard disk toaccess existing databases or log user responses.

To summarize my view of the current utility of these programming methods, JavaScriptis an easy and appropriate language to develop and deliver simple calculational ormultiple-choice practice exercises via Web pages. Java applets can also deliver simpleexercises. Because greater programming skill is required, Java is more suitable fordeveloping sophisticated applications such as teaching material that includes animationor structured presentations. In this regard Java is similar to plug-ins such as Shockwave,4

which display Macromedia Director®4 and Authorware®4 presentations in a browserwindow [23]. Server-side scripts or programs using the CGI interface can producesimple and sophisticated exercises, including simulations and graphical results. Thedelays that result from multiple Internet transfers when using CGI make it mostappropriate for online applications that access an existing database of information orquestions, or that log user responses for tracking or grading.

General Operation of the mcsimple.cgi ScriptThe question is initially accessed from a hyperlink on an existing Web page that calls the 4 Shockwave, Director, and Authorware are products of Macromedia® Corp.

6 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



mcsimple.cgi file. The following example illustrates the HTML code that would beplaced in an existing Web page to call the script:

<A HREF="/cgi-bin/mcsimple.cgi?filename=/usr/questions/questn1.qdf">Question 1</A>

The HREF call refers to the location of the script in Webspace. Webspace refers to thedirectory paths relative to the WWW server root, which is the upper-most directory thatbrowsers can access on a Website. Immediately following the script name is a questionmark, which indicates the beginning of the query string that is passed to the script. Inthis case the query string is the path and filename of the data file and includes the“filename=” as part of the syntax. Note that the path of the questn1.qdf data file is thefull path name starting from the computer root directory. The script is written to onlyopen data files with a *.qdf extension. A specific file extension is a security feature toprevent a user from using the script to attempt to view confidential files.

When a user clicks on this hyperlink, the browser calls mcsimple.cgi and passes it thename of the specified data file. The script reads the data file and returns a Web page tothe user containing the question, selectable radio buttons with the possible answers, and“Submit” and “Reset” buttons. When a user selects an answer and clicks on the“Submit” button, the script reads the same data file and generates a response page. Thisresponse page contains the question, the correct answer highlighted, a statementindicating if the user’s selection was correct or incorrect, and an optional explanation.The explanation can contain hyperlinks back to the Web page that first called thequestion, or to related review material. Figure 1 graphically illustrates the overallsequence. The left side of the figure depicts the actual HTML pages seen by the user.Figure 2 shows an example of a script-generated question page, and Figure 3 shows theresponse to this question after selection of the correct answer.

The Question Data filesThe data files contain the information from which the script generates the question andresponse pages. The data format is fixed as shown in the following example listing:

# The next two lines are the question title and subject displayed at the top of the web page.Self-Evaluation QuestionUV-VIS Spectroscopy# The next line is the question.What transition is responsible for the longest wavelength absorption band?# The next x lines are for the x number of answers for the question.

7 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



Highest occupied molecular orbital (HOMO) to lowest unoccupied molecular orbital (LUMO).sp<SUP>3</SUP> hybrid orbital to sp<SUP>2</SUP> hybrid orbital.Antibonding orbital to nonbonding orbital.# The next 2 lines contain the sequential number of the correct answer, and an explanation.1Remember the energy of a transition is the difference in energy between two energy levels.# The next four lines are dummy slots for features not implemented.NANANANA

The data file includes comment lines, indicated by the # signs, to mark the position ofinformation. These lines must be present for the script to read the file correctly. Eachline of the data file must be terminated with a hard return, and the question, answers, andexplanation should remain on a single line regardless of length.5 The two lines of dataafter the first comment line contain the title and header information that are displayed atthe top of the script-generated Web pages. The question is placed after the secondcomment line, and the answer choices are listed sequentially after the third commentline. The script determines the number of answer choices from the data file, so there isno restriction on the total number of possible choices. The server configuration andresources could limit the data file content in extreme cases. The numerical position ofthe correct answer in the list should be placed immediately following the fourth commentline. This value is determined by counting the answer choices with the first answerdefined as 1. The next line is for an optional explanation of the correct answer. If noexplanation is desired, a blank line should occupy this position in the data file. The lastfour lines are not used and only save space for features that might be added in the future.They must be present as place holders for the script to operate correctly. The content ofthe question, answer choices, and explanation can contain HTML codes such as italics,superscripts, subscripts, hyperlinks, line breaks, in-line images, etc., providing flexibleformatting of the question, answer, and explanation on the web pages. The header tagsfor the first two data lines, which list the question title and subject, are in the script andshould not be duplicated in the data file. The files for in-line images must be accessibleto the browser and should therefore be placed under the server root directory and notwith the data file.

5 Requires a text editor that does not permanently word wrap the text: Microsoft DOS Edit, MicrosoftWindows™ Notepad, or for Macintosh®, BBEdit Lite™, available at Bare Bones Software’s FreewareCollection, http://www.barebones.com/ freeware.html.

8 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



FIGURE 1. SCHEMATIC SHOWING THE OPERATION OF MCSIMPLE.CGI. THE WEB PAGES THAT A USER WOULDSEE APPEAR ON THE LEFT OF THE FIGURE.

Detailed Script OperationAppendix I provides an abbreviated table of PERL syntax and a listing of themcsimple.cgi script. Figure 4 is a flow chart of the stepwise operation of the script. Aswith general programming practice, variables are designated and initialized at thebeginning of program execution. The program retrieves the query string (the name of thedata file) using the cgi-utils.pl library. More information about cgi-utils.pl is availableat the Web site containing the library [24]. Error checking is performed to determinewhether or not the specified data file exists and if it has the proper *.qdf extension. If it

9 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



FIGURE 2. SCREEN CAPTURE OF A QUESTION PAGE GENERATED BY MCSIMPLE.CGI.

FIGURE 3. SCREEN CAPTURE OF A RESPONSE PAGE GENERATED BY MCSIMPLE.CGI AFTER A USER SELECTSTHE CORRECT ANSWER.

1 0 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



FIGURE 4. FLOW DIAGRAM OF THE INTERNAL OPERATION OF THE MCSIMPLE.CGI PERL SCRIPT.

does not exist an error message is printed; otherwise the data file is read into memory forinternal manipulation by the script.

Once the data file contents are in memory, the script determines if it is being called toprint a question or an answer page. This flow control is accomplished with a hiddenvariable in the form on the script-generated question page. If this variable is not present,the script prints the contents of the data file to a Web page in the question-page format.If the hidden variable is present, then the script operates in answer mode. In answermode the script first checks that the user selected an answer choice to prevent usersfrom getting the correct answers and explanation without providing their own input. If nochoice was selected, the script redisplays the question page. If a choice was selected, thescript prints a response page with the question, correct answer, and explanation. Oncethis process is complete, the script has no further interaction with the user.

1 1 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



Transferring the Script to Other WWW ServersThis script was written with PERL 5.0 [20] and should be compatible with PERL 4.0 orgreater. The script has been tested on a Silicon Graphics® Indy™ workstation runningIRIX™ UNIX® operating system 5.3 and Netscape HTTP server software version 1.1.Implementing the script requires access to a Web server that allows CGI programs, andhas the PERL interpreter installed. The script also requires a cgi-utils.pl library (locatedin a /usr/local/bin/perl directory as the script is written) [24]. In principle, the scriptshould work on any platform for which PERL and a compatible cgi-utils.pl library isavailable.

The script must be customized for the WWW server on which it is placed. The first lineof the mcsimple.cgi script informs the system where to look for the PERL interpreter andmight have to be changed depending on the system configuration. The variable“$question_path” near the beginning of the script must be changed to reflect the path tothe location of the mcsimple.cgi file on the system. The path is in system space, notWebspace, and will probably be something similar to /usr/your_Website_ root/cgi-bin/.On UNIX machines, the permissions of the script file must be set to be executable, andthe ownership should be set to be the same as the Web server software. There are alsovariables for the script answer response strings that can be changed depending on theapplication or perceived audience. These response strings are located near the beginningof the script and can be changed to suit individual preferences. Comments areinterspersed throughout the script to provide documentation to facilitate modification ofthe script.

The data files should be located on the same WWW server that is running themcsimple.cgi script. It is suggested that the data files not be stored under the server root,but elsewhere in the computer’s directory hierarchy. Storing the data files under theserver root allows users to easily view the contents of the data files, and hence theanswers. This simple precaution should be enough to prevent users from extractinginformation from the data files before answering the questions.

DiscussionThe script described in this paper is a refinement of scripts that we used to delivermultiple-choice questions in prelab exercises during Fall 1995 [9]. These first PERLscripts each contained the question and answer information, and separate scripts were

1 2 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



needed for each question. This approach was error-prone for adding new questions.Since the mcsimple.cgi script obtains information from separate data files, it is quiterobust. Once it is working on a server, adding more questions is straightforward, andtrouble-shooting is isolated to either the link calling the script or to the structure orcontents of the data file. Mcsimple.cgi calculates the number of answer choices afterreading the data file, so there is no limit on the number of possible choices for eachquestion. Since mcsimple.cgi was developed to be a flexible model, there are a numberof features that were not implemented, such as: more complete error checking, placingautomatic links back to the generating Web page, and randomizing question parameters.This last feature would produce individualized questions and make it more difficult forstudents to easily exchange answers, but it would require a more complicated andinflexible script. The mcsimple.cgi and mclog.cgi scripts do not allow for retry after anincorrect answer selection. Practice problems that allow multiple attempts can be moreefficiently implemented using JavaScript programming [18].

A more sophisticated version of the mcsimple.cgi script that requires the user to input aclass number and student ID is available at our Website [18]. This script, mclog.cgi, alsowrites information to a log file on the Web server. It currently logs for a given studentID number whether or not the question was answered correctly, but it could be modifiedto include the date, time, etc. The logging capability allows the script to be used fortracking and grading purposes. Although CGI scripts can log answers, they suffer fromthe intrinsic limitation of online examinations in that there is no means to proctor theexam takers. Lastly, a major disadvantage of using CGI programming, and the Internetin general, is the limited network bandwidth. Interactive exercises containing extensivegraphics can be very slow to transfer over the Internet and are more efficiently deliveredusing CD-ROM or a local-area network.

ACKNOWLEDGEMENT

This work was supported by the National Science Foundation through the Division ofUndergraduate Education (DUE-9455382), and a Chemistry Division CAREER award(CHE-9502460).

1 3 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



REFERENCES

1. Blackmore, M. A.; Britt, D. P. J. Biol. Educ. 1993, 27, 196.

2. Tissue, B. M. J. Chem. Educ. 1996, 73, 65.

3. Singh, R. P. Food Technology 1996, March, 95.

4. Umeå University, Chemistry Teaching Resources; http://www.anachem.umu.se/eks/pointers.htm;Knut Irgum, Analytical Chemistry, Umeå University, S-901 87 Umeå, Sweden.

5. The World Lecture Hall; http://www.utexas.edu/world/lecture/; University of Texas, Austin, TX,78712-1026.

6. ChemEd: Chemistry Education Resources; http://www-hpcc.astro.washington.edu/scied/chemistry.html; Alan Cairns, University of Washington, 3900 7th Avenue N. E., Seattle, WA,98133-5696; email: [email protected].

7. New CyberProf Homepage—Index; http://cyber.ccsr.uiuc.edu/cyberprof/index.html; Alfred W.Hübler and Board of Trustees of the University of Illinois, email: [email protected].

8. Arizona State University, On-line exams; http://asnmr4.la.asu.edu/pchem/exams/442_exam.htm;Jeff Yarger, Tempe, AZ, 85287; email: [email protected].

9. Tissue, B. M.; Earp, R. L.; Yip, C.W. Chem. Educator 1996, 1(1):S 1430-4171(96)01010-2.Avail. URL: http://journals.springer-ny.com/chedr/.

10. Tissue, B. M. “Development and Delivery of Chemical-Education Hypermedia Using the World-Wide Web” Presented at ChemConf '96, http://www.chem.vt.edu/archive/chemconf96/paper04.html; Brian Tissue, Virginia Polytechnic Institute and State University, Blacksburg, VA,24061-0212; email: [email protected].

11. Arizona State University, Physical Chemistry Tutorials; http://asnmr4.la.asu.edu/pchem/quantum.htm; Jeff Yarger, Tempe, AZ, 85287; email: [email protected].

12. Long, G.; Howald, R.; Miderski, C. A.; Zielinski, T. J. Chem. Educator 1996, 1(3):S1430-4171(96)03032-4. Avail. URL: http://journals.springer-ny.com/chedr/.

13. On-line Chemistry Course Home Page; http://www.py.iup.edu/college/chemistry/chem-course/webpage.html; George Long, Ph.D.; email: [email protected].

14. World-Wide Web home page and information on HTML; http://www.w3.org/pub/WWW/MarkUp/MarkUp.html; The W3C Team at MIT, Massachusetts Institute of Technology,Laboratory for Computer Science, 545 Technology Square, Cambridge, MA, 02139;email: [email protected].

1 4 / V O L . 1 , N O . 5 I S S N 1 4 3 0 - 4 1 7 1



15. Information on Forms and how they work; http://www.webcom.com/webcom/html/tutor/forms/intro.html; Web Communications, 125 Water Street, Suite A1, Santa Cruz, CA,95060; email: [email protected].

16. How to Set Up and Maintain a World Wide Web Site; Addison Wesley: Reading, MA, 1995;http://www-genome.wi.mit.edu/WWW/; Lincoln D. Stein, Whitehead Institute/MIT Center forGenome Research, Cambridge, Massachusetts; email: [email protected].

17. Reyonlds, M. C.; Wooldridge, A. Special Edition Using JavaScript; Que: Indianapolis, IN, 1996.

18. Working examples of mcsimple.cgi and other scripts can be found at:http://www.chem.vt.edu/chem-ed/CHP/scripts/index.html; Ron Earp and Brian Tissue, VirginiaPolytechnic Institute and State University, Blacksburg, VA, 24061-0212; email: [email protected].

19. Till, D. Teach Yourself PERL in 21 Days; Sams Publishing: Indianapolis, IN, 1995.

20. The PERL Language Home Page; http://perl.com/perl/index.html.

21. Java—Programming for the Internet; http://java.sun.com/; Sun Microsystems, Inc., 2550 GarciaAve., Mtn. View, CA, 94043-1100; email: [email protected].

22. Microsoft Corporation; http://www.microsoft.com; One Microsoft Way, Redmond, Washington,98052-6399.

23. Macromedia: Shockwave Center; http://www.macromedia.com/shockwave/; Macromedia,Incorporated, 600 Townsend Street, San Francisco, California, 94103.

24. Cgi-utils library required for script operation; http://www-genome.wi.mit.edu/WWW/tools/scripting/cgi-utils.html; Lincoln D. Stein, Whitehead Institute/MIT Center for Genome Research,Cambridge, Massachusetts; email: [email protected].

Documents

A PERL Script to Generate HTML Pages Containing Multiple-Choice Questions