Dreamweaver CS6 & versions antérieures

Programme d'initiation

Explication de l'environnement

• La fenêtre du document
• La palette d’objets : Commun – Cadres – Caractères – En-tête – Formulaires – Invisibles
• Le lanceur
• L’inspecteur de propriétés
• Taille des fenêtres pour différents types d’écran
• La barre d’état
• La palette d’Historique
• Les menus contextuels
• Paramétrage des navigateurs
• Raccourcis claviers

Nouveau document

• Page vierge
• Exemple de page
• Mise en forme de grille fluide

Traitement de texte

• Récupération de texte
• Caractères spéciaux
• Styles
• Alignements
• Orthographe
• Rechercher/Remplacer
• Listes
• Indexations
• Saut de ligne
• Les propriétés de la page
• Les couleurs : pipette web-safe – gomme et palette
• Définir la palette de couleurs

Les images et les gifs animés

• Insertion d’images et paramétrage
• Chemin absolu et chemin relatif
• Alignement avec le texte
• Zones cliquables
• Habillage et alignement
• Les bibliothèques

Les différents types de liens

• Lien vers une page à partir d’un texte
• Lien vers une page à partir d’une image
• Lien vers une adresse e-mail
• Lien vers un site
• Lien vers une ancre dans le document
• Lien vers une ancre d’un autre document
• Menu de reroutage pour une liste de pages

Les tableaux

• Fenêtre des propriétés
• Différents modes de sélection
• Modification du tableau et des cellules
• Imbrication/Fractionnement des cellules
• Mise en couleur
• Duplication de cellules
• Mode de mise en forme

Construction du site

• Création du site
• Travail sur l'ergonomie générale,
  définir une structure de navigation
• Renommer les pages
• Gestion des liens
• Nettoyer le code HTML et le code HTML Word
• Création de rapport
• Publication du site

Configuration des pages

• Affichage des règles
• Affichage de la grille et paramétrage
• Les éléments invisibles
• L’historique des tâches – Automatisation des actions

Autres insertions

• Lignes
• Bloc espace
• Rupture de ligne

Le langage HTML

• Les 3 affichages
• Explication des codes
• Création et modification des styles html
• Rechercher rapidement dans le code
• Valider le code en fonction des navigateurs
• Nettoyer le code source d’un document

Les calques

• Création d’une structure de pages et liaison avec la feuille de style

Les modèles

• Création et application à un document
• Modification d’un modèle

Les feuilles de style CSS

• Styles HTML : modification et création
• Styles CSS : html - classes - ID - composé
• création – modification – application
• Récupération de styles dans le site en cours

Programme de perfectionnement

Révisions selon l'audit préalable avec les stagiaires

• La mise en page fluide
• Les calques
• Les feuilles de style
• Les modèles
• La publication

Eléments dynamiques HTML

• Date
• Animation Flash
• Composants
• Image survolée ou rollover
• Les barres de navigation

Les calques

• 2 types de calques (DIV/SPA et Layer/Ilayer)
• Propriétés des calques
• Alignements
• Ordre de superposition
• Masquer/Afficher un calque
• Les calques imbriqués
• Déplacement de calques
• Modification d’un calque en tableau
  et inversement
• Tracé d’image en vue de la construction
  de la page

Les balises d'en-tête et notion de référencement

• Zones de recherche
• Mots clefs
• Eléments spéciaux
• Description de la page

Les éléments multimédia

• Insertion d’animations Flash
• Traitement des vidéos

Les comportements

• Changer les propriétés d’un objet
• Remplacer une image par une autre
• Vérifier les plug-ins
• Faire apparaître un message
• Ouvrir une fenêtre du navigateur
• Contrôler une animation Flash
• Comportements associés aux calques
• Créer des transitions d’apparition de pages

Les formulaires

• Création et ajout d’objets : zone de saisie – cases à cocher – boutons radio
  menu déroulant – liste déroulée – champ caché

Divers

• Préférences de Dreamweaver
• Mettre des fichiers en téléchargement
• Les outils invisibles : commentaires
• Aperçu des sites sur écrans multiples en vue de contrôler le rendu du contenu html5