Formation Création Web, Flash et Dreamweaver

OBJECTIFS DE LA FORMATION

Ce stage de formation de trois semaines est une initiation à la création de sites internet dynamiques et d’animations interactives, avec les logiciels Flash et Dreamweaver. Bases HTML. Initiation à Flash. Initiation à Dreamweaver. Imports/exports, serveurs, dialogue entre logiciels. Mises à jour de sites.

Flash est le logiciel incontournable et référence pour la création d’animations interactives, principalement à destination d’internet.
Dreamweaver est le logiciel le plus répandu pour la création et mise en place de sites internets professionnels.

PROGRAMME COMPLET DE LA FORMATION

BASES GENERALES

Introduction au web. Format HTML : analyse, modification, écriture. Bases sur swf, flv, php, mysql, java, css. Web 2.0. Ajax. Travail collaboratif : graphisme, Flash, Dreamweaver – la construction d’un site internet dynamique, en équipe.

LES ANIMATIONS POUR LE WEB, FLASH  (5 jours)

Comparatif des techniques d’animation web. Avantages de Flash et taux de pénétration du marché. Différences entre les images bitmap et les images vectorielles.

BASES  Formats FLA, SWF, HTML. Compilation animation et application. Médias à intégrer (images, sons, vidéos, données…).

ESPACE DE TRAVAIL  Barre d’outil. Scène, échelle temporelle ou scénario : calques, images-clés et interpolations. Utilisation de la palette Propriétés et des panneaux de l’interface Flash.

DESSIN VECTORIEL ET SYMBOLES  Outils de dessin vectoriel. Panneau Bibliothèque et Symboles. Symboles Graphiques, Clips ou Boutons. Choix par son comportement. Clips imbriqués, hiérarchie parent-enfant. Occurrences. Création de boutons animés.

IMPORTATIONS GRAPHIQUES  Photoshop, Illustrator, InDesign ou Fireworks. Traçage de bitmaps et conversion en vectoriel.

IMPORTATIONS SONS /  VIDEOS  Préparation des médias. Encodage, Adobe Media Encoder. Formats vidéos Flash : FLV et F4V, spécificités, avantages,… Différences entre téléchargement progressif et flux continu. Composants et skins.

TECHNIQUES D’ANIMATION  Image/image. Interpolations classiques, forme, mouvement. Présélections mouvement. Imbrications dans les symboles. Pelures d’oignons, calques de trajectoire, masques. Interpolations cinématique inverse et maillages.

PROGRAMMATION  ActionScript – AS1, AS2 et AS3. Variables. Actions de navigation. Etiquettes d’images. Boutons, on-off. Fragments de codes. Composants Flash. Gestion sons et vidéos. Boutons vidéo/son. Données externes. Objets XML. Exemples.

TESTS  Optimisations, bande passante et mémoire. Explorateur de scripts et débogage.

EXPORTATION  Formats : SWF et HTML, images fixes, vidéos quicktime, exécutables Mac et PC.

BASES GENERALES & DREAMWEAVER (10 jours)  

Méthodologie pour la création d’un site : médias, intégration Dreamweaver, programmation, tests, publication.  Travail collaboratif. Place du logiciel. Intégration Dreamweaver, Flash, Fireworks et Photoshop pour un flux efficace.

ESPACE DE TRAVAIL   Composants de l’interface, palettes, inspecteurs et outils. Fenêtre Document pour travailler en mode graphique et/ou dans le code. Personnalisation de l’espace de travail selon les étapes.

CREATION / GESTION DE SITES WEB  Premier site web. Paramétrage. Fenêtre de gestion de site, création, modification, suppression. Paramètres de transfert pour tests et mise en ligne. Méthodologie et gestion des dossiers et fichiers du site.

CREATION DE PAGES  Page index du site. Propriétés en mode HTML ou CSS. Intégration d’éléments et gestion des propriétés (texte, images, animations flash et vidéos). Création de liens absolus et relatifs. Création d’une ancre, d’un menu de reroutage. Création d’un bouton texte, d’un bouton image avec effet de survol. Intégration de vidéos YouTube, DailyMotion, Viméo…

MISE EN PAGE WEB EN MODE HTML  Tableaux. Modes standard et développé. Paramètrage fluide ou fixe. Intégration des tableaux générés dans Photoshop ou Fireworks. Cadres et jeux de cadres.

MISE EN PAGE WEB EN MODE CSS  Versions de CSS. Problèmes de compatibilité. Hiérarchie et héritages dans les feuilles de style en cascade. Les styles : balise, ID, classe. Boites de dialogue de création de styles. Balises div et div PA.

MODELES, ACTIFS  Création d’un modèle. Paramètrages des zones modifiables. Palette Actifs dans la totalité du site web.

CREATION DE FORMULAIRES  Insertion et paramètrage des champs de formulaire. Validation et envoi.

CREATION D’INTERACTIVITE  Comportements JavaScript et Fragments de code. Fichiers utilisant le cadre applicatif Spry et l’insertion de Widgets au sein d’une page web.

CREATION DE PAGES DYNAMIQUES   Technologies « serveur ». Configuration bases de données. Connections aux bases de données avec PHP/mySQL. Enregistrements de bases de données. Ajout, modification de contenus dynamiques aux pages web

FINALISATION  Optimisation du site pour le référencement. Vérification des liens et tests hors ligne et en ligne. Publication du site web.

ATELIER PRATIQUE  Création d’un site web