Introduction

Edition de sites internet
Panorama des outils de création de pages web
Présentation des produits Adobe
Découvrir le cloud Computing avec Dreamweaver CC
Créer son Adobe ID

Premiers pas avec Dreamweaver

Découverte de l'interface : les fenêtres, les palettes de composants, les panneaux

Organisation de l'espace de travail
Paramétrage des préférences : affichage, navigateurs, éditeur, ...
Création de pages web : édition, modification, sauvegarde
- Mise en forme de texte (polices, titres, paragraphes, texte préformaté)
- Insertion d'images et manipulation de propriétés (redimensionnement, optimisation, recadrage)
- Création de liens hypertextes (lien vers une page web, lien vers un fichier, lien de messagerie)
- Création, modification de tableaux
Définition d'un site Dreamweaver, gestion des fichiers, affichage de la carte du site

Atelier : Création d'un premier site

Rappel code XHTML

Principes de fonctionnement
Bases du XHTML : balises et attributs, catégories de balises.
Présentation des principales balises (texte, images, listes à puces, liens, tableaux...)
Manipulation de tableaux

Atelier : Création d'une page web pour le test des balises

Balises HTML5

Structure et sémantique en HTML5
Utilisation de la balise
Utilisation de la balise

Atelier : Création d'une page HTML5 pour le test des balises

Styles CSS

Principes de base
Différents types de règles CSS
Mise en forme CSS avec Dreamweaver
- Redéfinition d'un style d'une balise XHTML
- Définition des styles de sélecteurs : liens survolés, liens actifs...
- Création de styles personnalisés
- Application de styles personnalisés
- Attacher une feuille de style

Atelier : Donner du style aux pages précédemment créées.

Création de sites web avec la méthode des tableaux

Création de l'ergonomie d'un site web
Gestion des problèmes de positionnement
Génération du gabarit principal
Édition des pages issues du gabarit

Atelier : Création d'un site avec le méthode des tableaux

Les Formulaires

Fonctionnement d’un formulaire
Création de formulaires : Insertion de champs, mise en forme...
insertion de nouveaux champs html5
Validation du formulaire
Récupération des données, envoi d’un mail avec PHP
Mise en forme CSS des formulaires

Mise en ligne de sites web avec Dreamweaver

Principes du transfert FTP
Paramétrage du client FTP de Dreamweaver
Transfert de fichiers sur le serveur distant
Présentation d'autres outils FTP
Synchroniser ses fichiers

Atelier : Mettre en ligne notre site web sur un serveur distant

Utilisation des modèles

Principes de fonctionnement des modèles de Dreamweaver
Architecture du modèle et organisation des différentes régions
Créer un modèle
Utiliser un modèle

Atelier : Création de pages issues de modèle

Fonctions avancées de mise en forme

Insertion de signets
Liens vers les signets
Présentation du Flash
Création d’un menu Flash
Insertion de texte animé, de médias (son, vidéo)

Présentation du DHTML

Principes de fonctionnement du DHTML
Génération de contenu dynamique avec Dreamweaver :
- Les comportements (apparition d’objets, ouverture de fenêtres, images survolées...)
- Les scénarios (déplacement de calques, titre défilant...)

Atelier : Création de menus dynamiques
Validation de formulaires, Effets-Spéciaux, Pop-Up

Initiation au référencement

Présentation des enjeux du référencement
Concepts et insertion des balises d’en-tête
Critères de classement des outils de recherche
Règles à respecter et Spam-dexing

Découvrir les grilles fluides

Présentation du responsive design
Mode grille fluide
Palette d´insertion
Créer une structure de page
Décliner sur les autres supports
Créer un modèle de page
Créer une arborescence et une navigation

Atelier : Création d'un site Responsive Design

Découvrir jQuery UI/ JQueryMobile

Présentation de jQuery UI
Fonctions essentielles
Installer JQuery UI et utiliser un composant de base
Utiliser les onglets de JQuery
Panneau JQuery Mobile

Atelier : Réalisation d'un menu dynamique avec JQuery UI,
utilisations des effets JQuery
création et mise en forme d'une page à destination de mobile

Découvrir CSS Designer et Transition

Présentation de CSS Designer et Transition
Découvrir l´adaptation de la structure
Ajouter et modifier des règles
optimiser les styles

Atelier : Atelier: Réaliser des dégradés, des transitions sur des éléments HTML

Extension Manager

Installer Extension Manager
gérer les applications adobe sur votre machine

Conduite de projet Web avec Dreamweaver

Spécification d’un site : le cahier des charges
Conception du site : l’ergonomie, la navigation, la charte graphique, les bases de données, etc.
Développement du site : le rôle de Dreamweaver
Mise en ligne du site : l’importance de la recette
Suivi du site : animer et maintenir son site Web

Conclusion

Passage de la certification (si prévue dans le financement)