DocAide Documents

Sommaire

Vous lisez un document WIMS qui va vous guider dans la production d'un document WIMS.

Si un document en ligne est simplement la transposition sur l'écran d'un polycopié papier, il est moins confortable d'utilisation donc il est moins intéressant. Par contre si vous concevez un document en ligne avec toutes les possibilités offertes par WIMS au service de votre pédagogie, alors vous améliorez votre document : mettez de la couleur, concevez la taille des pages (bloc) en fonction de la taille de l'écran et des objectifs pédagogiques, faites des liens vers des ressources internet, vers des exercices, insérez des figures, des graphiques, proposez une navigation aisée dans le contenu, concevez des exemples aléatoires, prévoyez des zones qui peuvent être cachées ou vues...

Pour vous familiariser avec le type document WIMS, naviguez un peu dans celui-ci en suivant les conseils de navigation .

Maintenant lancez vous dans cette oeuvre de création sans hésiter ! Tout devient très simple quand on a commencé, WIMS balise très bien les étapes du processus ; en particulier, dès que le document est créé, vous avez droit à la documentation (cliquer sur Aide dans la barre WIMS). Les étapes de votre apprentissage :

  1. Créez votre document
  2. Comment éditer un document
  3. Les commandes spécifiques à WIMS
  4. Insertion d'exercices, images, documents, dessins ...
  5. Exemples aléatoires, programmation ...
  6. Composition, statut d'un document ...

Convention de ce document :

Navigation dans un document

La navigation dans le document comme dans la classe se fait avec les liens du bandeau supérieur de la page WIMS ou avec les flèches vertes sur les côtés des pages.

Les flèches de

Vous venez de cliquer sur l'image d'un lien utile de WIMS, c'est un faux lien, le vrai est sur la barre de navigation de WIMS

agissent comme les flèches du navigateur, elles gardent la mémoire de votre voyage. Les autres commandes

Vous venez de cliquer sur l'image d'un lien utile de WIMS, c'est un faux lien, le vrai est sur la barre de navigation de WIMS

,

Vous venez de cliquer sur l'image d'un lien utile de WIMS, c'est un faux lien, le vrai est sur la barre de navigation de WIMS

et

Vous venez de cliquer sur l'image d'un lien utile de WIMS, c'est un faux lien, le vrai est sur la barre de navigation de WIMS

sont programmées par l'auteur du document et vous guident selon son projet. (

Vous venez de cliquer sur l'image d'un lien utile de WIMS, c'est un faux lien, le vrai est sur la barre de navigation de WIMS

renvoie au sommaire et les autres ...)

Exercice : Visiter ce document (sans nécessairement lire en détail le contenu des parties) et dessiner sa carte.

graphe à dessiner

Créez votre document

Nous avons vu ici comment créer un document dans une classe. Il est possible aussi de le créer dans un compte Modtool, la gestion du document est ensuite la même (voir DocAide Modules d'exercices OEF ).
Le transfert d'un document de la classe vers un compte Modtool est possible par le lien transfert dans la page des propriétés du document.

Comment éditer un document

Un document s'édite bloc par bloc dans la fenêtre d'édition. Un éditeur d'html et de commandes WIMS est disponible. La mise en forme du texte se fait grâce à des commandes html et les formules mathématiques se composent avec Latex . Consultez le deuxième paragraphe de l'Aide.

Dans votre partie Ecrire en html, faites les exercices d' html et dans la partie Composer des formules mathématiques les exercices de Latex .

Quelques commandes html

Votre navigateur ou divers logiciels vous permettent de composer des pages web en html. La commande source de la page vous permet d'accéder au code d'une page et donc de découvrir comment coder certaines mises en forme.

Les bases

Voici quelques bases qui vous suffiront pour commencer ( Attention !

L'avertissement n'a plus lieu d'être mais comme le pli est donné en exemple, je le laisse.

).
Une balise html s'ouvre et se ferme.
 <br/> 
aller à la ligne <p>paragraphe</p>

<p class="wimscenter">pour centrer</p>

ou
<div class="wimscenter">pour centrer</div>
<ul> <li>liste</li> <li>liste</li> </ul> <ol> <li>liste numérotée</li> <li>liste encore</li> </ol>
<span style="color:purple;">en violet</span> <span style="font-weight:bold">En gras</span>)

Exercice : Ecrivez votre liste de courses en changeant de couleur selon les produits. Donnez-lui un titre centré en gras.


L'html permet la mise en forme de tableaux
 <table>
   <tr>
     <td>1</td>
     <td>2</td>
   </tr>
   <tr>
     <td>3</td>
     <td>4</td>
   </tr> 
 </table>
1 2
3 4
On peut ajouter des attributs à table
 <table style="text-align:center;width:50%; background-color:yellow;">
   <tr>
     <th>Titre 1</th>
     <th>Titre 2</th>
   </tr>
   <tr>
     <td>1</td>
     <td>2</td>
   </tr>
   <tr>
     <td style="color:red">3</td>
     <td>4</td>
   </tr> 
 </table>

Titre 1 Titre 2
1 2
3 4
On peut aussi utiliser des attributs prédéfinis auxquelles vous pouvez rajouter des améliorations :
 <table class="wimsborder wimscenter">
   <tr>
     <th>Titre 1</th>
     <th>Titre 2</th>
   </tr>
   <tr>
     <td>1</td>
     <td>2</td>
   </tr>
   <tr>
     <td>3</td>
     <td>4</td>
   </tr> 
 </table>
 
Titre 1 Titre 2
1 2
3 4
 <table class="wimsnoborder wimscenter" style="background-color:yellow;">
   <tr>
     <th>Titre 1</th>
     <th>Titre 2</th>
   </tr>
   <tr>
     <td>1</td>
     <td>2</td>
   </tr>
   <tr>
     <td style="color:red">3</td>
     <td>4</td>
   </tr> 
 </table>
Titre 1 Titre 2
1 2
3 4
.
Exercice : Essayez de créer un tableau avec les valeurs de deux fonctions en trois points donnés.

Pour faire plus

Quels styles définir ?

Pour simplifier la mise en forme du document, il est important de raisonner avec des styles. On définit un style pour les théorèmes, un pour les plis, un pour les noms de fichiers etc… On les appelle à chaque fois qu'on en a besoin, le choix des caractéristiques est fait une seule fois et peut être modifié en un seul endroit (voir Où mettre les styles ? ).

Pour le document, les paragraphes, les titres

On peut définir l'indentation de tous les paragraphes par : p {text-ident: 1.3em;}

En html, les titres ont des styles définis par défaut. Dans les documents WIMS, le titre du document est en h1, les titres des blocs en h3, le h2 est disponible pour vos titres de paragraphe. Chaque style de titre peut être redéfini dans l'entête du document :

h3 {
   font-size: 130%;
   text-align: center;
   color: green;
 }

Définition d'une classe

On définit une classe par un nom commençant par un point, puis entre accolades ses caractéristiques, séparées par des point-virgules. Une classe qui définit les caractéristiques des caractères peut être appelée pour un mot ou un paragraphe.

.c   { 
   color: #c52d2d;
   font-size:100%;
   font-weight: bold;
}

Pour quelques mots, on peut écrire :

Le style <span class="c">c</span> indique un mot important.
pour

le style c indique un mot important.

Pour un paragraphe, on écrit :

<p class="c">Ce paragraphe est important.</p>
pour

Ce paragraphe est important.

Pour un paragraphe ou une partie

Le style peut définir le fond d'un paragraphe (<p class="ccc"> </p >) ou d'une division qui peut comporter plusieurs paragraphes (<div class="ccc"></div >). La balise pre indique une partie où la mise en forme est conservée.

Le style suivant est celui des encadrés verts de code :

	.ccc {
margin: 0% 3% 0% 3%;
width: 90%;
padding: 2%;
background-color: #CCFFCC;
color: #c52d2d;
font-weight: bold; }

Dans l'exemple suivant, on définit un style de division pour faire un fond au théorème :

.thm {
    margin: 0% 8% 0% 8%;
    width: 80%;
    padding: 2%;
    background-color: #E8E4D8;
    }

Il vaut mieux définir la largeur (width) de façon relative avec un pourcentage. Le margin donne la répartiion des marges entre la couleur et le reste. Le  padding indique la marge intérieure à la couleur de fond. Evidemment, le total 2m+w+2p doit faire 100 %.

Pour en savoir plus.

Où mettre les styles ?

Dans une balise

<div style="
 margin: 0% 2% 0% 2%;
 width: 94%;
 padding: 2%;
 background-color: #CCFFCC;
">

Dans un document wims.

La définition de styles dans la fenêtre entête du document (dans la page propriétés) donne une fière allure à votre document. Copiez vos styles entre <style type="text/css"> et </style>

Dans une classe

L'apparence de votre classe se décide globalement dans apparence (dans la page configuration et maintenance). Le thème de style de la classe change la disposition et les couleurs de toutes les pages de la classe. Essayez en sauvant à chaque fois.

Dans style sheet css, vous pouvez ne rien choisir (----), choisir la feuille associer au thème (-thème-). Vous pouvez aussi définir votre style dans la dernière case, par exemple :

.aide {
 margin: 0% 2% 0% 2%;
 width: 94%;
 padding: 2%;
 background-color: #CCFFCC;
}

Vous devez alors choisir class dans style sheet css.

Alors pour définir un fond de couleur pour les introductions de feuilles, il suffira de rédiger le message ainsi :

<div class="aide"> Apprenez votre cours avant de faire les exercices !</div>

Quelques commandes Latex

Les formules Latex s'écrivent entre \( et \). Lisez la partie symboles et formules mathématiques de l'Aide.

Tester dans votre partie Composer des formules mathématiques ( Attention !

L'avertissement n'a plus lieu d'être mais comme le pli est donné en exemple, je le laisse.

) :

  \(2*e_2\)
  \(4+-1*x+1*y\)
  \(3 4\)
  \([1,2;3,4]\)
  \(e_1 + 3 e_2\)
  \(\int_0^x  (x^4+x^2) dx\)
  \(\frac{1}{x^2+1}\)
  \(\vec{e_1}\)
  \(\sqrt{2}\)
  \(\sqrt[3]{2}\)

Les commandes spécifiques à WIMS

Dans la partie 5 de l'Aide : Syntaxe des commandes, vous trouverez toutes les commandes spécifiques de WIMS.

Commandes de mise en forme

Vous avez déjà utilisé \link.


La commande \embed permet de mettre en plusieurs endroits le même contenu (par exemple l'énoncé d'un théorème) en éditant un seul bloc.

Différents plis

Pour faire un pli, vous pouvez utiliser la commande \fold de plusieurs façons.
Le contenu du pli Remarque dans Quelques commandes Latex est dans le même bloc :
   \fold{}{Remarque }{Contenu de la partie une fois dépliée.}
Dans ce cas, aucun autre fichier n'est créé, les styles css ne passent pas très bien...

Le pli Attention ! apparaît plusieurs fois et est édité dans un autre bloc :
   \fold{nom}{Attention}
   \fold{nom} 
Un nouveau fichier est créé qui s'appelle nom. Avec la première ligne, son titre est "Attention", avec la seconde son titre sera le même que le titre du bloc.

Exercice : Créez un bloc pgcd à partir de la partie Composer des formules mathématiques dont le titre sera Exercice sur le pgcd. Son texte sera l'exercice sur le pgcd proposé un peu plus loin avec un pli pour présenter le code.

Pour commenter

  \comment{Ca marche !}
Un commentaire, pas besoin d'explication !

Insertion d'exercices, images, documents, dessins ...

Dans la partie 5 de l'Aide : Syntaxe des commandes, vous trouverez toutes les commandes spécifiques de WIMS. Dans la partie 7 pour les dessins.
Le nouvel éditeur des pages de document propose des boutons pour certaines de ces insertions.

Insertion d'une image (jpeg,gif,png), d'un fichier PDF, d'un document audio ...

Pour insérer un fichier, cliquez sur Dépôt de fichier en bas de la page. Il ne vous reste plus qu'à parcourir votre ordinateur à la recherche du fameux fichier. WIMS vous indique alors la commande à recopier dans la page (bloc) du document. Par exemple :
De la même manière, vous pouvez insérer tous types de fichiers : textes, images, musiques, etc.

Son

Lien vers un site

Le code
<a  target="wims_external"  href="http://www.mathkang.org/">site du Kangourou des mathématiques</a>
crée un lien vers le site du Kangourou des mathématiques.

Lien vers des exercices

Dans un document, vous pouvez créer un lien vers un exercice de la distribution ou un outil. Essayez :
  \exercise{cmd=new&module=U1/analysis/graphder.fr}{exercice}
  \tool{module=tool/number/calcnum.fr}{outil}
  \exercise{module=H3/stat/docstat.fr}{document}
  \adm{module=adm/createxo}{commentaire}
On met dans le champ l'adresse de l'exercice. L'adresse propre d'un exercice se trouve de la manière suivante : on lance l'exercice et on cherche la rubrique A propos. Le signet pouvant être mis en référence quelque part apparaît. Pour le mettre dans le champ \exercise{}, il suffit d'enlever le début.

Lien vers un autre document

Par exemple si vous voulez faire un lien sur les documents d'aide
\doc{module=help/student/docetud.fr} pour aider les étudiants
\doc{module=help/teacher/docdocument} pour créer un document de cours (ce document !)
\doc{module=help/teacher/docexooef} pour créer des exercices)
\doc{module=help/developer/docmodtooloef} pour créer un module d'exercices OEF

   \link{bloc}{titre}{ancre}{parm1=1&parm2=2}
crée un lien avec une autre page du document ou même la même page du document (mais des paramètres nouveaux). Les paramètres peuvent être ensuite utilisés dans la nouvelle page.

Insertion d'un dessin

La syntaxe est la même que dans les exercices (voir le DocAide Exercices OEF ). (Pour plus de précisions, en particulier pour l'insertion de figures GeoGebra voir le DocAide DocAide Documents II .)
Exemple.
  \draw{200,200}{
   xrange -2,2
   yrange -2,2
   lines blue, 1,1,-1,1,-1,-1,1,-1,1,1
   fill 0,0,green
  }

Exemples aléatoires, programmation ...

Pour les questions traitées ici, voyez aussi l'Aide 7 et 8 et le DocAide DocAide Documents II .

Un exemple simple

Vous pouvez insérer : Le pgcd des entiers 127019 et 12724 est égal à 1.

grâce au code suivant :
 <a id="pgcd"> </a>
  \def{integer n = randint(1000..200000)}
  \def{integer m = randint(1000..200000)}
  \def{integer p = gcd(\n , \m)}
  Le pgcd des entiers \n et \m est égal à \p.
  \reload{Recommencez}{pgcd}

Définition d'une variable.

On définit les variables différemment que dans les exercices.
  \def{integer a =  8}
Dans un exercice, on aurait écrit \integer{a = 8}
Allez consulter quand vous en aurez besoin le document DocAide Exercices OEF

Programmation

Une boucle, même syntaxe que dans les exercices :
 
   \for{i = 1 to 10}{ \i , }
Un branchement, même syntaxe que dans les exercices :
   \def{text n = randitem( exercice, exercices) }
   \if{\n issametext exercice}{Un}{Des}\n
 
Pour réactualiser le document avec éventuellement de nouvelles variables, mon étoile fétiche :
   \reload{<img src = "gifs/doc/etoile.gif" alt = "rechargez" style="width:20px;height:20px;"/>}

Insertion d'un formulaire
Cacher la solution dans un exemple

Composition, statut d'un document ...


Règles de la version imprimable : La version imprimable ne se déroule pas selon l'ordre de navigation défini par les préc. et suiv.. Les blocs apparaissent si et seulement s'il y a un lien vers eux dans leur parent et ils apparaissent dans l'ordre des liens.

Application aux figures GeoGebra : Si les figures interactives GeoGebra apparaissent dans la version imprimable, elles disparaissent à l'impression.
Pour pallier ce manque, on peut définir un bloc figimp par un lien sous la figure interactive (dans le bloc figurepar exemple), y insérer une version fixe imprimable de la figure et définir figure comme le parent de figimp. Le bloc figimp ne gênera pas la navigation mais apparaîtra à l'impression.

document pour l'aide à la création et à l'édition d'un document WIMS.
: wimshelp, serveur interactif, enseignement, cours en ligne, ressources pédagogiques, sciences,langues


This page is not in its usual appearance because WIMS is unable to recognize your web browser.

In order to access WIMS services, you need a browser supporting forms. In order to test the browser you are using, please type the word wims here: and press ``Enter''.

Please take note that WIMS pages are interactively generated; they are not ordinary HTML files. They must be used interactively ONLINE. It is useless for you to gather them through a robot program.

Description: document pour l'aide à la création et à l'édition d'un document WIMS. serveur web interactif avec des cours en ligne, des exercices interactifs, des calculatrices et traceurs en ligne

Keywords: serveur interactif, enseignement, cours en ligne, ressources pédagogiques, sciences,langues, documentation, wimshelp