Dreamweaver fait partie de la famille des logiciels WYSIWYG (What You See Is What You Get): il permet de visualiser le résultat du code et propose en outre une assistance à l'écriture du code puisque la manipulation d'éléments graphiques génère automatiquement des coordonnées codées. La prévisualisation dans un navigateur confirmera immédiatement le comportement de la page avant publication.
Il suffit pour cela de désigner le navigateur dans Édition > Préférences > Aperçu dans le navigateur.

Pour bien cerner le rôle de Dreamweaver, il faut comprendre qu'un site peut être entièremment réalisé "à la dure" à l'aide d'un éditeur de texte ou de code comme TexEdit (Mac OSX), Notepad ou Notepad ++ (Windows). Écrire du code HTML n'en demande pas plus, puisque les pages peuvent ensuite être exécutées et vérifiées à l'aide d'un navigateur. Certains webdesigner préfèrent cette solution, reprochant à Dreamweaver de produire un code parfois douteux, ce qui n'est pas faux. Tôt ou tard, il s'avère indispensable de coder soi-même.
Dreamweaver reste cependant un excellent outil de gestion de site. Déplacer des fichiers, les renommer, vérifier la validité des liens sont des tâches facilitées par Dreamweaver.

La page Introduction vous donne les premières indications à suivre.
Cette phase sera commentée pas à pas en atelier.

Je vous recommande chaudement de parcourir le didacticiel de Dreamweaver et les liens ci-dessous.
Pour vous familiariser avec la syntaxe HTML, vous passerez du mode "Création" en mode "Code"
ou vous utiliserez les deux fenêtres en même temps.

Notez que Dreamweaver permet un accès direct à votre éditeur d'image (ex: Photoshop).
Il suffit pour cela de le désigner: Édition > Préférences > Type de fichiers/Éditeurs.

Pour comprendre l'anatomie d'une page Web, je vous conseille d'en enregistrer quelques-unes en pièces
détachées, afin de les analyser techniquement dans Dreamweaver.
Netscape Communicator ou Firefox vous offrent cette possibilité, sous la forme d'un fichier HTML accompagné d'un dossier contenant les images et les éventuelles programmations annexes (CSS, javascript externes, etc).
Placez-vous sur la page à aspirer. Ouvrez Fichier > Enregistrer la page sous.
Créez un dossier avant d'enregistrer la page, le navigateur enregistrera la page HTML et créera lui-même
un sous-dossier pour rassembler les fichiers associés à cette page (images, javascript ou CSS).
La page sera prête à être ensuite ouverte dans Dreamweaver.

À savoir: lors de la consultation d'une page avec Explorer, les différents éléments (fichiers .swf ou .mov)
arrivent sur votre ordi dans le dossier "Fichiers temporaires".
Sur PC: documents and settings/user/local settings/temporary internet files
Sur Mac: système/utilisateur/nom/bibliothèque/préférences/Explorer/fichiers temporaires.

La fonction "Enregistrer sous" de Explorer permet d'aspirer un page, voire un site
(bouton "options" dans la boîte de dialogue) mais les documents sont sauvés en un seul fichier dontle format est propre à Internet Explorer.

Dreamweaver est fourni avec des templates (gabarits), bonne idée pour effectuer des premiers tests...




MediaBox. Un site bien informé et rempli de ressources (tutoriaux, forums, etc).
FlashXpress. Bonnes ressources (code, tutoriaux, extensions, etc).
Aspirateurs de pages pour PC ou Mac. Réimportez des pages dans Dreamweaver pour comprendre.

Créer un menu déroulant. Réalisé avec Fireworks et intégré dans Dreamweaver, proposé par MediaBox.
Menu déroulant. Création d'un menu déroulant dans Dreamweaver, proposé par Mossa world.

Ades Design. Tutoriaux Dreamweaver. Voir aussi comment créer un menu Java.
CBT Café. Tutoriaux Dreamweaver.
Dreamweaver tips. Tutoriaux Dreamweaver.