Sommaire: Support de cours utilisation des outils de Dreamweaver
Cursus Dreamweaver
Dreamweaver
Introduction
Lancer un nouveau projet
Introduction
Comment lancer un nouveau projet dans Dreamweaver
Structure des dossiers
Introduction
Patrons et feuilles de style
Illustrations et téléchargements
Dossiers vs. URL
Caractères singuliers
Site Web multilingue
Pages de défaut
Plus d’informations
Patrons
Introduction
Comment utiliser les patrons dans Dreamweaver ?
Patrons avancés
Télécharger des patrons
Liens
Vue de la miseen pages
Introduction
Comment utiliser Vue de la mise en pages dans Dreamweaver ?
Superposer les feuilles de style dans Dreamweaver
Introduction
Comment utiliser CSS dans Dreamweaver ?
CSS dans Dreamweaver MX2004
Exemples
Liens
Utilisation des illustrations dans Dreamweaver
Introduction
Comment utiliser les illustrations dans Dreamweaver ?
Couches
Introduction
Comment utiliser les couches dans Dreamweaver ?
Comportements
Introduction
Comment utiliser les comportements dans Dreamweaver ?
Liens
Avoirs
Introduction
Comment utiliser les avoirsdans Dreamweaver ?
Extensions Dreamweaver
Que sont les extensions ?
Où puis-je trouver des extensions?
Comment créer soi-même des extensions ?
Macromedia Contribute
Introduction
Comment fonctionne-t-il ?
Travail d’équipe
Plus d’informations
Extrait du support de cours utilisation des outils de Dreamweaver
Dreamweaver
Introduction
Macromedia Dreamweaver est sans conteste l’éditeur web le plus professionnel à l’heure actuelle Sur le marché des concepteurs web destinés aux utilisateurs privés, Dreamweaver n’est coiffé que par Frontpage de Microsoft. Sur le marché professionnel, seul Golive d’Adobe arrive à son niveau. Dreamweaver est un éditeur WYSIWYG qui permet de visualiser immédiatement la page HTML sur l’écran. En outre, il demeure toujours possible de passer à Code Viewpour consulter et éditer le code HTML dépouillé. Dreamweaver dispose de toute une série de fonctions incorporées destinées à assurer la maintenance d’un site tant statique que dynamique. Par ailleurs, le programme intègre parfaitement d’autres programmes de conception de sites de Macromedia tels Firewords (pour les images) et Flash (pour les animations).
Lancer un nouveau projet
Introduction
Dreamweaver permet de gérer simultanément différents sites web. Dans Dreamweaver, ces différents projets sont désignés par l’appellation Sites. Il s’avère important de créer pour chaque nouveau site un nouveau dossier sur le disque dur de votre ordinateur. Dreamweaver enregistrera tous les fichiers pertinents dans ce dossier.
Comment lancer un nouveau projet dans Dreamweaver ?
Pour lancer un nouveau projet dans Dreamweaver, cliquez dans le menu Site sur New Site. Une fenêtre vous permettant de configurer les diverses propriétés du nouveau site apparaît alors.Donnez un nom unique et un Local Root Folder au projet. Il s’agit du dossier de votre propre disque dur dans lequel vous allez enregistrer tous les fichiers (pages html, images, téléchargements, …). Il vous est également loisible de sélectionner un emplacement réseau en guise de local root folder. Le cas échéant, vous pouvez travailler à votre site avec plusieurs administrateurs web. Dreamweaver prévoit une fonction “check-in / check-out” qui rend impossible la modification d’un fichier qui viendrait d’être adapté par un autre administrateur web. (Cours utilisation des outils de Dreamweaver)
Structure des dossiers
Introduction
Un site Dreamweaver se compose presque par définition d’un tas de fichiers html,gif et jpeg. Il est donc important de développer dès le départ une bonne structure des dossiers qui permet de retrouver facilement les fichiers, également lorsque le site Web se développe rapidement.
Patrons et feuilles de style
Lors de la création de patrons, Dreamweaver ouvrira automatiquement un dossier /Patrons/ pour y enregistrer l’ensemble des fichiers .dwt. À proprement parler, ce dossier ne doit pas être copié vers le serveur pour pouvoir publier le site Web. Mais il est toujours utile de placer une copie des patrons sur le serveur. Si le site Web utilise différentes feuillesde style, pour différents webbrowsers par exemple, il peut toujours s’avérer utile desauver ces fichiers .css dans un dossier /Styles/ séparé.
Illustrations et téléchargements
Il est préférable de stocker les illustrations dans un dossier /Images/ séparé. Lors du développement du site, lapossibilité est offerte de prévoir un « default images folder ». Dreamweaver stockera alors toutes les illustrations dans ce dossier. En cas de nombreuses illustrations, il peut être utile de prévoir des sous-dossiers. Les autres fichiers non HTML comme les téléchargements en PDF, PPT, MS Word, MP3, etc. peuvent à nouveau être transférés dans un dossier /Téléchargements/ séparé. (Cours utilisation des outils de Dreamweaver)
Dossiers vs. URL
L’avantage majeur offert par un site HTMLstatique est que les noms des dossiers sont visibles dans la barre d’adresses du webbrowser du visiteur du site. Si le site Web se compose de différents chapitres ou différentes rubriques, il peut s’avérer utile de les stocker dans des dossiers différents. L’URL d’une page dans la barre d’adresses du webbrowser fournit donc au visiteur des informations concernant sa situation dans le site Web (voir également breadcrumbs). Des noms de dossiers clairs qui définissent le contenu du site peuvent également exercer un effet favorable sur le placement search engine du site Web.
Caractères singuliers
Comme pour les noms de fichiers des pages HTML, il faut éviter les manipulations suivantes pour les dossiers :
• Espaces dans les noms de dossiers, certains webbrowsers décomposent en effet un URL au premier espace qu’ils rencontrent.
• Mélanger les lettres majuscules et les lettres minuscules, certains serveurs Web ne font pas la distinction.
• Caractères singuliers comme é, è, à, ë, etc.
Site Web multilingue
Dans le cas d’un site multilingue, il est pratique de prévoir un dossier sous le root pour chaque langue : /NL/, /FR/, /EN/, …
Des sous-dossiers pour les différents chapitres du site peuvent alors à nouveau y être créés. Il est conseillé d’attribuer lemême nom à tous les sous-dossiers dans les différentes versions linguistiques (parexemple anglaise) pour que la structure des différentes versions linguistiques puisse toujours rester identique. Utilisez le code ISO officiel de la langue pour les noms de dossiers des langues.
…….
Support de cours utilisation des outils de Dreamweaver (235 KO) (Cours PDF)