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

Slides:



Advertisements
Présentations similaires
Portail Sdin Méthodes pour la contribution du portail SDIN Mars 2013.
Advertisements

La création de pages web Lorsqu'on « navigue » sur l'Internet, les pages que nous visitons sont encore pour beaucoup en HTML. Comment fait-on pour les.
[Nom du présentateur] [Titre/position/statut du présentateur] Webinaire pour [nom du groupe] [Nom de l'institution] [Date]
TOUQUET Arnaud ▪ GI05 BLONDEEL Igor ▪ GM05
Gérer un site avec Kompozer
! 1 CREATION D'UNE MAQUETTE EXPORT / IMPORT
Créer un document LES FONCTIONS ENREGISTRER LES FORMATS Retour au menu principal.
Principe de défilement du document dans un traitement de texte
Les TABLEAUX Retour au menu principal.
Support Initiation Publisher 2010
Présentation des tables des matières j puis appuyez sur F5 ou cliquez sur Diaporama > Du début. Pour commencer le cours, dans la barre des messages, cliquez.
12 novembre 2012 Grégory Petit
Le portail des sports des associations de la ville de Nice
Mars 2013 Grégory Petit
Prologue : les premiers préparatifs Première étape : Ouvrir le logiciel de création de pages au format HTML (pages Web) Deuxième étape : enregistrer la.
Dans le menu Staff vous créez une nouvelle page
Création d'un diaporama Création d'un diaporama
TracenPoche Les fichiers >.
28 novembre 2012 Grégory Petit
Notions sur le XML Réfs : manuel p 149. Introduction Le XML (eXtensible Markup Language) est un standard d'échange de données. Il fait partie comme le.
Présenté à Jean Vachon Exécuté par Luc Rainville.
Initialisation des sites web Étapes importantes. La conversion de vos comptes Web nest pas terminée (après discussion avec les techniciens voici comment.
Conversion de fichiers
Le flux RSS Symbole du flux RSS..
Plan de la rencontre 8 –Retour sur les cours précédents –Conception dun site WWW –Outils de développement de sites WWW Word Introduction à Netscape Composer.
Patron TRUCS ET ASTUCES!
Créer une page web en quelques clics
Hot Potatoes
Le langage du Web CSS et HTML
Centre d’échange d’informations sur la Convention sur la Diversité Biologique Bienvenue dans le cours sur l’ajout d’une page web sur un site web développé.
Internet WEB.
Comment utiliser FrontPage?
Manuel Kervarker.org : l'accueil
Design et intégration d’images et de graphiques
LOGICIEL DOCUMENTAIRE PMB
POWERPOINT.
SI 28 - Écriture interactive & multimédia Dreamweaver Séance 1 Petit Clara & Palfart Julien Printemps2008 Printemps 2008.
INTERNET Le langage HTML
Faîtes vos publipostages vous même
Initiation au JavaScript
Comprendre l’ergonomie du module STSWEB. La page d’accueil de STSWEB Code et Nom de l’établissement Version du module Campagne en cours Année affichée.
Publication Flash sur Internet et Transfert avec Dreamweaver COM3562 Communication Multimédia MARS 2011.
Gérer ses références bibliographiques Zotero Centre de documentation de l’UFR 11 Science politique Fevrier 2010 Lucie Ribourg.
Savoir utiliser le réseau informatique
Le JavaScript.. Histoire Langage créé en 1995 par Brendan Eich pour la Netscape Communications Corporation. Est inspiré de nombreux langages, notamment.
Création d’un site Web -Création « Graphique » de pages Création « Graphique » de pagesCréation « Graphique » de pages -Le graphisme Le graphismeLe graphisme.
Conception des pages Web avec
Séminaire de rentrée cours de programmation web & Wordpress
Language html Hyper Text Markup Language
Scénario Les scénarios permettent de modifier la position, taille … des calques au cours du temps. Son fonctionnement est très proche de celui de Macromedia.
Dreamweaver Séance 1.
SI28 Dreamweaver- Séance 1
1 Présentation de DREAMWEAVER (1) Gaël TREMEAU GI05 Printemps 2006.
Présentation de Dreamveawer
Dreamweaver MX Jauneau Marie Claude-Antoine Zarate.
Bloc 1 - UE 5 - Technologies de l’information et de la communication TIC Bachelier en immobilier T. SOUMAGNE.
Dreamweaver MX.
Présentation Dreamweaver 8 (1) Nina BOUAZIZ et Matthieu DI RUSSO SI28.
Guillaume MICHAUD – Yvan LECOMTE
DREAMWEAVER Première séance Villaron Audrey – Shibly Tarek.
Exposé DREAMWEAVER 2 Guillaume DUBREUIL Adrien HADOUX.
Plan de la présentation Le langage HTML Dreamweaver MX Les premiers outils pour créer une page web :  Propriétés d’une page  Création de cadres  Création.
SI28 Malépart Céline Jérémy Palmier
DREAMWEAVER SEANCE 1 Axel JACQUET GM05 – Julien VAN MOORLEGHEM GM05 A2008 Écriture interactive & multimédia Présentation Dreamweaver 8.
On va découvrir la magie de ....
Introduction au HTML Qu’est ce que le HTML ?
Dreamweaver CS4 séance 1 Ahmed Aryan – Isma Teir.
Dreamweaver 2 Feuilles de Style CSS Formulaires Calques Comportements
1 er séance SI28 A2004 YIN Lei Emmanuel Eugene. Plan de l’exposé  Introduction au HTML  Le HTML dans le bloc-notes (notepad)  Présentation de Dreamweaver.
Gabriel Dumouchel, doctorant Université de Montréal Atelier Jouvence 2011.
Transcription de la présentation:

TracenPoche Insérer une figure TepWeb >

 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

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

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 ? ><

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) ><

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

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. <>

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-96b « codebase=" 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=" />

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" " Ma page <object classid="clsid:d27cdb6e-ae6d-11cf-96b " codebase=" width="500" height="500" align="middle"> <embed src="tepweb 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=" /> 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.

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-96b " codebase=" 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=" /> Retour au menu

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

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

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

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 !

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

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

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.

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