La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

TracenPoche Insérer une figure TepWeb >.  Contenu de l'archive tepweb.zip Contenu de l'archive tepweb.zip  Quelques notions de html Quelques notions.

Présentations similaires


Présentation au sujet: "TracenPoche Insérer une figure TepWeb >.  Contenu de l'archive tepweb.zip Contenu de l'archive tepweb.zip  Quelques notions de html Quelques notions."— Transcription de la présentation:

1 TracenPoche Insérer une figure TepWeb >

2  Contenu de l'archive tepweb.zip Contenu de l'archive tepweb.zip  Quelques notions de html Quelques notions de html  Insérer une figure TepWeb Insérer une figure TepWeb  Créer sa page html pas à pas Créer sa page html pas à pas Quitter Insérer une figure TepWeb dans un document HTML

3 Le fichier tepweb.zip contient :  une page html (exemple.htm) qui contient 2 figures TepWeb  deux fichiers scripts qui correspondent aux 2 figures que l’on trouve sur la page exemple.htm  Six fichiers tepweb##.swf à placer avec le ou les scripts dans le répertoire de la page web que vous allez créer. Du fichier TepWeb que vous choisirez dépendra la taille de la figure dans votre page html. Le fichier tepweb.zip Retour au menu

4 Le langage html est un code lu par votre navigateur (IE, Firefox,...) quand vous ouvrez une page web. Vous pouvez, si vous le voulez, lire ce code en cliquant sur Affichage puis Source de la page. Qu'est ce qu'une page html ? ><

5 Pour créer une page html nul n'est besoin de connaître ce langage. Des logiciels appelés éditeurs html permettent de les créer facilement à la manière d'un document texte. Certains de ces logiciels sont très connus comme Dreamweaver ou FrontPage mais ils sont payants, d'autres moins connus sont gratuits mais aussi performants comme Nvu. Qu'est ce qu'une page html ? (suite) ><

6 Voici l'exemple d'une structure de document HTML : Ma page...... Le document HTML... Qu'est ce qu'une page html ? (fin) < Pour insérer une figure TepWeb dans votre page il suffira de copier le code entre ces 2 balises. Retour au menu

7 Pour créer une page html qui contient une figure tepweb il faut dans un premier temps créer un répertoire qui contiendra :  Votre page html : mapage.htm  Le script de la figure : script1.txt  Le fichier TepWeb : tepweb.swf Insérer une figure Tepweb Par défaut TepWeb est en 300 pixels par 300 pixels mais d'autres résolutions sont disponibles : tepweb200200, tepweb400300,... Il faut donc placer à l'intérieur du répertoire le tepweb que vous souhaitez utiliser. <>

8 En affichant le code source de la page exemple.htm livrée avec tepweb.zip vous obtiendrez le code qui permet d'insérer une figure tepweb dans votre page html. Insérer une figure Tepweb (étape 2) Vous pouvez adapter ce code si vous changez de script (valeurs en vert), ou si vous changez de tepweb, c'est à dire de taille de figure (valeurs en rouge). <> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000« codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="300" height="300" align="middle"> <embed src="tepweb.swf?script=script1.txt" width="300" height="300" align="middle" quality="high" bgcolor="#99cccc" swliveconnect=true id="script1" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

9 Il ne vous reste plus qu'à copier puis à coller ce code dans le code de votre page html en utilisant votre éditeur html. Insérer une figure Tepweb (étape 3) <> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Ma page <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="500" height="500" align="middle"> <embed src="tepweb500500.swf?script=script2.txt" width="500" height="500" align="middle" quality="high" bgcolor="#99cccc" swliveconnect=true id="script2" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> La page dont vous voyez le code contient une figure TepWeb nommée script2 qui apparaît dans une fenêtre de 500 sur 500.

10 Le ou les fichiers tepweb.swf et donc les scripts ne doivent pas nécessairement se trouver dans le même répertoire que les pages contenant les figures TepWeb. On peut tous les centraliser dans un même répertoire et il suffit alors de modifier le code source pour indiquer le nouveau chemin. Insérer une figure Tepweb (fin) < <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="300" height="300" align="middle"> <embed src="../flash/tepweb.swf?script=script1.txt" width="300" height="300" align="middle" quality="high" bgcolor="#99cccc" swliveconnect=true id="script1" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> Retour au menu

11 Il faut commencer par créer le script de la figure que l'on veut insérer dans sa page html. On peut pour cela utiliser la version en ligne de TeP. Créer sa page : étape 1 <> On peut créer alors le dossier hôte et nommer le script de manière explicite On enregistre le script de sa figure

12 A l'intérieur du dossier où l'on a placé le script on colle le fichier swf que l'on utilisera et que l'on peut trouver dans l'archive tepweb.zip. Créer sa page : étape 2 <> Copier puis Coller

13 A l'aide de son éditeur html « préféré » on crée une nouvelle page html que l'on nomme et que l'on enregistre tout de suite dans le répertoire créé précédemment. Créer sa page : étape 3 <> Répertoire Nom de la page

14 Avant de vous occuper du contenu, il est préférable de s'occuper des « Propriétés de la page » que sont : la couleur du fond, la police par défaut ainsi que sa taille et sa couleur, le titre de la page (affiché par le navigateur),... Créer sa page : étape 4 <> Aspect de la page Titre de la page N'oubliez pas d'enregistrer après chaque modification !

15 Votre page est maintenant prête à recevoir votre contenu. Vous pouvez, par exemple, commencer par un texte de présentation de la figure TepWeb que vous allez insérer. Créer sa page : étape 5 <> Une ligne vide a été prévue pour y placer la figure TepWeb

16 En affichant le code de la page que vous êtes en train de créer vous reconnaîtrez votre ligne vierge par ces caractères : Créer sa page : étape 6 <> Il vous suffit alors de venir coller le code source de la figure TepWeb (obtenu grâce au fichier exemple.htm) entre le 2 balises et à la place de

17 Attention ! N'oubliez pas d'adapter le code de la figure en fonction du fichier tepweb.swf et du script. Créer sa page : étape 7 <> Si vous quittez l'affichage du code pour revenir au mode création vous voyez apparaître un objet Flash là ou il y avait votre ligne vide.

18 Une fois le fichier enregistré vous pouvez ouvrir votre page pour visualiser le résultat dans votre navigateur Internet. Créer sa page : étape 8 < Retour au menu


Télécharger ppt "TracenPoche Insérer une figure TepWeb >.  Contenu de l'archive tepweb.zip Contenu de l'archive tepweb.zip  Quelques notions de html Quelques notions."

Présentations similaires


Annonces Google