Raffaella Negretti

CLA Università di Verona

L’Authoring per la didattica su internet

Per l’authoring su Internet, cioè la creazione di esercizi interattivi, attività didattiche e test da svolgere on-line, vi sono diverse possibilità.

Da una parte troviamo sistemi autore molto potenti e sofisticati che consentono la creazione di attività multimediali complesse, quali "Authorware" della Macromedia o "Toolbook" di Asymetrix, utlizzati anche per la realizzazione di CD Rom. Molti di questi programmi permettono di produrre materiale anche per Internet, "esportando" così sul web un’impostazione dell’attività concepita inizialmente per l’uso locale tramite appunto CD Rom.

Sono invece spesso sottovalutate le interessanti possibilità che offrono alcuni elementi dell’HTML, il linguaggio di creazione delle pagine web, ed il Javascript, una derivazione meno potente di "Java", il linguaggio di programmazione per Internet, con la caratteristica però di non richerdere alcun file esterno ma di essere integrato direttamente all’interno del codice HTML della stessa pagina web, e quindi riconosciuto e processato direttamente dal browser di navigazione (Netscape) senza la necessità di alcuna ulteriore applicazione.

Analizzeremo in seguito quali siano i vantaggi e gli svantaggi legati all’utilizzo di delle due modalità operative, da una aprte i sistemi autore multimediali edall’altra il codice HTML ed il linguaggio Jvascripti, per il momento soffermiamoci sulla descrizione di questi ultimi, vedendone il funzionamento e quali siano le possibilità applicative per la didattica on-line..

Per quanto riguarda l’HTML, uno strumento molto duttile è quello della form, cioè del modulo in cui inserire dati, che questo codice consente di creare all’interno di una pagina web, e che può essere proficuamente adattato per esercizi, test e quiz con un po’ di fantasia ed inventiva. Esistono in commercio numerosi programmi di editing di pagine web che facilitano il compito di creare questi moduli, per quanto riguarda il Javascript invece non vi è questa possibilità, ed è necessario conoscere il linguaggio ed avere competenze di programmazione.

Vediamo come appare una form all’utente:

Come si nota, il codice HTML consente di creare all’interno di una pagina web numerosi campi di input, cioè aree in cui l’utente può inserire dati od operare una scelta tra diverse opzioni che possono anche essere pre-selezionate.

Troviamo campi in cui inserire del testo, sia breve sia lungo, pulsanti per la selezione di più opzioni contemporaneamente (checkbox) o di una sola tra varie (radio):

Sempre per quanto riguarda la scelta multipla tra diverse opzioni, si può utilizzare anche il sistema dei menù a tendina:

In fondo ad ognuno di questi moduli, vi sono due pulsanti che permettono l’invio della form stessa per l’elaborazione dei dati, oppure la cancellazione completo di tutti i dati inseriti, in modo da poter ricominciare la compilazione dall’inizio. Questi moduli vengono inviati su Internet al computer che ospita le pagine web, l’elaborazione dei dati in essi inseriti viene fatta cioè sul server (computer) remoto, nel quale si trovano dei programmi appositi detti "Script CGI" (Common Gateway Interface).

Gli Script CGI hanno il compito di ricevere i dati della form, elaborarli e rimandare all’utente un output cioè una risposta, normalmente tramite un’altra pagina web. Il tipo di operazione di dati che questi script compiono nel processare i dati può essere molteplice, dalla semplice conservazione (storage) delle informazioni, alla ricerca in un database, a vere e proprie funzioni applicative. Sono veri e propri programmi, scritti in linguaggi quali Perl, C++ o Visual Basic. In potenzialità quindi questi programmi sono in grado di fare di tutto con i dati ricevuti.

Tra gli svantaggi principali che si possono individuare nell’utilizzo di moduli (form) e Script CGI per l’elaborazione di attività didattiche ed esercitative on-line vi sono:

• La lentezza di elaborazione della risposta, spesso connessa a problemi "fisici" di trasmissione dei datti sulla rete, non sempre i collegamenti sono veloci.
• I linguaggi di programmazione per l’elaborazione degli Script CGI sono estremamente complessi pur essendo molto potenti e duttili, per cui sono necessarie competenze approfondite di programmazione. Inoltre le tipologie di campo di input che si possono avere in un modulo on-line sono limitate.

Ecco infine come appare la "sorgente" del modulo illustrato, cioè il codice HTML corrispondente che permette la creazione della pagina web contente la form:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">

<HTML>

<HEAD>

<TITLE>Esempio di form in HTML</TITLE>

<META NAME="Author" CONTENT="Raffaella Negretti">

</HEAD>

<BODY BGCOLOR="#CDCDCD" VLINK="#871F78">

<H3 ALIGN=CENTER><FONT COLOR="#9932CD" SIZE=+0>Esempio di form</FONT></H3>

<P><FORM ACTION="http://www.muri.pazzi.it/cgi-bin/form.esempio" METHOD="post"></P>

<P><FONT SIZE=-1 COLOR="#FFFF80">Input di testo breve<BR>

</FONT>Singole parole. Pu&ograve; essere utilizzato con efficacia per la

creazione di cloze-tests, oppure per la richiesta di dati: </FONT><BR>

</P>

<CENTER><TABLE BORDER=1 BGCOLOR="#C0C0C0" >

<TR><TD><FONT SIZE=-1>Nome</FONT><BR>

<INPUT NAME="nome" TYPE="text" SIZE="20"></TD></TR>

</TABLE></CENTER>

<HR WIDTH="80%"></P>

<CENTER><TABLE BORDER=1 BGCOLOR="#C0C0C0" >

<TR><TD><FONT SIZE=-1><FONT COLOR="#FFFF80">Caselle Checkbox<BR>

</FONT>permettono una selezione multipla:<BR>

ES: Che lingue parli?<BR>

Italiano <INPUT NAME="lingue" TYPE="checkbox" VALUE= "italiano" checked"><BR>

Inglese <INPUT NAME="lingue" TYPE="checkbox" VALUE= "inglese"><BR>

Francese <INPUT NAME="lingue" TYPE="checkbox" VALUE= "francese"><BR>

Tedesco </FONT><INPUT NAME="lingue" TYPE="checkbox" VALUE= "tedesco"></TD>

<TD VALIGN=TOP><FONT SIZE=-1><FONT COLOR="#FFFF80">Bottoni Radio<BR>

</FONT>permettono un'unica selezione tra pi&ugrave; opzioni:<BR>

Es: Quale &egrave; il significato di HOLIDAY?<BR>

Domenica <INPUT NAME="holiday" TYPE="radio" VALUE="domenica"><BR>

Vacanza <INPUT NAME="holiday" TYPE="radio" VALUE="vacanza"><BR>

Riposo </FONT><INPUT NAME="holiday" TYPE="radio" VALUE="riposo"></TD></TR>

</TABLE></CENTER>

<P><FONT SIZE=-1><FONT COLOR="#FFFF80">Menu a tendina<BR></FONT>

<SELECT NAME="autore"><OPTION SELECTED>William Blake <OPTION>Wordsworth

<OPTION>Coleridge <OPTION>Shelley <OPTION>Byron <OPTION>Keats </FONT></SELECT></P>

<P><FONT SIZE=-1><FONT COLOR="#FFFF80">Aree di testo<BR></FONT>

<TEXTAREA NAME="sommario" ROWS=10 COLS=60></TEXTAREA></P>

<P> <FONT COLOR="#FFFF80">pulsanti</FONT>,

<CENTER><P><INPUT NAME="submit" TYPE="submit" VALUE="correzione"><BR>

<INPUT NAME="clear" TYPE="reset" VALUE="annulla"></P></CENTER>

</BODY>

</HTML>

Per avere un’idea di come questi moduli possano essere utilizzati in ambito glottodidattico, vediamo come appare un ipotetico test di inglese di lettura comprensione. Lo schermo viene diviso in due finestre (frame), da una parte il testo di lettura, dall’altra appaiono diversi esercizi a scelta multipla creati appunto tramite l’utilizzo dell’HTML per l’elaborazione di form.

Il testo di questo esercizio è tratto da un esempio del programma Wincalis, al fine puramente esemplificativo di dimostrare come le stesse attività possano essere elaborate per uso locale con funzionalità multimediali e per un uso in linea, con caratteristiche ovviamente molto diverse.

Una valida alternativa all’uso di programmi ScriptCGI per la correzione di moduli HTML, ma non solo, è l’utilizzo del linguaggio Javascript. Si tratta di un vero e proprio linguaggio di programmazione, derivato dal linguaggio Java appositamente per essere riconosciuto dal browser "Netscape" al momento stesso della "lettura" del codice HTML delle pagine web. A differenza degli script CGI, in cui l’applicazione si trova nel computer remoto (server), abbiamo in questo caso un’applicazione client, in cui cioè l’elaborazione dei dati e tutte le operazioni in generale vengono compiute sul computer dell’utente, grazie al browser, senza la necessità di inviare alcunché in rete ed attendere la risposta.

Il linguaggio Javascript è stato infatti concepito in modo da poter essere contenuto all’interno del codice HTML stesso di una pagina, nella testata o "head" del documento, a differenza di Java che, pur essendo più potente, richiede delle applicazioni esterne (applet) per funzionare. Tramite Javascript si possono realizzare numerose funzioni nel documento web che lo contiene, animazioni, comparsa di messaggi predefiniti in relazione ad alcuni eventi che l’utente determina (ad es. cliccando un’immagine o una parola), fino alla correzione di moduli (form) come quelli esemplificati in precedenza.

Queste potenzialità si rivelano interessanti soprattutto in combinazione con finestre (frame) che consentono la suddivisione dello schermo in aree destinate a funzioni specifiche, correlate tra loro. Grazie a questi strumento si possono realizzare attività glottodidattiche e didattiche in generale anche sofisticate e complesse.

Vediamo come esempio quest’attività di lettura/comprensione per la lingua inglese, basata su un testo di poesia ("The Tyger") di William Blake, da me elaborata in via sperimentale per il Centro Linguistico d’Ateneo, in collaborazione con Francesco Pontarollo del Centro di Calcolo dell’Università di Verona per la parte di scrpting. Essa è stata strutturata in tre fasi: presentazione del testo e di alcune domande di aiuto nella focalizzazione del significato, domande sul contenuto vero e proprio del testo ed infine informazioni generali sull’autore e la sua opera. Un percorso didattico "inverso" se si vuole a quello tradizionale della didattica dei testi letterari.

Ciò risponde alle necessità dell’educazione on-line, una strutturazione che cerca di rispettare le particolarità della didattica su Internet. Come evidenziato nella recente TCC On-line Conference , dal titolo "Trend and Issues in On-line Instrauction", (Kilian;1997), l’educazione tramite queste tecnologie informatiche ha delle peculiarità specifiche legate al mezzo stesso le quali non possono essere ignorate e che sono elemento di distinzione da, diciamo, software CALL multimediale ed altri strumenti informatici.

Tra gli elementi di caratterizzazione più salienti di questa modalità di apprendimento/acquisizione troviamo innanzi tutto una maggiore necessità di coinvolgimento dovuta alla distanza e spesso alla situazione di self-access in cui il discente si trova. Quindi viene la caratteristica dell’ipertestualità, molto più "allargata" potenzialmente rispetto a quella presente nel software didattico, la quale per altro risponde forse ad un modello cognitivo più naturale per l’uomo, più aderente ai processi di elaborazione del pensiero tipici del funzionamento cerebrale (Bolter;1997).

Lo studente ha un maggior potere decisionale sul proprio processo di apprendimento, può stabilire quale percorso didattico, invertire l’ordine con cui i materiali vengono proposti dall’ideatore, approfondire alcune parti dell’attività piuttosto che altre. Ciò d’altro canto implica lo sviluppo di una capacità di elaborazione critica ed analisi, "we have to learn to exercise judgment" (Lemke;1997).

Ecco la prima fase: a destra in alto la finestra piccola con sfondo blu scuro è destinata a fornire spiegazioni generali su come svolgere l’attività, ed in generale vi compaiono di volta in volta le informazioni. Sotto troviamo un primo esercizio, di "preparazione alla comprensione", in cui le domande hanno più che altro la funzione di focalizzare l’attenzione del discente su punti focali del testo la cui comprensione è necessaria per cogliere il senso sia letterale che connotativo del testo poetico. A seconda della risposta, l’utente riceverà dei messaggi nella finestra a sinistra, i quali possono contenere sia indicazioni in merito alla correttezza della scelta sia ulteriori commenti ed informazioni di supporto per la piena comprensione.

Nella finestra a sinistra abbiamo infine il testo, in cui alcune parole sono sottolineate, se vengono cliccate infatti nella finestra blu in alto a destra compare il dizionario con la spiegazione del termine relativo.

La seconda fase dell’attività prevede l’utilizzo del modulo HTML per la creazione di un esercizio a scelta multipla. Come per la fase precedente, abbiamo il testo sulla sinistra, e possiamo decidere di utilizzare un piccolo dizionario oppure di andare subito alla pagina web che contiene le informazioni sul poeta Blake.

La correzione di questi esercizi è immediata, in quanto viene effettuata tramite appunto uno script in Javascript che si cela all’interno del codice del documento stesso. Grazie ad esso, oltre alla correzione delle risposte possiamo anche stabilire quali messaggi devono comparire all’utente, in quale finestra, e volendo inserire anche altre funzioni tipo audio, un timer ed altro ancora. Ecco come appare lo script in Javascript di questa seconda fase, come si nota è semplicemente stato inserito all’interno dell’ head del documento HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">

<HTML>

<HEAD>

<TITLE>blake2.htm</TITLE>

<META NAME="author" CONTENT="Raffaella Negretti]">

<SCRIPT>

var Correct1 = ""

var Correct2 = ""

var Correct3 = ""

var ThisQ = ""

var CorrectAnswer = ""

function rightAnswer() {

parent.frames[0].document.clear();

parent.frames[0].document.open();

parent.frames[0].document.writeln ("<html>");

parent.frames[0].document.writeln ("<body bgcolor = FFFFFF text = BA050A>");

parent.frames[0].document.writeln ("<font size = +1>");

parent.frames[0].document.writeln ("<center>");

parent.frames[0].document.writeln ("<b>Correct!");

parent.frames[0].document.writeln ("<br>Well done.</b>");

parent.frames[0].document.writeln ("</center></font></body></html>");

parent.frames[0].document.close();

}

function wrongAnswer() {

parent.frames[0].document.clear();

parent.frames[0].document.open();

parent.frames[0].document.writeln ("<html>");

parent.frames[0].document.writeln ("<body bgcolor = FFFFFF text = BA050A>");

parent.frames[0].document.writeln ("<font size = +1>");

parent.frames[0].document.writeln ("<center>");

parent.frames[0].document.writeln ("<b>Sorry.");

parent.frames[0].document.writeln ("<br>Try again!</b>");

parent.frames[0].document.writeln ("</center></font></body></html>");

parent.frames[0].document.close();

}

function allDone() {

parent.frames[0].document.clear();

parent.frames[0].document.open();

parent.frames[0].document.writeln ("<html>");

parent.frames[0].document.writeln ("<body bgcolor = FFFFFF text = BA050A>");

parent.frames[0].document.writeln ("<font size = +1>");

parent.frames[0].document.writeln ("<center>");

parent.frames[0].document.writeln ("<b>Well done.");

parent.frames[0].document.writeln ("<br>Thanks for taking the quiz.</b>");

parent.frames[0].document.writeln ("</center></font></body></html>");

parent.frames[0].document.close();

}

function checkAnswer() {

if (document.forms[0].q1[0].checked)

rightAnswer();

if (document.forms[0].q1[1].checked)

wrongAnswer()

if (document.forms[0].q1[2].checked)

wrongAnswer()

}

function ShowCorrect(CorrectAnswer) {

parent.frames[0].document.clear();

parent.frames[0].document.open();

parent.frames[0].document.writeln ("<html>");

parent.frames[0].document.writeln ("<body bgcolor = FFFFFF text = 150890>");

parent.frames[0].document.writeln ("<font size = +1>");

parent.frames[0].document.writeln ("<center>");

parent.frames[0].document.writeln ("<b>Here is a possible correct answer:<br>");

parent.frames[0].document.writeln ("<font color = BA050A>");

parent.frames[0].document.writeln (CorrectAnswer);

parent.frames[0].document.writeln ("</font color>");

parent.frames[0].document.writeln ("</b>");

parent.frames[0].document.writeln ("</center></font></body></html>");

parent.frames[0].document.close();

}

// end hiding scripting -->

</SCRIPT>

</HEAD>

Il linguaggio Javascript si presta quindi ad essere utlilizzato per numerose funzioni, il che chiaramente è molto utile in applicazione all’elaborazione di un’attività didattica on-line il più complessa possibile, senza dover rinunciare a standard qualitativi e di immediatezza del feedback.

Un altro esempio interessante è l’esercizio di "listening/comprehension" elaborato da Douglas Mills, dell’Intensive English Institute, University of Illinois, Urbana-Champaign.. In questo caso il linguaggio Javascript è stato utilizzato per introdurre audio e alcune funzionalità legate al riascolto di spezzoni ben precisi, nonché per la visualizzazione di messaggi legati ad eventi particolari durante lo svolgimento dell’attività e di un timer che cronometra il tempo massimo a disposizione.

L’esercizio è strutturato in cinque fasi, e si basa sull’ascolto/comprensione di un’intervista radiofonica. Nella prima fase di "predizione" (predict) lo studente deve rispondere alle domande (che rimangono le stesse per tutto l’esercizio) in base alle inferenze che riesce a fare sui contenuti partendo dal titolo dell’intervista e dall’argomento generale.

Segue la fase di ascolto vera e propria, in seguito alla quale bisogna rispondere alle domande contenute nel modulo in verde. L’uso del plug-in di Netscape "Realaudio" permette di ascoltare e riascoltare il brano più volte, interrompendo con delle pause l’ascolto. Nella finestra in alto a destra vengono fornite le spiegazioni per ogni fase:

Nella fase di correzione, oltre ad avere la percentuale di risposte esatte sul totale, nella casella accanto ad ogni risposta appare un messaggio che ci comunica il risultato, l’operazione è immediata ed è resa possibile tramite grazie all’uso del linguaggio Javascript. In questa fase è ancora possibile acoltare più volte il brano.

Nella fase successiva, di aiuto supplementare, sempre grazie a questo linguaggio si può avere la visualizzazione, nella casella accanto ad ogni domanda, del preciso spezzone audio (in min. e sec.) a cui si riferisce la domanda.

Come si vede, anche utilizzando del semplice HTML è possibile creare delle attività didattiche complesse e multimediali, che integrino numerose opzioni e funzioni anche personalizzabili al momento dall’utente.

In conclusione potremmo così riassumere i vantaggi e gli svantaggi legati all’utilizzo da una parte di form in combinazione con Script CGI e di form in combinazione con Javascript ed altri elementi HTML, in contrapposizione con sistemi di authoring multimediale più complessi e potenti:

BIBLIOGRAFIA