Le guide de Hot Potatoes 6

VERSION 1.0
Ce guide est librement tlchargeable sur http://www.sequane.com/hp Vous tes libre de copier, distribuer et utiliser ce document pour l'adapter vos besoins selon les conditions suivantes:

Vous devez conserver les notices de droits d'auteur. Vous ne pouvez pas utiliser ce document des fins commerciales, le revendre ou l'inclure dans des formations payantes sans le consentement de l'auteur.

2004 Fabien Olivry Page 1 de 57

Le guide de Hot Potatoes 6

Table des matires

Installation et mise en route....................................................................................................4 Licence...............................................................................................................................4 Installer Hot Potatoes.........................................................................................................5 Choisir la langue d'interface...............................................................................................6 L'cran d'accueil.................................................................................................................7 La barre d'outils..................................................................................................................9 Quelques conseils avant de commencer..........................................................................10 Les cinq systmes-auteurs...................................................................................................12 JQuiz................................................................................................................................12 QCM.............................................................................................................................12 L'option Quiz................................................................................................................14 L'option Multi-slection.................................................................................................16 L'option Hybride...........................................................................................................17 Le mode avanc...........................................................................................................17 JCloze..............................................................................................................................19 Jmatch..............................................................................................................................21 Jcross...............................................................................................................................23 Jmix..................................................................................................................................25 Options communes aux diffrents systmes-auteurs...........................................................27 Ajouter une minuterie.......................................................................................................27 Insrer un clavier virtuel ..................................................................................................28 Modifier l'ordre des questions, faire une banque de questions.........................................29 Insrer un document ressource .......................................................................................29 Modifier l'aspect des pages..............................................................................................30 Fonctionnalits multimdia et hypermdia............................................................................32 Insrer des images...........................................................................................................32 Configuration d'une image...........................................................................................33 O trouver des images?...............................................................................................34 Insrer des liens...............................................................................................................36 Lien vers un site web...............................................................................................36 Insrer des sons et des vidos ........................................................................................38 Encodage en MP3/Ogg................................................................................................39 Encodage en Windows Media......................................................................................39 Encodage en RealAudio/Vido................................................................................44 Insertion des sons/vidos dans les exercices..........................................................46 Crer son site Web...............................................................................................................48 Configurer les liens entre les exercices ...........................................................................48 Crer la page d'accueil.....................................................................................................49 Problmes courants .............................................................................................................51 Glossaire..............................................................................................................................54 Liens utiles............................................................................................................................56 2004 Fabien Olivry Page 2 de 57

Le guide de Hot Potatoes 6

Installation et mise en route

Hot Potatoes est une suite logicielle cre par l'universit de Victoria, ColombieBritannique, Canada. Elle permet son utilisateur de crer six diffrents types d'exercices et de les publier sur l'internet.

Licence
Il est permis d'utiliser gratuitement Hot Potatoes pour une utilisation non-commerciale. Vous trouverez ci-dessous la licence telle qu'elle figure sur le site :

Pour une utilisation commerciale, une licence monoposte cote environ 100 (100 $US ou

2004 Fabien Olivry Page 3 de 57

Le guide de Hot Potatoes 6 150 $CAN)... Il existe diffrents types de licence pour de plus larges institutions, se reporter au site original pour de plus amples informations.

Installer Hot Potatoes

Vous

pouvez

tlcharger

l'archive

de

Hot

Potatoes

depuis

le

site

original

http://Web.uvic.ca/hrd/hotpot, dans la section downloads. Choisissez la version autoextractible (self-extract). Excutez ensuite le fichier que vous avez obtenu (winhotpotxx.exe dans le cas d'un PC utilisant Windows). Pour pouvoir bnficier de toutes les fonctionnalits, vous devez vous enregistrer. Cette formalit est gratuite. Pour ce faire, rendez vous sur le site original et slectionnez l'option Register. Remplissez le formulaire reproduit ci-dessous:

2004 Fabien Olivry Page 4 de 57

Le guide de Hot Potatoes 6

Vous recevrez par courriel un code correspondant votre nom d'utilisateur. Lancez ensuite n'importe lequel des six sous-programmes de Hot Potatoes et rendez vous dans le menu Help ou Aide et slectionnez l'option Register ou Enregistrement . Saisissez votre nom d'utilisateur et votre code et validez. Vous recevrez alors l'cran un message de confirmation de votre enregistrement.

Choisir la langue d'interface

la fin de l'installation, un cran apparatra vous permettant de spcifier quelle langue vous voulez utiliser. Dans le cas du franais, vous devez choisir le fichier nomm franais6.hif. Il est possible d'utiliser, si vous le prfrez, les langues suivantes : anglais, nerlandais, allemand, espagnol, italien, portugais, catalan, finnois... Le choix d'une langue s'appliquera l'ensemble des six modules de Hot Potatoes. Le choix de langue effectu ne s'appliquera qu' l'interface (la partie professeur) et non aux exercices, la partie tudiants. Nous verrons par la suite comment faire pour changer la langue des consignes et commentaires (feedback) dans les pages exercices cres.

2004 Fabien Olivry Page 5 de 57

Le guide de Hot Potatoes 6

L'cran d'accueil
Quand vous cliquez sur l'icne de Hot potatoes, vous obtenez l'cran suivant:

Chacune des pommes de terre correspond un type d'exercice. En fonction de ce que vous souhaitez raliser, cliquez sur la pomme de terre correspondante, savoir :

2004 Fabien Olivry Page 6 de 57

Le guide de Hot Potatoes 6 pour crer des questionnaires choix multiples ou un questionnaire o l'tudiant doit taper la rponse.

pour crer un exercice o l'tudiant doit remettre en ordre des segments de phrase.

pour crer des mots-croiss

pour crer des exercices de mise en correspondance (par exemple : deux parties d'une phrase ou une image et un texte) pour crer des exercices trous, appels aussi tests de closure ou textes lacunaires.

Hot Potatoes vous permet de raliser de manire trs intuitive des exercices destins tre publis sur internet ou intranet que ce soit pour de l'autoapprentissage ou un apprentissage traditionnel en prsentiel. Bien que relativement limite, cette suite possde de nombreux 2004 Fabien Olivry Page 7 de 57

Le guide de Hot Potatoes 6 avantages :

o

Gratuit : si les pages produites sont accessibles librement, la licence d'utilisation est gratuite. Varit : les six programmes de Hot Potatoes permettent de raliser des exercices varis tels que tests de closure, Q.C.M.s, mots-croiss, exercices d'association etc. mettant en jeu diffrentes stratgies d'apprentissage et comptences chez l'apprenant.

Chacun des programmes possde de plus diffrentes options qui permettent de crer des productions personnalises. Ainsi, la possibilit d'insrer des feedbacks complets, expliquant l'apprenant les raisons de son erreur, peut permettre l'apprenant de travailler en autonomie.

Non linarit : HotPotatoes reposant sur le code HTML, il est possible d'intgrer de nombreux liens et de renvoyer l'apprenant des sites Web externes, quitter un apprentissage en cours pour aller travailler sur une stratgie particulire ou pour se reporter un ouvrage de rfrence (fiche de grammaire, dictionnaire, support de cours etc...)

Personnalisation : Les diffrents modules peuvent tre personnaliss. Le code de chacun des programmes peut tre modifi afin de mieux s'adapter ses objectifs pdagogiques. Les couleurs, polices etc. peuvent tre changes afin de s'insrer dans la ligne graphique de votre site actuel.

Intuitivit : Hot Potatoes est un programme simple prendre en main qui permet l'enseignant de produire, quel que soit son niveau de comptence informatique, son propre site pdagogique sans avoir connaissance du code HTML et de javascript.

Multimdia : Depuis la version 6, l'insertion d'lments multimdias a t simplifie. Vous pouvez donc insrer vidos, images, sons, animations flash de manire intuitive.

La barre d'outils

2004 Fabien Olivry Page 8 de 57

Le guide de Hot Potatoes 6 La barre d'outils est trs similaire quel que soit le programme de Hot Potatoes utilis. Vous gagnerez du temps connatre la fonction associe chaque icne ou les raccourcis clavier. Nouvel exercice Ouvrir un fichier d'exercice (au format Hot Potatoes) Enregistrer Enregistrer sous Ajouter un texte support Exporter pour navigateurs de gnration 6 Exporter pour navigateurs de gnration 6 en glisser dposer Quitter Annuler Couper Copier Coller Insrer une image depuis un fichier local Insrer une image depuis une adresse Web Insrer un lien vers un fichier local Insrer un lien vers une adresse Web Insrer des caractres unicode Configurer le rsultat Voir le fichier d'aide (en anglais)

Il est aussi possible de modifier la barre d'outils afin d'y faire figurer des icnes qui correspondent aux fonctions que vous utilisez le plus. Lancez un des programmes de la suite et allez dans le menu options, slectionnez alors options de la barre d'outils. Il ne vous reste qu' cocher les cases relatives aux commandes que vous voulez faire figurer sur votre barre.

Quelques conseils avant de commencer

Avant de vous lancer dans la ralisation de vos exercices, il est quelques rgles respecter afin de s'viter des soucis inutiles. Si vous dbutez et que vous avez encore du mal vous 2004 Fabien Olivry Page 9 de 57

Le guide de Hot Potatoes 6 reprsenter la faon dont les pages Web s'agencent, il est conseill de crer un rpertoire o vous stockerez tous les fichiers (images et pages Web) qui composeront votre exercice ou votre site. Dans le choix des noms de fichiers, il est recommand de ne pas utiliser de caractres spciaux tels que ponctuation, espaces, lettres accentues etc... De mme, vitez de mlanger la casse et sauvegardez tous vos noms de fichiers en minuscules (si la diffrence minuscule/majuscule n'est pas pertinente pour un systme d'exploitation comme Windows, elle l'est pour Linux et autres Unix qui seront sans doute les systmes d'exploitation employs sur les serveurs ou vous publierez vos pages). Sauvegardez toujours vos exercices au format Hot Potatoes avant de crer une page Web (en slectionnant l'option enregistrer, enregistrer sous ou en cliquant sur les icnes correspondantes). Si vous veniez fermer le programme par erreur, vous seriez oblig de saisir nouveau toutes les donnes pour modifier votre exercice ou de vous plonger dans le code HTML et JavaScript, ce qui est fastidieux et prsuppose quelques connaissances de programmation.

2004 Fabien Olivry Page 10 de 57

Le guide de Hot Potatoes 6

Les cinq systmes-auteurs

JQuiz
JquizestunmodulespcialauseindelasuiteHotPotatoes.Ilpermeteneffetderaliser troistypesd'exrcices. e LorsquevouslancezJquiz,voustrouverezsurladroitedel' interfaceunelistedroulante vouspermettantdechoisirqueltypedequestionvoussouhaitezcrer:

L'option QCM permet de crer un questionnaire choix multiple standard. L'option Quiz permet de crer un test rponse courte. L'apprenant doit saisir la rponse au clavier. L'option Hybride permet de crer un type d'exercice o l'apprenant commencera par une question rponse courte. Il devra saisir la rponse au clavier. S'il n'y arrive pas directement, la question sera alors transforme en QCM afin de faciliter sa tche.

L'option Multi-slection cre un QCM o plusieurs rponses doivent tre valides afin que la rponse soit compte comme correcte.

QCM
L'option QCM correspond l'ancien module JBC, prsent dans les versions prcdentes de Hot Potatoes. Si vous les connaissiez, vous ne devriez pas tre dpays. Cette option permet de crer des questionnaires choix multiple incluant ventuellement rtroactions, images, lments multimdia, texte support... Pour crer un exercice, saisissez : 1. Le titre 2. La question que vous voulez poser. 2004 Fabien Olivry Page 11 de 57

Le guide de Hot Potatoes 6 3. Toutes les possibilits de rponses et de rtroactions. Si vous ne mettez pas de rtroaction, le programme utilisera une rtroaction par dfaut. 4. Cochez la ou les bonne(s) rponse(s) : 5. Vous pouvez rajouter une question en appuyant sur la flche vers le haut . Vous devriez

voir le numro de question incrment comme ceci: Rptez alors les premires tapes. 6. Enregistrez votre exercice au format Hot Potatoes en appuyant sur l'icne disquette Vous pouvez aussi l'enregistrer en utilisant la commande Fichier puis enregistrer ou enregistrer sous. En enregistrant le fichier au format Hot Potatoes, vous aurez la possibilit de le modifier volont par la suite. 7. Crez enfin la page Web finale. Cliquez pour ce faire sur l'icne . Donnez un nom au

fichier, si vous choisissez par exemple le nom exercice, vous obtiendrez le fichier exercice.htm. Le programme vous demande alors si vous voulez voir l'exercice maintenant. Rpondez oui. Vous pouvez aussi visualiser tout moment un fichier dj cr en l'ouvrant dans votre navigateur.

2004 Fabien Olivry Page 12 de 57

Le guide de Hot Potatoes 6

Rappel : Si vous dsirez publier vos exercices sur Internet, donnez vos pages HTML des noms ne contenant pas d'espace, d'accents ou de caractres spciaux et n'utilisez de prfrence que des minuscules dans les noms de vos fichiers (les pages page.htm et Page.htm sont considres comme deux pages diffrentes pour un serveur Unix qui est sensible la casse).

L'option Quiz
L'option Quiz correspond au module JQuiz dans les versions prcdentes de Hot Potatoes. Jquiz permet de faire des questionnaires o l'tudiant doit saisir la rponse au clavier. Pour crer un exercice, saisissez : 2004 Fabien Olivry Page 13 de 57

Le guide de Hot Potatoes 6 1. Le titre 2. Saisissez votre question. 3. Saisissez les diffrentes rponses possibles cette question. Il convient de choisir des questions relativement fermes pour que cette tche ne soit pas trop fastidieuse. Essayez de prvoir les rponses que pourraient proposer vos apprenants : pour une date par exemple, ils peuvent rpondre en crivant la date en toutes lettres ou en utilisant des chiffres, il conviendra donc de saisir ces deux possibilits de rponses. Contrairement l'option QCM, il n'y a pas de distracteurs ici, seules les bonnes rponses doivent tre saisies.

4 Passez la question suivante en cliquant sur la flche vers le haut

. Vous devriez voir le

numro de question incrment comme ceci: . question en reproduisant les premires tapes.

Vous pouvez alors rajouter une

5. Enregistrez votre exercice au format HotPotatoes en cliquant sur

. Vous pouvez aussi

l'enregistrer en utilisant la commande Fichier puis enregistrer ou enregistrer sous. En enregistrant le fichier au format Hot Potatoes, vous aurez la possibilit de le modifier volont par la suite. 6. Crez enfin la page Web finale en cliquant sur

2004 Fabien Olivry Page 14 de 57

Le guide de Hot Potatoes 6

L'option Multi-slection
L'option multi-slection permet de crer des exercices o plusieurs possibilits de rponses constituent la bonne rponse. Une question slection multiple diffre profondment d'un QCM. Dans un QCM traditionnel, l'apprenant doit choisir une seule bonne rponse bien que plusieurs rponses puissent tre correctes. l'oppos, les questions slection multiple demandent l'apprenant d'effectuer un choix pour chacune des possibilits de rponse affiches. La cration d'un exercice se fait selon le mme principe que dans l'option QCM. Il convient cependant de vrifier les points suivants :

Chacune des possibilits de rponses constitutives de la bonne rponse doivent tre coches (cochez la case doit tre slectionne). Il est ncessaire d'crire une rtroaction pour chacune des possibilits de rponse en ayant l'esprit que cette rtroaction permettra l'apprenant de s'auto-corriger.

2004 Fabien Olivry Page 15 de 57

Le guide de Hot Potatoes 6

L'option Hybride
L'option hybride combine le type de question Quiz (questions rponse courte) avec le type de questions q.c.m. L'exercice se prsente tout d'abord sous la forme d'un quiz, si aprs un certain nombre d'essais (2 par dfaut), l'apprenant n'est toujours pas capable de saisir la rponse au clavier, la mme question lui est prsente sous forme de q.c.m. 2004 Fabien Olivry Page 16 de 57

Le guide de Hot Potatoes 6

Le mode avanc
JQuiz peut fonctionner de deux faons, en mode dbutant ou avanc. Le passage au mode avanc se fait via le menu Options / Mode / Mode Avanc comme illustr ci-dessous.

Le mode avanc permet d'introduire la pondration des questions et des rponses, en d'autres termes, une question peut tre de moindre importance au sein de votre exercice qu'une autre, une rponse peut tre partiellement juste. Le mode avanc vous permettra de dfinir les poids attribus chaque question et possibilit de rponse.

La premire zone pondration dfinit le poids attribu une question, en d'autres termes son coefficient. Vous choisirez par exemple 50 si la question que vous posez vous semble tre deux fois moins importante qu'une autre question. La zone % correct dfinit le score associ une possibilit de rponse. Vous pouvez l'utiliser si votre exercice comprend des rponses partiellement correctes. Modifiez alors la valeur du pourcentage pour que celle-ci reflte le nombre de points que vous voulez attribuer cette possibilit de rponse. N'oubliez pas de cocher la case rponse accepte.

2004 Fabien Olivry Page 17 de 57

Le guide de Hot Potatoes 6

JCloze
Jcloze permet de crer des textes lacunaires, encore appels exercices trous ou tests de closure.

Pour crer un exercice : 1. Saisissez le titre 2. Tapez ensuite votre texte normalement, sans y insrer de trous. 3. Slectionnez le mot que l'apprenant devra rechercher (le trou), mettez le en surbrillance (vous pouvez double-cliquer sur le mot ou le slectionner la souris) puis cliquez sur le bouton Crer Trou. 4 (facultatif). Vous pouvez donner un indice

2004 Fabien Olivry Page 18 de 57

Le guide de Hot Potatoes 6 5.(facultatif) Vous pouvez ajouter d'autres possibilits qui conviendraient pour le mot que vous avez fait disparatre. Ainsi, dans notre exemple, le mot apprenants peut tre remplac par des synonymes tels que lves ou tudiants. Il convient de

6. Enregistrez votre exercice au format HotPotatoes en appuyant sur la disquette

ou en

utilisant la commande Fichier puis enregistrer ou enregistrer sous. En enregistrant le fichier au format Hot Potatoes, vous aurez la possibilit de le modifier volont par la suite. 7. Crez enfin la page Web finale. Pour effacer un trou, positionnez le curseur de la souris sur ce mot (ne le mettez pas en surbrillance) et cliquez sur Supprimer Trou. Pour modifier un indice ou les autres bonnes rponses une fois le trou fait, positionnez le curseur de la souris sur ce mot (ne le mettez pas en surbrillance et cliquez sur Voir les mots. Vous avez enfin la possibilit de laisser le programme crer les trous pour vous en cliquant sur Crer Trou (alatoire). Le rsultat produit l'cran sera le suivant :

2004 Fabien Olivry Page 19 de 57

Le guide de Hot Potatoes 6

Jmatch
Pour crer un exercice, saisissez : 1. Le titre 2. Les lments qui composeront l'exercice. 3. A gauche, les lments fixes. 4. droite, les lments qui forment une paire avec ceux de la colonne de gauche. Il faut saisir ces paires sur la mme ligne lorsque l'on cre l'exercice : les diffrents lments seront ensuite mis dans le dsordre au chargement de la page. 5.(facultatif) Vous pouvez fixer un lment, c'est--dire qu'au chargement de la page, celuici ira se placer automatiquement ct de l'lment de gauche auquel il correspond. Ceci peut aider l'apprenant mieux comprendre comment fonctionne le programme. Dans l'exemple ci-dessous, on cre un exercice d'appariement constitu d'images dans la colonne de gauche. (on voit ici le code HTML correspondant l'insertion d'une image, il 2004 Fabien Olivry Page 20 de 57

Le guide de Hot Potatoes 6 n'est pas ncssaire de matriser ce code, vous pouvez utiliser la commande insrer puis image ou le bouton associ, le programme crant le code automatiquement). On insre les pendants textuels des images dans la colonne de droite. 6. Enregistrez votre exercice au format HotPotatoes en appuyant sur la disquette avec un point d'interrogation. Vous pouvez aussi l'enregistrer en utilisant la commande Fichier puis enregistrer sous. 7. Crez enfin la page Web finale. Vous avez deux possibilits, raliser un exercice en glisser-dposer (drag'n'drop) en cliquant su cliquant sur r ou avec des listes droulantes en

L'exemple ci-dessus donnera en glisser-dposer le rsultat reproduit ci-dessous. Notez bien que si vous crez une page Web utilisant des listes droulantes, vous ne pouvez insrer d'images que dans la colonne de gauche. Pour un meilleur rsultat, utilisez des images de taille modeste et modifiez leurs dimensions ou reduisez leur taille l'aide d'un programme graphique comme the Gimp ou Paint afin qu'elles soient toutes de mme hauteur et d'une largeur raisonnable. Gardez l'esprit le fait que les personnes qui viendront sur votre site auront peut-tre une rsolution plus faible et ne verront pas la page de la mme manire, une petite image sera plus grosse sur leur navigateur. 2004 Fabien Olivry Page 21 de 57

Le guide de Hot Potatoes 6

Jcross
Jcross permet de crer des mots-croiss. La premire tape consiste crer votre grille. Vous avez deux options pour ce faire. 1. Saisir chacune des lettres dans la grille manuellement. 2. Utiliser le gnrateur de grille automatique Dans le premier cas, placez simplement le curseur dans la case o vous souhaitez insrer un lettre. Dans le second cas, cliquez sur la troisime icne depuis la droite

2004 Fabien Olivry Page 22 de 57

Le guide de Hot Potatoes 6

Une nouvelle fentre s'ouvre alors. Saisissez chacun des mots sur une ligne spare. Quand vous aurez fini, cliquez sur le bouton gnrer grille. Le programme se chargera d'agencer vos mots sur la page. Une fois la grille prpare, il vous faut saisir les dfinitions. Cliquez sur le bouton Dfinitions. Une nouvelle fentre s'ouvrira alors. Celle-ci est spare en deux zones : une o il vous faudra saisir vos dfinitions pour les mots verticaux, une pour les mots horizontaux.

2004 Fabien Olivry Page 23 de 57

Le guide de Hot Potatoes 6

Il suffit de cliquer sur les diffrents nombres pour pouvoir proposer un mot.

Jmix
Jmix permet de faire des exercices o l'apprenant doit remettre dans l'ordre des segments de phrases proposs dans le dsordre. Les exercices ne peuvent porter que sur quelques courts segments et non sur des paragraphes ou units plus grandes. Pour crer un exercice, saisissez : 1. Le titre 2. La phrase reconstituer gauche. Vous devez faire un retour la ligne pour chacun des lments 3. (facultatif) Si, avec les segments que vous proposs, une autre phrase est 2004 Fabien Olivry Page 24 de 57

Le guide de Hot Potatoes 6 smantiquement et grammaticalement possible, saisissez la dans la fentre variantes acceptes.

4. Enregistrez votre exercice au format HotPotatoes en cliquant sur l'icne

. Vous

pouvez aussi l'enregistrer en utilisant la commande Fichier puis enregistrer sous. En enregistrant le fichier au format Hot Potatoes, vous aurez la possibilit de le modifier volont par la suite. 5. Crez enfin la page Web finale. L'exemple ci-dessus donnera l'cran le rsultat suivant.

2004 Fabien Olivry Page 25 de 57

Le guide de Hot Potatoes 6

Options communes aux diffrents systmes-auteurs

Ajouter une minuterie

Il est possible d'insrer une minuterie dans chacun des types d'exercices. L'apprenant ne disposera alors que d'un certain nombre de minutes pour raliser un exercice. Cette fonctionnalit permet, dans le cas d'un exercice de langue par exemple, de forcer l'apprenant dvelopper des stratgies de comprhension globale, il n'aura en effet pas le temps d'aller chercher la dfinition de chaque mot dans un dictionnaire. Pour insrer une minuterie, allez dans le menu Options et choisissez Configurer aspect page Web. Cliquez sur l'onglet Minuterie et cochez la case Limiter la dure de cet exercice. Slectionnez alors le nombre de minutes et de secondes qui sera imparti l'apprenant pour finir l'exercice.

2004 Fabien Olivry Page 26 de 57

Le guide de Hot Potatoes 6

La page web comportera alors un minuteur. Une fois la limite de temps coul, cliquer sur le bouton recharger (ou rafrachir) pour recommencer l'exercice n'aura normalement aucun effet sur le score qui sera gel. L'apprenant ne pouvant ainsi tricher.

Insrer un clavier virtuel

Si vous faites des exercices de langue ou qui demandent l'utilisation de symboles, un clavier virtuel permettra vos apprenants d'accder facilement aux caractres spciaux qui ne sont pas disponibles sur leur clavier physique ou requirent l'usage de combinaisons de touches complexes. Allez dans le menu Options et choisissez Configurer aspect page Web. Cliquez sur l'onglet Autres et cochez la case Inclure un clavier ... Spcifiez alors les lettres que vous voulez faire figurer l'cran.

La page Web cre comportera alors des boutons qui permettront l'apprenant la saisie 2004 Fabien Olivry Page 27 de 57

Le guide de Hot Potatoes 6 des caractres spciaux par simple clic.

Modifier l'ordre des questions, faire une banque de questions

Pour que vos apprenants puissent refaire les exercices sans rpondre de manire machinale, il est possible de modifier l'ordre des questions et des rponses. Allez dans le menu Options et choisissez Configurer aspect page Web. Cliquez sur l'onglet Autres. Vous pouvez modifier au choix l'ordre des questions, celui des rponses ou les deux la fois en cochant les cases appropries.

De la mme manire, si vous avez cr un exercice contenant de trs nombreuses questions, il est possible de limiter le nombre de questions chaque chargement. Celles-ci seront tires de l'ensemble constitu de manire alatoire. Ainsi, chaque chargement de la page, c'est un exercice diffrent qui sera propos.

Insrer un document ressource

Un document ressource est un texte sur lequel portera votre exercice ou qui permettra votre apprenant de le raliser en dduisant les rponses des informations fournies. Pour

2004 Fabien Olivry Page 28 de 57

Le guide de Hot Potatoes 6 insrer un document ressource, il suffit de cliquer sur l'icne suivante : Vous pouvez alors, au choix, importer un fichier html existant ou saisir (ou coller) un nouveau texte.

La page cre sera alors un jeu de cadre, le document ressource venant s'afficher la gauche des questions. Une fois le bouton OK cliqu, le document disparat. Pour l'afficher nouveau, cliquez sur l'icne

Modifier l'aspect des pages

Vous pouvez modifier divers aspects des pages que vous produisez. Cliquez sur options, configurer le rsultat et sur l'onglet apparence dans la fentre qui s'ouvrira alors.

2004 Fabien Olivry Page 29 de 57

Le guide de Hot Potatoes 6

Image d'arrire-plan Le champ image d'arrire-plan vous offre la possibilit d'utiliser une image comme fond d'cran des pages produites. Il vous suffit de spcifier son nom, vous pouvez utiliser le bouton parcourir pour retrouver votre fichier. N'oubliez pas de mettre cette image en ligne avec le reste de vos pages lors de la publication. Police Pour modifier la police des pages produites, tapez simplement son nom. Il faut de prfrence choisir des polices relativement standards. En effet, la page ne s'affichera dans la police voulue que si celle-ci est prsente sur l'ordinateur de la personne qui affiche la page. Les polices comme Times, Arial, Helvetica etc... sont parmi les plus courantes. Vous pouvez aussi dfinir les polices par ordre dcroissant de prfrence en les sparant d'une virgule. Ainsi dans l'cran ci-dessus, le navigateur tentera d'abord d'afficher la page avec la police nomme Geneva, s'il ne la trouve pas il chargera alors la police Arial. Couleurs Les couleurs sont attribues par l'utilisation de valeurs RVB (rouge, vert, bleu, RGB en anglais) en code hxadcimal. Ce code attribue deux chiffres chacune des couleurs rouge, vert, bleu sur lesquelles sont bases toutes les autres. La valeur la plus basse est 00, la plus haute tant FF. Ce code est prcd d'un signe dise. Ainsi, le code #0000FF attribue les valeurs 00 au rouge et au vert, et la valeur la plus forte, soit FF, au bleu, le texte affich sera donc bleu. Vous trouverez reproduite ci-dessous une page prsente dans le rpertoire d'installation dehot Potatoes intitule webcolours.htm qui 2004 Fabien Olivry Page 30 de 57

Le guide de Hot Potatoes 6 vous fournira les codes des couleurs courantes et que vous pouvez obtenir directement depuis la page apparence en cliquant sur le gros bouton Colours. Il est recommand de n'utiliser que cette palette de couleurs car cette dernire s'affiche parfaitement quelle que soit la configuration de l'ordinateur sur lequel sera prsente votre page. Ces couleurs sont pour cette raison appeles safe web colours (couleurs web sres) et permettent une palette de 216 couleurs...
#000000 #006600 #00CC00 #330000 #336600 #33CC00 #660000 #666600 #66CC00 #990000 #996600 #99CC00 #CC0000 #CC6600 #CCCC00 #FF0000 #FF6600 #FFCC00 #000033 #006633 #00CC33 #330033 #336633 #33CC33 #660033 #666633 #66CC33 #990033 #996633 #99CC33 #CC0033 #CC6633 #CCCC33 #FF0033 #FF6633 #FFCC33 #000066 #006666 #00CC66 #330066 #336666 #33CC66 #660066 #666666 #66CC66 #990066 #996666 #99CC66 #CC0066 #CC6666 #CCCC66 #FF0066 #FF6666 #FFCC66 #000099 #006699 #00CC99 #330099 #336699 #33CC99 #660099 #666699 #66CC99 #990099 #996699 #99CC99 #CC0099 #CC6699 #CCCC99 #FF0099 #FF6699 #FFCC99 #0000CC #0066CC #00CCCC #3300CC #3366CC #33CCCC #6600CC #6666CC #66CCCC #9900CC #9966CC #99CCCC #CC00CC #CC66CC #CCCCCC #FF00CC #FF66CC #FFCCCC #0000FF #0066FF #00CCFF #3300FF #3366FF #33CCFF #6600FF #6666FF #66CCFF #9900FF #9966FF #99CCFF #CC00FF #CC66FF #CCCCFF #FF00FF #FF66FF #FFCCFF #0033FF #0099FF #00FFFF #3333FF #3399FF #33FFFF #6633FF #6699FF #66FFFF #9933FF #9999FF #99FFFF #CC33FF #CC99FF #CCFFFF #FF33FF #FF99FF #FFFFFF #0033CC #0099CC #00FFCC #3333CC #3399CC #33FFCC #6633CC #6699CC #66FFCC #9933CC #9999CC #99FFCC #CC33CC #CC99CC #CCFFCC #FF33CC #FF99CC #FFFFCC #003399 #009999 #00FF99 #333399 #339999 #33FF99 #663399 #669999 #66FF99 #993399 #999999 #99FF99 #CC3399 #CC9999 #CCFF99 #FF3399 #FF9999 #FFFF99 #003366 #009966 #00FF66 #333366 #339966 #33FF66 #663366 #669966 #66FF66 #993366 #999966 #99FF66 #CC3366 #CC9966 #CCFF66 #FF3366 #FF9966 #FFFF66 #003333 #009933 #00FF33 #333333 #339933 #33FF33 #663333 #669933 #66FF33 #993333 #999933 #99FF33 #CC3333 #CC9933 #CCFF33 #FF3333 #FF9933 #FFFF33 #003300 #009900 #00FF00 #333300 #339900 #33FF00 #663300 #669900 #66FF00 #993300 #999900 #99FF00 #CC3300 #CC9900 #CCFF00 #FF3300 #FF9900 #FFFF00

Fonctionnalits multimdia et hypermdia

Insrer des images

Avant de pouvoir insrer des images dans vos ralisations, il est ncessaire de sauvegarder votre exercice au format Hot Potatoes au pralable. Pour ce faire, cliquez simplement sur l'icne ou slectionnez dans le menu la commande Fichier puis Enregistrer. Cette

tape permet l'ordinateur de savoir o se trouvent vos images par rapport aux fichiers de l'exercice afin de pouvoir dfinir le chemin relatif. Deux boutons prsents sur la barre d'outils vous permettent d'insrer rapidement des images :

2004 Fabien Olivry Page 31 de 57

Le guide de Hot Potatoes 6 Le bouton de gauche vous permet d'insrer une image prsente sur le Web. Le bouton de droite vous permet d'insrer une image prsente sur votre disque dur. Pour insrer une image, vous pouvez aussi utiliser les menus comme illustr ci-dessous:

Configuration d'une image

Lors de l'insertion d'une image, vous obtenez alors l'cran la bote de dialogue suivante :

Les boutons radio prsents dans la zone alignement image vous permettront de dfinir la 2004 Fabien Olivry Page 32 de 57

Le guide de Hot Potatoes 6 faon dont l'image va venir s'aligner.

La taille de l'image peut tre modifie en changeant les valeurs des champs Largeur et hauteur, celles-ci seront modifies proportionnellement par dfaut. Attention : si vous modifier la taille d'une image, vous ne modifiez cependant pas son poids en Kilo-octets et le temps qui sera ncessaire son chargement. Si vous souhaitez rduire la taille d'une image, mieux vaut songer utiliser un logiciel de graphisme qui vous permettra d'optimiser le poids du fichier en fonction de sa taille.

Bulle correspond au texte qui s'affiche dans une infobulle sur fond jaune lorsque l'on laisse le curseur de la souris sans bouger quelques instants sur l'image, une fois celle-ci enchsse dans la page Web. Ces textes permettent de rendre votre page accessible aux personnes souffrant d'un handicap de vision.Il peut cependant tre parfois judicieux d'enlever toute valeur, dans le cas o vous voudriez faire deviner le mot associ l'image et que son titre soit trop explicite. Vous pouvez aussi l'utiliser pour donner un indice.

Le chemin correspond l'endroit et au nom de fichier de l'image par rapport au fichier exercice. Ainsi, une image appele image.gif qui se trouve dans le mme rpertoire aura pour chemin image.gif, une image se trouvant dans un sous-rpertoire intitul images aura pour chemins images/image.gif, une image se trouvant dans un rpertoire de niveau immdiatement suprieur aura pour chemin ../image.gif etc.

Le bouton Charger vous permet d'accder une autre image.

En cliquant sur le bouton OK, Hot Potatoes transformera tous les paramtres saisis en code HTML. Ainsi, pour notre exemple, nous obtenons le code suivant: <img src="beef-vt.gif" alt="beef-vt.gif" width="100" height="63" border="0"></img> o l'on retrouve les diffrents paramtres nots entre guillemets: le nom du fichier image aprs src=, le texte infobulle aprs alt=, la largeur aprs width=, la hauteur aprs heigth=, la taille de la bordure encadrant l'image aprs border= .

O trouver des images?

Vous pouvez trouver de trs nombreuses images libres de droits sur le Web que vous pourrez rutiliser loisir dans vos exercices. Ces images sont libres pour une utilisation non 2004 Fabien Olivry Page 33 de 57

Le guide de Hot Potatoes 6 commerciale, souvent payantes dans le cas contraire. Vous en trouverez entre autres sur les sites suivants :

http://www.picto.qc.ca Une banque d'illustrations, de gifs animes, d'animations flash, conue spcialement pour les enseignants. http://www.freefoto.com Une banque de photographies trs riche, en anglais. http://bips.cndp.fr/ Banque d'images et de scnarii pdagogiques classs par matires

Pour enregistrer une image, faites un clic-droit dessus, un menu contextuel apparat alors, slectionnez l'option Enregistrer l'image sous ou son quivalent en fonction de votre navigateur. Problmes courants Si vos images n'apparaissent pas lors de la mise en ligne, vrifiez les points suivants :

Vous avez transfr la totalit de vos fichiers, pages Web(.htm ou .html) et images (.gif, .jpg, .jpeg ou .png). Au cas o vos images ne se trouvent pas dans le mme dossier que vos pages Web, assurez-vous d'avoir bien reproduit la mme structure de rpertoires sur le serveur internet. Par exemple, si vos images taient dans un dossier intitul images, elles doivent se trouver sur internet dans un dossier images qui doit se trouver la mme position, relativement vos pages Web, que sur votre disque dur. Il faut copier l'arborescence que vous avez en local (sur votre disque dur) et en distant (sur le serveur).

Vos images ne sont pas appeles depuis vos pages Web par un chemin absolu. Pour s'en rendre compte, regardez attentivement le code HTML qui correspond vos images dans vos exercices et qui se prsentent sous la forme suivante :

<img src="CheminVersl'Image/NomDel'Image.jpg">. Si dans la zone CheminVersl'Image vous apercevez des lments tels que file://..., alors le chemin est absolu, c'est dire qu'il fait rfrence la position qu'occupe l'image sur votre disque dur et non sur le serveur internet. Ainsi, vous ne pourrez voir les images que sur votre ordinateur personnel, les fichiers images tant prsents sur votre disque dur, tandis que toute autre machine ne les affichera pas puisque le fichier auquel vos pages font rfrence n'existe pas sur le disque dur de la machine. Il est donc toujours ncessaire de tester les exercices produits sur un 2004 Fabien Olivry Page 34 de 57

Le guide de Hot Potatoes 6 ordinateur diffrent pour s'assurer que tous les liens et chemins sont valables.

Insrer des liens

Il est galement possible d'insrer des liens vers d'autres pages Web ou encore vers d'autres types de fichiers (vous pouvez, par exemple, avoir tap un support de cours avec un traitement de texte ou encore un diaporama et le proposer depuis votre exercice). Pour crer un lien, il faut cliquer l'endroit o vous souhaitez que ce lien apparaisse, il est possible d'inclure des liens dans chacune des zones de saisie des gnrateurs d'exercices. L'insertion se fait via une bote de dialogue que vous ferez apparatre ainsi :

L'option lien vers une page Web vous permet de faire un lien vers une page ou un fichier prsent sur un site Web existant. L'option lien vers un fichier local vous permet de faire un lien vers un fichier que vous avez dj cr, que celui-ci soit un autre exercice, une page Web, un diaporama, un fichier produit avec votre traitement de texte etc.

Lien vers un site web Si vous avez slectionn lien vers un site Web, vous obtenez la bote de dialogue suivante :

2004 Fabien Olivry Page 35 de 57

Le guide de Hot Potatoes 6

Les champs qui apparaissent dans cette bote de dialogue sont les suivants : Adresse : adresse du fichier li ou de la page lie.

il vous faudra alors taper cette adresse en n'omettant pas de la faire prcder de http:// . Par exemple, pour crer un lien vers le moteur de recherches voil, vous taperez : http://voila.fr . Pour crer un lien vers un document Writer OpenOffice sur votre site web, vous taperez http://www.monsiteweb.com/monfichier.sxw

Cible : La case cocher faire apparatre la cible dans une nouvelle fentre vous permet de dfinir le cadre cible dans lequel viendra s'afficher le fichier que vous avez li.

Coche : En slectionnant cette option, le fichier viendra s'afficher dans une nouvelle fentre (un peu la manire d'une fentre pop-up). La page lie est alors indpendante de l'exercice depuis lequel vous avez cr le lien (chacun dans sa fentre) et la fermeture de la page visite ne provoquera pas la fermeture de l'exercice en cours. En ce sens, cette option est trs intressante.

Non coche : le fichier vient remplacer la page en cours (il s'affiche dans la mme fentre que celle o se trouvait l'exercice). Cela ncessite donc de la part du visiteur de cliquer sur le bouton prcdent pour revenir l'exercice et cela s'avre, pour cette raison, un choix peu judicieux. Si vous ne prcisez pas de cible, c'est ce type de lien qui est employ par dfaut.

Lien : Il vous faut ici saisir le texte qui servira de support au lien (sa partie visible que l'on voit habituellement souligne en bleu), vous pouvez aussi utiliser ou ajouter une image en cliquant sur le bouton image et en suivant le mme procd et/ou choisir une image qui servira de lien . Une fois toutes les options remplies, Hot Potatoes crera le code HTML correspondant et l'insrera dans la zone de saisie des donnes de l'exercice en cours. Le code devrait approximativement correspondre ceci dans le cas d'un lien externe : <a href="http://voila.fr" target="_blank">Cliquez ici pour aller sur voila.fr</a> Et ceci dans le cas d'un lien interne (se trouvant dans le mme rpertoire que l'exercice cr) : <a href="nomdufichier.html" target="_blank">Cliquez ici pour voir le fichier</a> nomdufichier.html sera videmment remplac par le nom et le type du fichier vers lequel 2004 Fabien Olivry Page 36 de 57

Le guide de Hot Potatoes 6 vous faites un lien. L'argument target est optionnel et dfinit l'endroit o ira s'afficher le lien comme expliqu ci-dessus. Ne modifiez pas ce code moins de savoir ce que vous faites. Pour supprimer un lien, supprimez la totalit de ce code.

Insrer des sons et des vidos

Hot Potatoes 6 se diffrencie des versions prcdentes par l'ajout d'assistants pour l'insertion de sons et vidos. Nous prendrons ici pour exemple l'insertion d'un fichier son, la procdure est la mme si vous insrez de la vido. Que votre fichier son existe dj ou que vous veniez de le crer ( l'aide du magntophone que vous trouverez dans le groupe accessoires par exemple), il est ncessaire de le compresser pour minimiser les temps de chargement. Vous pouvez utiliser les formats suivants : mp3, ogg vorbis, windows media, real. Il est noter que windows media n'est pas disponible sur tous les systmes d'exploitation c'est pourquoi il peut tre prfrable de choisir un autre format de compression.

2004 Fabien Olivry Page 37 de 57

Le guide de Hot Potatoes 6

Encodage en MP3/Ogg
Il existe une multitude d'outils pour convertir un fichier son au format mp3 ou ogg. Vous trouverez de trs nombreux gratuiciels pour ce faire.

Encodage en Windows Media.

Microsoft, socit ditrice de Windows Media, propose un logiciel, appel Codeur Windows Media permettant d'effectuer cette dmarche. Vous pourrez tlcharger depuis le site www.microsoft.fr le codeur Windows media (nous reproduirons ici les captures cran de la version 9). L'encodage du fichier se fait via un assistant. Dans notre exemple, nous encodons un fichier wav pour l'insrer dans un exercice. Lancez d'abord le codeur en vous rendant dans le programmes -> windows media ->codeur, Cliquez sur convertir un fichier.

Cliquez alors sur OK. L'cran suivant vous permet de dfinir l'emplacement de votre fichier son source et le nom et l'emplacement du fichier qui sera cr. Le fichier de sortie aura pour extension .wma pour un fichier audio et .wmv pour un fichier vido. 2004 Fabien Olivry Page 38 de 57

Le guide de Hot Potatoes 6

Il vous faut ensuite dfinir l'emplacement o le contenu sera distribu. Ce paramtre dfinit en partie la taille du fichier de sortie.

2004 Fabien Olivry Page 39 de 57

Le guide de Hot Potatoes 6

2004 Fabien Olivry Page 40 de 57

Le guide de Hot Potatoes 6

Cet cran vous permet de dfinir la qualit du son du fichier de sortie. Vous disposez de plusieurs possibilits selon le type d'enregistrement que vous avez ralis (voix, musique etc.). Le codeur vous prsentera ensuite un cran o vous pourrez vrifier les paramtres selon lesquels votre fichier sera encod.

2004 Fabien Olivry Page 41 de 57

Le guide de Hot Potatoes 6

L'encodage a alors lieu. Cliquez sur Lire le fichier de sortie pour vrifier que les paramtres que vous avez choisis n'ont pas trop dgrad le son de votre fichier, le cas chant, relancez l'assistant et revoyez les paramtres la hausse. Votre fichier windows media se trouve dsormais l'endroit que vous aviez choisi au dbut de l'encodage.

2004 Fabien Olivry Page 42 de 57

Le guide de Hot Potatoes 6 Encodage en RealAudio/Vido Vous pourrez tlcharger RealProducer Basic (aussi appel Helix Producer) depuis le site http://www.realnetworks.com/products/producer/basic.html. Le processus de conversion est plus rapide. Slectionnez tout d'abord le fichier source en cliquant sur Browse (parcourir) dans le champ input file (fichier source).

Choisissez dans la liste droulante Audio Mode le type de fichier son que vous souhaitez convertir. Les taux d'chantillonage de la section Audio Selection devraient s'adapter automatiquement.

2004 Fabien Olivry Page 43 de 57

Le guide de Hot Potatoes 6

Fermez la fentre prcdente et cliquez sur Encode. La conversion est alors faite et votre fichier qui a pour extension .rm est sauvegard dans le rpertoire de destination.

2004 Fabien Olivry Page 44 de 57

Le guide de Hot Potatoes 6

. Insertion des sons/vidos dans les exercices Pour insrer le fichier son cr dans les exercices, allez dans le menu Insrer et slectionnez l'option objet audio/vido. Une bote de dialogue s'ouvre alors. Le bouton parcourir vous permet de slectionner le fichier son ou vido que vous souhaitez insrer. Les champs hauteur et largeur dsignent la taille qu'occupera l'enchssement. Spcifiez ensuite quel greffon vous souhaitez utiliser. La case cocher inclure un simple lien modifie considrablement la prsentation du fichier son ou vido. Si elle est coche, un clic sur le lien lancera le lecteur multimdia associ au fichier son de manire externe. Il est possible qu'un fichier enchss gnre quelques dysfonctionnements. Nanmoins, le rsultat est la fois plus esthtique et plus pratique. 2004 Fabien Olivry Page 45 de 57

Le guide de Hot Potatoes 6

Une fois tous les paramtres saisis et le bouton OK appuy, Hot Potatoes produira le code HTML correspondant. Celui-ci viendra se loger dans la zone de saisie o vous aviez cliqu pour insrer le fichier son. Ne modifiez pas ce code.

Exemple de fichier son enchss, le lecteur multimdia est directement inclus dans la page, il vous faut dcocher la case inclure un simple lien pour obtenir ce rsultat.

2004 Fabien Olivry Page 46 de 57

Le guide de Hot Potatoes 6

Crer son site Web

Configurer les liens entre les exercices

Un des grands intrts de Hot Potatoes est de pouvoir lier les exercices entre eux pour crer des squences pdagogiques et des parcours d'apprentissage, les exercices s'enchanant alors. Il vous faut au pralable enregistrer votre exercice pour que le programme puisse dfinir les liens relatifs entre les diffrents fichiers. Si vous tes dbutant, il est gnralement plus simple d'enregistrer tous vos fichiers au sein du mme rpertoire. Pour configurer les liens entre les exercices, allez dans le menu Options, slectionnez configurer aspect Page Web puis cliquez sur l'onglet boutons. La bote de dialogue suivante doit apparatre :

En cochant chacune des cases, il vous est alors possible de configurer la faon dont votre exercice s'insre au sein de la squence pdagogique.

Le bouton exercice suivant vous permet de spcifier l'adresse de l'exercice sur lequel l'apprenant sera dirig aprs avoir fait celui-ci. Si l'exercice suivant est dj cr, cliquez simplement sur le bouton parcourir et slectionnez le fichier suivant, ce fichier est au 2004 Fabien Olivry Page 47 de 57

Le guide de Hot Potatoes 6 format htm.

Le bouton index correspond la page d'accueil de votre unit pdagogique, en d'autres mots la table des matires de votre unit. Il n'est pas ncessaire de spcifier de nom de fichier pour le bouton retour. La page web utilisera la fonction historique de Javascript pour savoir d'o provient l'apprenant.

Crer la page d'accueil

Pour crer la page d'accueil, le plus simple, si vous n'avez pas de connaissances particulires, est d'avoir recours un diteur WYSIWYG (tel crit, tel cran) qui s'utilise un peu la manire d'un traitement de texte. Il existe de trs nombreux diteurs de ce type, gratuits ou payants. Si vous utilisez Netscape ou Mozilla, vous disposez dj, peut-tre sans le savoir, d'un tel diteur. Cet diteur s'appelle composer, il est accessible sur les vieilles versions de Netscape depuis le menu communicator, composer ou en cliquant sur la petite icne reprsentant un stylo et une feuille en bas de l'cran. Sur la version 7, si vous avez lanc le navigateur, allez dans le menu fentre et slectionnez l'option composer. Vous pouvez alors saisir les premires informations qui figureront sur votre page comme vous le feriez dans un traitement de texte. Avant de pouvoir faire un lien vers un de vos exercices, il vous faut pralablement enregistrer votre page afin que Composer sache o celle-ci se situe par rapport au fichier li. Allez dans la commande Fichier, slectionnez Enregistrer sous, Composer vous demandera alors un titre pour la page (ceci n'est pas le nom du fichier mais le nom qui vient s'afficher dans la barre suprieure de la fentre). Donnez enfin un nom de fichier la page. Si dans le fichier de configuration, vous n'avez pas effectu de modifications, alors votre page devra s'appeler index.htm, ceci afin que les liens entre les exercices et votre page d'accueil fonctionnent. Le fichier index.htm est, par ailleurs, la page que les navigateurs chargent par dfaut si le nom de la page n'est pas spcifi. Ainsi, si mon site se trouve l'adresse http://www.monsite.com et que je saisis cette adresse dans un navigateur, la page que je verrai l'cran sera index.htm.

2004 Fabien Olivry Page 48 de 57

Le guide de Hot Potatoes 6 Il vous faut dsormais faire les liens reliant votre page d'accueil aux exercices. Tapez d'abord une phrase qui servira de support au lien (la partie visible du lien, habituellement souligne en bleu sur un site internet), ceci peut tre par exemple une phrase du type : cliquez ici pour faire une exercice sur les pronoms. Une fois cette phrase saisie, slectionnez la la souris afin qu'elle soit en surbrillance. Cliquez alors sur le bouton suivant : ou selon la version de Netscape ou de Mozilla que vous utilisez sur ce bouton:

Une bote de dialogue o vous allez pouvoir prciser les paramtres de ce lien s'ouvre alors. Cliquez sur le bouton choisir le fichier . Slectionnez le fichier et cliquez sur Ok. Vrifiez bien que la case l'URL est relative l'emplacement de la page soit coche. (Ces commandes peuvent varier selon la version de Netscape installe, les commandes reproduites ici sont celles de la version 7. Pour les autres versions, reportez vous l'aide incluse dans Netscape, en slectionnant le menu aide ou en appuyant sur la touche F1 et rendez vous la section cration de page Web.)

2004 Fabien Olivry Page 49 de 57

Le guide de Hot Potatoes 6

Votre lien est cr et votre page d'accueil vous permet d'accder directement vos exercices. Cliquez sur le bouton choisir ou sur aperu (selon la version de Netscape) pour visualiser votre page dans le navigateur aprs avoir enregistr les modifications. Vous trouverez dans l'aide de Netscape de trs nombreuses informations la rubrique cration de pages Web qui vous permettront d'amliorer la prsentation de votre page d'accueil.

Problmes courants
Si vos images n'apparaissent pas lors de la mise en ligne, vrifiez les points suivants :

Vous avez transfr la totalit de vos fichiers, pages web(.htm ou .html) et images (.gif, .jpg, .jpeg ou .png). Au cas o vos images ne se trouvent pas dans le mme dossier que vos pages web, assurez-vous d'avoir bien reproduit la mme structure de rpertoires sur le serveur 2004 Fabien Olivry Page 50 de 57

Le guide de Hot Potatoes 6 internet. Par exemple, si vos images taient dans un dossier intitul images, elles doivent se trouver sur internet dans un dossier images qui doit se trouver la mme position, relativement vos pages web, que sur votre disque dur. Il faut copier l'arborescence que vous avez en local (sur votre disque dur) et en distant (sur le serveur).

Vos images ne sont pas appeles depuis vos pages web par un chemin absolu. Pour s'en rendre compte, regardez attentivement le code HTML qui correspond vos images dans vos exercices et qui se prsentent sous la forme suivante :

<img src="CheminVersl'Image/NomDel'Image.jpg">. Si dans la zone CheminVersl'Image vous apercevez des lments tels que file://..., alors le chemin est absolu, c'est dire qu'il fait rfrence la position qu'occupe l'image sur votre disque dur et non sur le serveur internet. Ainsi, vous ne pourrez voir les images que sur votre ordinateur personnel, les fichiers images tant prsents sur votre disque dur, tandis que toute autre machine ne les affichera pas puisque le fichier auquel vos pages font rfrence n'existe pas sur le disque dur de la machine. Il est donc toujours ncessaire de tester les exercices produits sur un ordinateur diffrent pour s'assurer que tous les liens et chemins sont valables. Si vous voulez modifier des exercices dj crs, vous pouvez les retrouver grce leur icne. En fonction du module qui a permis de les crer, les exercices ont les icnes et les extensions suivantes:

Les cinq derniers exercices crs apparaissent toujours dans le menu fichier. Pour effectuer des modifications sur un exercice dj cr et sauvegard dont vous auriez oubli le nom, rendez-vous dans le menu fichier et slectionnez l'exercice en question:

2004 Fabien Olivry Page 51 de 57

Le guide de Hot Potatoes 6

2004 Fabien Olivry Page 52 de 57

Le guide de Hot Potatoes 6

Glossaire
Adresse IP : Chaque ordinateur reli l'internet est identifi grce une adresse dite IP, constitu de 4 chiffres (dans la norme Ipv4) Apache : Le serveur web le plus courant. Fonctionne sous Unix, Linux et Windows (cette dernire option n'est pas recommande pour des raisons de scurit). AVI : format vido inappropri du fait de sa gourmandise en terme de taille une utilisation sur l'Internet. rempalcer par des formats tels que Realvideo, Windows Media ou Divx ncessitant moins de temps de chargement Balise (ou Tag) : Instructions en langage HTML. Une balise se prsente ainsi : <balise> et est souvent accompagne de son contraire </balise> o <balise> dit au navigateur de commencer faire quelque chose et </balise> lui dit d'arrter. CGI (Common Gateway Interface) : Spcification concernant l'interfaage d'un serveur Web avec une application. DHTML (Dynamic Hyper Text Markup Language) : langage permettant de rendre les pages web dynamiques sans l'utilisation de plug-in. Editeur HTML : Logiciel utilis pour crer ou diter des pages web. On distingue les diteurs source (o l'on travaille directement sur le code d'une page) et les diteurs WYSIWYG (tel crit, tel cran) qui vous permettent de crer des pages Web sans connaissance du code HTML. Freeware : Cf.graticiel. GIF : Graphic Interchange Format. Format le plus utilis sur le web. 256 couleurs disponibles, transparence possible. Le format GIF donne (ou est suppos) donner lieu au versement de droits d'auteur dans certains pays(pour l'utilisation du format de fichier (USA par exemple). Il peut tre dans ce cas remplac par le format PNG, libre de droits. Graticiel : Un graticiel est un logiciel gratuit et s'oppose donc au partagiciel (shareware). HTML : langage de programmation de pages web. Sigle de Hypertext Markup Language (langage de marquage hypertexte), version simplifie de la norme SGML. Le langage HTML est le langage sur lequel repose les pages web.

2004 Fabien Olivry Page 53 de 57

Le guide de Hot Potatoes 6 Intranet : Rseau compos d'ordinateurs fonctionnant en interne et n'tant pas relis l'internet bien qu'utilisant les mmes protocoles. Il est (normalement) impossible d'accder un intranet depuis l'internet. Java : Langage conu par Sun. Les applications Java fonctionnent sur toute plate-forme (Mac, PC-Windows, Linux etc.) hbergeant une machine virtuelle Java. Il permet entre autres de crer de petits programmes (appels applets) facilement excutables sur le Web Javascript : Langage de script pour navigateur Web. JPEG : Join Photographic Experts Group. Format d'image trs courant sur Internet et principalement utilis pour les photos. 65536 couleurs. Linux : Systme d'exploitation libre bas sur la licence GPL (Gnu Public License). MySQL : Systme de Gestion de bases de donnes (SGBD) fonctionnant sous Linux et Windows. Navigateur (ou fureteur) : Logiciel permettant de consulter des documents sur internet. Appel Browser en anglais. Plug-in (ou greffon) :Module qui apporte des fonctionalits supplmentaires un navigateur. Ncessite, sauf pour les plus communs livrs avec les navigateurs, d'tre tlcharg depuis l'Internet et install. PNG : Portable Network Graphic. 65536 couleurs disponibles avec possibilit de transparence. N'entrane pas de dgradation de l'image lors d'une compression contrairement au format JPEG. Streaming: Flux tendu dans le transfert de donnes audio ou vido. La lecture des donnes commence avant le tlchargement complet, le lecteur anticipe sur les donnes qu'il va recevoir ce qui permet de proposer plus rapidement la lecture du fichier son. C'est le cas de certains fichiers real ou de certains fichiers windows media player. URL(Uniform Ressource Locator): adresse d'une page web ou d'une manire plus gnrale d'un site. RealPlayer :Logiciel dit par la socit Real.com et permettant de jouer des fichiers audio et vido en flux tendu (streaming) ou non. Le fait que ce logiciel existe sur des systmes d'exploitations diffrents en fait un meilleur choix que windows media player si l'on veut satisfaire un public vaste. XHTML : norme faisant la transition entre le HTML4 et le XML, sorte de HTML4 tendu. Zip : Fichiers obtenus aprs compression par le logiciel PKzip (extension .ZIP). Zipper : Compresser en mettant au format zip. 2004 Fabien Olivry Page 54 de 57

Le guide de Hot Potatoes 6

Liens utiles
http://web.uvic.ca/hrd/hotpot Le site original de Hot Potatoes. Vous pourrez y enregistrer votre copie (register) ou y trouver les dernires mises--jour de Hot Potatoes ainsi qu'un forum en anglais sur cette suite logicielle. http://www.easyphp.org EasyPHP installe et configure automatiquement un environnement de travail complet permettant de mettre en oeuvre toute la puissance et la souplesse qu'offrent le langage dynamique PHP et son support efficace des bases de donnes. EasyPHP regroupe un serveur Apache, une base de donne MySQL, le langage PHP ainsi que des outils facilitant le dveloppement de vos sites ou de vos applications. Vous pouvez utiliser EasyPHP pour tester Ganesha en local ou pour crer un serveur Intranet sur un poste Windows (attention cependant la scurit de votre installation) http://frenchmozilla.sourceforge.net/ Vous trouverez ici Mozilla. Cette suite internet comporte un navigateur, un module de courrier et l'diteur de page composer avec lequel vous pourrez raliser la page d'accueil de votre site. http://frenchmozilla.sourceforge.net/firebird/ Vous pourrez tlcharger sur ce site la version franaise de Mozilla Firebird. Mozilla Firebird est sans doute le meilleur navigateur l'heure actuelle, trs lger, compatible avec les normes du W3C et intgrant des fonctionnalits telles que la suppression de fentres pop-up. http:www.netscape.fr Vous pourrez, si vous n'avez pas Netscape, y tlcharger ce navigateur et utiliser le composer afin de raliser la page d'accueil de votre site internet. Ce programme s'utilise de manire trs simple, comme un traitement de texte. http://www.anemalab.org 2004 Fabien Olivry Page 55 de 57

Le guide de Hot Potatoes 6 Ganesha est une plate-forme de tlformation permettant un formateur ou un centre de formation de mettre la disposition d'un ou plusieurs groupes de stagiaires, un ou plusieurs modules de formation avec supports de cours, complments, quizz et tests d'valuation ainsi que des outils collaboratifs(webmail, forum, chat, partage de documents).C'est un logiciel libre (sous licence GPL) et gratuit dit par Anma Formation. Les exercices produits avec Hot Potatoes peuvent y tre incorpors, permettant ainsi de conserveur les scores obtenus par les apprenants. http://www.univie.ac.at/Romanistik/Sprachwst/ttools/TeachingTools.htm Un excellent site o l'auteur s'est appliqu modifier les fichiers sources de Hot Potatoes afin de crer d'autres types d'exercices. Disponible en anglais et allemand. http://www.linux-mandrake.com/fr Mandrake Linux est un systme d'exploitation convivial. Il est facile d'utilisation aussi bien pour les serveurs en entreprise qu' la maison. On peut l'obtenir librement dans de nombreuses langues travers le monde. C'est assurment la distribution de Linux par laquelle dbuter pour crer votre propre serveur Internet/Intranet. Sa prise en main est facile et comporte des assistants pour scuriser votre rseau. N'installez que les paquetages strictement ncessaires si vous voulez crer un serveur internet et entourez-vous des conseils d'un administrateur rseau afin de scuriser votre systme. http://filezilla.sourceforge.net/ Filezilla est un excellent client FTP libre et gratuit qui vous permettra de publier votre site sur l'internet. Bien que la page soit en anglais, le fichier d'installation permet d'obtenir le programme en franais. www.gimp.org (linux) www.gimp.org/win32 (windows) Un excellent logiciel de graphisme, proche de Photoshop qui vous permettra de crer aisment des logos ou de retoucher des images afin de produire votre site. www.gratilog.net La banque de graticiels francophones mise jour le plus rgulirement comportant une myriade de petites perles logicielles dcouvrir absolument... Client FTP, logiciels graphiques, outils de cration de site web, tout y est... http://www.appstmdcom/qr (Questions rponses) Questions-rponses est un graticiel permettant de crer des exercices multimdias qui peuvent tre ensuite publis comme 2004 Fabien Olivry Page 56 de 57

Le guide de Hot Potatoes 6 excutables ou pages web. http://usinaquiz.ovh.org Usinaquiz met votre disposition des gnrateurs d'exercices en ligne ainsi que des scripts tlcharger et modifier selon vos besoins. http://allhtml.com AllHTML propose des cours sur les diffrents languages et techniques employs sur le web. visiter si vous voulez matriser le HTML ou le Javascript. http://www.lucagalli.net Ce site vous permettra de tlcharger QuizFaber, un graticiel disponible en anglais et italien permettant de crer des exercices interactifs pour le web. Son avantage est de pouvoir mler diffrents types de questions au sein d'un mme exercice.

http://www.ccdmd.qc.ca/netquiz/ Netquiz (actuellement dans sa version 3) est un gnrateur d'exercices totalement gratuit et trs simple utiliser. Il comporte quelques types d'exercices que Hot Potatoes n'est pas capable de crer. http://france.real.com/ Le site francophone de real. vous pourrez y trouver RealPlayer et HelixProducer.

2004 Fabien Olivry Page 57 de 57