 |
Utilisation
de Dreamweaver 2.0 (I) |
|
Annulation de modifications :
Dans Dreamweaver, comme dans tout autre logiciel :
Pour
corriger une erreur, une "fausse maneuvre", ou lorsqu'on
désire revenir sur une modification que l'on vient d'effectuer :
Il faut utiliser : menu Edition, Annuler
ou Ctrl+Z
- menu Edition, Annuler = annule, une par
une, les modifications effectuées auparavant,
- menu Edition, Rétablir = restitue, une par une,
les modifications.
On peut ainsi annuler et rétablir toutes les
modifications apportées au document en cours jusqu'au précédent
enregistrement.
Ne pas confondre avec :
- menu Fichier, Rétablir = revient au dernier enregistrement
du document.
C'est un point important. Et c'est peut-être
la plus grande difficulté dans la conception d'un site web :
La majorité des pages doivent avoir la même
présentation :
- le même menu principal (voir les pages de ce site),
- la même disposition,
- le même fond de page, etc.
Seul le contenu de la page diffère.
Deux solutions existent :
1 Utiliser le même document de base pour créer
un nouveau document.
La commande : Fichier, Nouveau pour créer
un nouveau document ne devrait être utilisée que la
première fois, lors de la création du document de
base...
Ensuite, au lieu de créer un nouveau document :
- enregistrer le document de base sous un autre nom,
- le modifier ensuite.
- reprendre à chaque fois le document de base pour créer
un nouveau document.
Ainsi, toutes les pages auront la même présentation.
Cependant, cette solution arrive vite à ses
limites. Car la moindre modification qu'on désire faire sur
la présentation générale du site (insertion
d'un nouveau menu par exemple), entraîne l'obligation de mettre
à jour manuellement toutes les pages.
Il faudra donc, dès que possible, utiliser
les modèles.
Un modèle est un document qui conserve la
mise en page et la présentation générale du
site.
Chaque nouveau document sera créé à partir
du modèle, ce qui assurera la cohérence de l'ensemble
du site
Chaque modification du modèle entraînera la mise à
jour de tous les documents basés sur ce modèle..
Un modèle est constitué de :
- régions verrouillées, qui contiennent les
éléments communs à toutes les pages (menus,
bandeaux, etc.)
- régions modifiables, qui contiennent les éléments
particuliers à chaque page (texte, images, etc.)
Les régions verrouillées pourront être
modifiées en éditant le modèle.
Les régions modifiables seront toujours accessibles dans
chaque document.
Il faudra d'abord créer un modèle et
l'enregistrer. On pourra ensuite le modifier.
Créer un modèle :
On peut créer un modèle de deux
façons :
1 A partir d'un document existant :
- ouvrir le document,
- menu Fichier, Enregistrer comme modèle...,
- sélectionner le dossier du site,
- nommer le document : modele
2 A partir d'un nouveau document :
- menu Fichier, Nouveau,
- menu Fichier, Enregistrer comme modèle...,
- sélectionner le dossier du site,
- nommer le document : modele
2 bis En utilisant le menu Fenêtre :
- menu Fenêtre, Modèles,
- cliquer sur Nouveau,
- nommer le document : modele
|
Dans la fenêtre Site, il y a un nouveau dossier :
Templates
A l'intérieur, se trouve le modèle que l'on vient
de créer (écran)..
Ouvrir un modèle :
Lors de la conception du site, on aura souvent à
modifier le modèle. Et même ensuite, pour le faire
évoluer.
On pourra ouvrir le modèle de deux façons :
- double-cliquer sur le modèle à
l'intérieur du dossier Templates,
ou :
- menu Fenêtre, Modèle,
- double-cliquer sur le modèle. |
Modifier un modèle :
Pour utiliser le modèle, il faut d'abord le
modifier en y intégrant :
- les éléments que l'on souhaite avoir sur toutes
les pages,
- les régions modifiables.
Le modèle ne contient, à sa création,
que des régions verrouillées.
Il s'agira de créer des régions modifiables, afin
de rendre le modèle utilisable.
Pour créer des régions verrouillées :
- procéder comme dans n'importe quel document.
On pourra ajouter du texte, des images, des tableaux, etc.
- menu Fichier, Enregistrer.
Dreamweaver proposera de mettre à jour les pages basées
sur ce modèle.
Pour créer des régions modifiables :
- cliquer avec le bouton droit à l'intérieur
de la page du modèle, d'un tableau...
- sélectionner Régions modifiables, Nouvelle...
ou :
- menu Modifier, Modèles, Nouvelle région modifiable...
- nommer la région modifiable,
- menu Fichier, Enregistrer.
Dreamweaver proposera de mettre à jour les pages basées
sur ce modèle.
|
C'est la méthode la plus simple : celle
que j'ai utilisée pour concevoir ce site :-)
- créer un tableau pour recevoir le menu (région verrouilée)
- créer un tableau pour recevoir le texte et les images (région
modifiable).
C'est une explication "basique", mais qui
permettra de comprendre rapidement le fonctionnement et l'utilité
des modèles.
Voir également la section sur les tableaux
(voir).
1 Préparer le modèle :
Créer un modèle à partir
d'un nouveau document :
(voir plus haut)
Ouvrir le modèle :
(remarquer le nom du modèle dans la barre de titre)
Créer un tableau pour le menu :
- menu Insertion, Tableau,
- 1 ligne, 1 colonne, largeur 100, bordure 0.
(se servir de la touche Tabulation pour passer au champ suivant)
- cliquer sur OK,
- cliquer à l'intérieur du document pour désélectionner
le tableau,
- appuyer sur Entrée.
Le curseur clignote en dessous du tableau.
Créer un deuxième tableau pour le texte :
- menu Insertion, Tableau,
- 1 ligne, 1 colonne, largeur 100, bordure 0.
- cliquer sur OK.
Créer une région modifiable :
- cliquer avec le bouton droit à l'intérieur
du deuxième tableau,
- sélectionner Régions modifiables, Nouvelle...,
- taper texte et cliquer sur OK.
Enregistrer le modèle :
- menu Fichier, Enregistrer,
- fermer la fenêtre du modèle.
|
2 Créer un document à partir du
modèle :
Créer le document :
- menu Fichier, Nouveau à partir d'un modèle...
- sélectionner "modele",
- cliquer sur Sélectionner.
Voilà le premier document créé à
partir du modèle.
On peut dès maintenant :
- donner un Titre à la page (important)
- enregistrer le document.
Donner un Titre à la page :
- menu Modifier, Propriétés de la page...,
- taper Première page
- cliquer sur OK.
Enregistrer le document :
- menu Fichier, Enregistrer,
- s'assurer que l'on est bien à l'intérieur
du dossier site :
- nommer le document page1 par exemple;
- cliquer sur OK.
Voici donc le document tel qu'il apparaît :
On remarque :
- le Titre de la page "Première page" qui
sera affiché dans le navigateur Internet Explorer,
- la région verrouillée en jaune, qu'on pourra
modifier en ouvrant le modèle,
- la région modifiable nommée texte, dans laquelle
on pourra insérer texte, images, tableaux, etc.
|
Après avoir créé le modèle
de base, la conception du site consistera à :
- modifier le modèle au fur et à mesure que le site
évoluera,
- créer de nouvelles pages à partir du modèle,
- modifier les pages existantes.
On intégrera dans les pages :
- des images et des tableaux,
- des liens hypertextes...
Quand les pages seront terminées, modifiées,
il faudra les placer sur le Site distant.
Modifier le modèle :
- ouvrir le modèle en double-cliquant
dessus (écran),
- effectuer les modifications,
- menu Fichier, Enregistrer.
Si d'autres pages sont basées sur ce modèle, Dreamweaver
proposera de les mettre à jour. |
Créer une nouvelle page :
- menu Fichier, Nouveau à partir d'un
modèle....
- menu Modifier, Propriétés de la page...,
- donner un titre à la page. |
On utilisera la fenêtre Site pour accéder
aux documents et les modifier.
Ouvrir le document :
- double-cliquer sur celui-ci dans la partie droite de la fenêtre
Site.
- modifier le document.
Enregistrer le document :
- menu Fichier, Enregistrer. |
On peut également ouvrir un document à
partir du dossier site sur le disque dur :
|
- ouvrir le dossier site (dossier contenant les fichiers
du site),
- cliquer avec le bouton droit sur le fichier à modifier,
- sélectionner "Edit with Dreamweaver".
Si la modification est mineure, et si on a des connaissances
en HTML :
- sélectionner "edit" pour ouvrir le document
avec le Bloc-notes.
|
Vérification du code HTML :
La modification d'un document s'effectuera, de préférence :
- en vérifiant le code HTML pendant la création du
document,
- en nettoyant le code HTML avant l'enregistrement.
Vérifier le code HTML du
document en cours :
- cliquer sur l'icône HTML dans la fenêtre Lanceur.
Nettoyer le code HTML :
- menu Commandes, Nettoyer l'HTML
|
 |
Après chaque modification importante :
Particulièrement en cas de renommage de page,
ou de transfert de texte sur une autre page...
Dans la fenêtre Site :
- menu Site, Recréer le cache du site,
- menu Fichier, Vérifier les liens, Site entier. |
|
Evolution du site :
