Publication Flash sur Internet et Transfert avec Dreamweaver

1. Publication Flash sur Internetet Transfert avec Dreamweaver COM3562 Communication Multimédia MARS 2011

2. Aujourd’hui • Publication d’un document Flash pour Internet Composantes • Internet 101 - Structure d’un site Internet • Pages, liens, Html et autre • Spécifier comment s’ouvre un lien vers une page web • Dreamweaver • Créer un site web sur un serveur • Exercice créer votre site et transférer vos fichiers. • Site sur Dreamweaver et la production web

3. Internet 101 • http://lrcm.com.umontreal.ca/dufresne/bta/ProdDream/frame1.html Avec Flash ajouter des animations. Exemples.

4. Internet 101 • Attention • Pas d’accent et pas d’espace dans les noms sur Internet pour les images, les pages, les dossiers, les fichiers etc. • Pas de caractères spéciaux comme parenthèses. virgule, apostrophe ou autre. • Les points sont réservés aux extensions de fichier.

5. Types de liens functionfl_ClickToGoToWebPage_5(event:MouseEvent):void {navigateToURL(new URLRequest("http://www.adobe.com"), "_blank"); } Blank= Nouvelle fenêtre vide Self = fenêtre de la page où est le lien cliqué. Top = fenêtre de niveau supérieur D’autres choix définissent un cadre avec un nom. dans une page et où la nouvelle page s’affichera.Par exemple dans le site Afrique, les animaux apparaissent dans le cadre ou emplacement appelé " image " On met alors "http://www.adobe.com"), "image"pour désigner l'Emplacement par son nom On peut nommer un emplacement "bas", "contenu",etc.

6. Publier une application Flash • Différents Formats – Internet (HTML), Iphone, AIR, etc. • Publication par défaut • HTML, SWF. • Préférences à spécifier. • Votre site doit être dans un dossier où seront • Les pages Html • Le document SWF qui est la version exportée de votre Flash * • Les images (qui restent séparées sur Internet, pas comme Word) • Les autres documents qui seront liés aux pages. * Par défaut le document original de flash (.fla) sera laissé là. Vous n’avez pas à transférer ce document sur le serveur, mais il est plus facile de le garder là pour les modifications futures.

7. Vérifier votre compte sur le serveur ESIBAC • Dans Firefox sur MAC Firefox ou Explorer sur PC • Important assurez-vous que les pop-up sont autorisés • Firefox / Préférences .. Bloquer les pop-up n’est pas coché • Connectez vous sur http://www.dgtic.umontreal.ca/Profil/ Redéfinissez votre mot de passe pour le serveur ESIBAC Ça sera activé 5 ou 10 minutes plus tard. (il faut attendre) Vérifiez ensuite si le site est accessible dans Dreamweaver.

8. Vérifier votre compte sur le serveur ESIBAC • Dans Firefox sur MAC Firefox ou Explorer sur PC • Connectez vous sur http://www.dgtic.umontreal.ca/Profil/ Redéfinissez votre mot de passe pour le serveur ESIBAC Ça sera activé 5 ou 10 minutes plus tard. (il faut attendre) Vérifiez ensuite si le site est accessible dans Dreamweaver.

9. Définir un site • Préparer le dossier où sera votre site avec le html et le swf • Ouvrir Dreamweaver • Menu Site /Gérer les sites • Cliquer le Bouton Nouveau pour créer un site • Donnez un nom et choisissez le dossier local ou est votre site.

10. Définir un site • Définir le serveur où sera téléchargé le site. • Notez bien les différentes valeurs dans les champs esilbac1.esi.umontreal.ca TESTEZ Dufresne est mon nom d’utilisateur, le votre est P012345XXX

11. Définir un site • Définir le serveur où sera consulté le site. • Notez bien les différentes valeurs dans les champs. Testez le site

12. Afficher les fichiers dans Dreamweaver • Lorsque vous avez terminé de définir le site. • Faites afficher les fichiers (Menu Fenêtre / Fichiers) • Vous pouvez connecter • Afficher le site local et distant

13. Transférer sur le serveur • Pour transférer votre site sélectionner les éléments et demandez Menu Sites/ Placer ou utilisez la flèche bleue. • Modifiez les autorisations pour permettre aux visiteurs d’Accéder aux pages et aux images. • Sélectionnez le fichier sur le serveur • CTRL Définir les autorisations

14. Consultez votre site sur Internet • Ouvrez le navigateur Safari Firefox ou Chrome • Et tapez l’adresse suivante: • http://www-bac.esi.umontreal.ca/~dufresne/index.html • Vous remplacez Dufresne par votre nom usager P00XXXXX,puis vous mettez le nom de votre première page • Si la première page s’appelle index.htmlvous n’avez pas besoin de l’écrire. Par défaut elle s’ouvrira. Par exemple: http://www-bac.esi.umontreal.ca/~dufresne/Afrique/ Ouvre un site dans un dossier nommé Afrique et la page index.html s’ouvre.

15. Exercice • Trouvez un document Flash (Test interactif ou animation). • Placez le dans un dossier • Ouvrez le et publiez le. • Vérifiez que c'est correct en local. • Avec Dreamweaver Définissez votre site sur le serveur et transférez la page HTML et le document SWF sur le serveur. • Modifiez les autorisations. • Testez l’Accès dans le navigateur web.