utiliser Dreamweaver CS3

GUIDE DE LUTILISATEURADOBE DREAMWEAVER CS3

Copyright2007 Adobe Systems Incorporated. Tous droits rservs.

Adobe Dreamweaver CS3 Guide de l'utilisateur pour Windows et Macintosh

Si le prsent guide est distribu avec un logiciel sous contrat de licence de lutilisateur final, ce guide, de mme que le logiciel dont il traite, est cd sous licence et ne peut tre copi ou utilis que conformment cette licence. Sauf autorisation spcifie dans la licence, aucune partie de cette publication ne peut tre reproduite, enregistre sur un systme de recherche ou transmise sous quelque forme ou par quelque moyen que ce soit (enregistrement lectronique, mcanique ou autre), sans lautorisation crite pralable dAdobe Systems Incorporated. Notez que le contenu de ce manuel est protg par des droits dauteur, mme sil nest pas distribu avec un logiciel accompagn dun contrat de licence pour lutilisateur final.

Les informations contenues dans ce guide sont fournies titre informatif uniquement ; elles sont susceptibles dtre modifies sans pravis et ne doivent pas tre interprtes comme tant un engagement de la part dAdobe Systems Incorporated. Adobe Systems Incorporated naccepte aucune responsabilit quant aux erreurs ou inexactitudes pouvant tre contenues dans le prsent guide.

Nous attirons votre attention sur le fait que les illustrations ou images que vous pouvez tre amen incorporer vos projets peuvent tre protges par des droits dauteur. Linclusion non autorise de tels lments dans vos nouveaux travaux peut constituer une violation des droits du dtenteur du copyright. Veuillez vous assurer que vous obtenez toute autorisation ncessaire auprs du dtenteur du copyright.

Toute rfrence des noms de socits dans les modles types nest utilise qu titre dexemple et ne fait rfrence aucune socit relle.

Adobe, le logo Adobe, ActionScript, ColdFusion, Creative Suite, Director, Dreamweaver, Fireworks, Flash, FlashPaper, HomeSite, JRun, Photoshop, Shockwave et Version Cue sont des marques dposes ou des marques commerciales d'Adobe Systems Incorporated aux Etats-Unis et/ou dans d'autres pays.

ActiveX, Microsoft et Windows sont des marques ou des marques dposes de Microsoft Corporation aux Etats-Unis et/ou dans dautres pays. Apple et Mac OS sont des marques commerciales d'Apple Computer, Inc., dposes aux Etats-Unis et dans d'autres pays. Java et Solaris sont des marques commerciales ou des marques dposes de Sun Microsystems, Inc. aux Etats-Unis et dans d'autres pays. Linux est la marque dpose de Linus Torvalds aux Etats-Unis et dans d'autres pays. UNIX est une marque commerciale aux Etats-Unis et dans d'autres pays, sous licence exclusive de X/Open Company, Ltd. Toutes les autres marques cites sont la proprit de leurs dtenteurs respectifs.

Ce produit inclut des logiciels dvelopps par Apache Software Foundation (http://www.apache.org/). Le format GIF (Graphics Interchange Format) fait l'objet d'un copyright appartenant CompuServe Incorporated. GIF(sm) est une marque de service de CompuServe Incorporated. Technologie de compression audio MPEG Layer-3 utilise sous licence de Fraunhofer IIS et Thomson Multimedia (http://www.mp3licensing.com). Vous n'tes pas autoris utiliser les donnes audio MP3 compresses fournies avec le Logiciel pour les diffusions en temps rel ou en direct. Si vous ncessitez un dcodeur MP3 pour ce type de diffusion, vous devez acqurir une licence pour cette technologie MP3. La technologie de compression et de dcompression audio discours est utilise sous licence de Nellymoser, Inc. (www.nellymoser.com) Flash CS3 video est mis en oeuvre par la technologie vido On2 TrueMotion. 1992-2005 On2 Technologies, Inc. Tous droits rservs. http://www.on2.com. Ce produit inclut des logiciels dvelopps par OpenSymphony Group (http://www.opensymphony.com/). Technologie de compression et dcompression vido Sorenson SparkTM sous licence de Sorenson Media, Inc.

Adobe Systems Incorporated, 345 Park Avenue, San Jose, Californie 95110, Etats-Unis d'Amrique.

Avertissements lattention des utilisateurs finaux du gouvernement des Etats-Unis. Le logiciel et la documentation sont des Commercial Items (articles commerciaux), selon la dfinition de ces termes dans l'article 48 C.F.R. 2.101, composs d'un Commercial Computer Software (logiciel commercial) et d'une Commercial Computer Software Documentation (documentation), selon la dfinition de ces termes dans l'article 48 C.F.R. 12.212 ou 48 C.F.R. 227.7202, selon le cas. Conformment aux documents 48 C.F.R. 12.212 ou 48 C.F.R. 227.7202-1 227.7202-4, le cas chant, le Logiciel informatique commercial et la Documentation du Logiciel informatique commercial ne sont confrs en licence aux utilisateurs finals du Gouvernement des Etats-Unis (a) que sous la forme d'Articles commerciaux et (b) exclusivement avec les droits qui sont accords tout autre utilisateur final conformment aux conditions gnrales ci-incluses. Les droits non publis sont rservs conformment aux lois des Etats-Unis en matire de copyright. Adobe Systems Incorporated, 345 Park Avenue, San Jose, CA 95110-2704, Etats-Unis d'Amrique. Pour les utilisateurs finals du Gouvernement des Etats-Unis, Adobe s'engage respecter toutes les lois en vigueur en matire d'galit, dont, le cas chant, les dispositions du Executive Order 11246, tel qu'amend, Section 402 de la loi Vietnam Era Veterans Readjustment Assistance Act de 1974 (38 USC 4212), et la Section 503 de la loi Rehabilitation Act de 1973, telle qu'amende, ainsi que les dispositions des documents 41 CFR parties 60-1 60-60, 60-250 et 60-741. La clause d'action positive et les rglementations figurant dans la phrase qui prcde seront incorpores par rfrence.

http://www.apache.org/http://www.mp3licensing.comhttp://www.nellymoser.comhttp://www.on2.comhttp://www.opensymphony.com/

iii

Sommaire

Chapitre 1 : Dmarrage

Installation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1

Aide Adobe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1

Ressources . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

Dernires nouveauts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10

Chapitre 2 : Espace de travail

Droulement du travail et espace de travail dans Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12

Utilisation de la fentre de document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

Utilisation des barres d'outils, des inspecteurs, des menus contextuels et des panneaux . . . . 26

Personnalisation de l'espace de travail de Dreamweaver CS3 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32

Chapitre 3 : Utilisation de sites Dreamweaver

Configuration d'un site Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38

Utilisation d'une carte d'arborescence de votre site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49

Gestion des sites Contribute avec Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54

Utilisation de fichiers sans dfinir de site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60

Options de l'onglet Elmentaire . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61

Chapitre 4 : Cration et gestion de fichiers

Cration et ouverture de documents . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 66

Gestion des fichiers et des dossiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74

Acquisition et placement de fichiers depuis ou vers votre serveur . . . . . . . . . . . . . . . . . . . . . . . . . . 84

Archivage et extraction de fichiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 88

Synchronisation de fichiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91

Comparaison de fichiers pour en chercher les diffrences . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93

Restauration de fichiers (utilisateurs de Contribute) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95

Voilage des dossiers et des fichiers du site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96

Stockage des informations sur les fichiers dans des Design Notes . . . . . . . . . . . . . . . . . . . . . . . . . . 98

Test de votre site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .101

Chapitre 5 : Gestion des actifs et des bibliothques

A propos des actifs et des bibliothques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .105

Utilisation des actifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .106

Cration et gestion d'une liste d'actifs favoris . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .110

Utilisation des lments de bibliothque . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .112

Chapitre 6 : Cration de pages avec CSS

Description des feuilles de style en cascade . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .117

Cration et gestion CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .121

Mise en forme des pages avec CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .141

Utilisation des balises Div . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .157

Animation des lments PA . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .161

Chapitre 7 : Mise en forme des pages avec HTML

Utilisation d'assistances visuelles pour la mise en forme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .167

Prsentation de contenu l'aide de tableaux . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .170

iv

Mise en forme des pages avec le mode Mise en forme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .184

Utilisation de cadres . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .195

Chapitre 8 : Ajout de contenu dans les pages

Utilisation des pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .206

Ajout et mise en forme de texte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .218

Ajout et modification d'images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .233

Insertion de contenu Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .245

Ajout de contenu Flash Video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .254

Ajout de squences audio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .258

Ajout d'autres objets multimdias . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .259

Chapitre 9 : Liens et navigation

A propos des liens et de la navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .267

Etablissement de liens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .269

Menus de reroutage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .277

Barres de navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .279

Cartes graphiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .280

Rsolution des problmes lis aux liens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .282

Chapitre 10 : Aperu des pages

Aperu des pages dans les navigateurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .285

Aperu des pages sur les appareils mobiles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .286

Chapitre 11 : Utilisation de code de page

A propos du codage dans Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .288

Configuration d'un environnement de codage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .294

Personnalisation de l'environnement de codage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296

Rdaction et modification de code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .301

Rduction du code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .310

Optimisation et dbogage de code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .312

Modification de code en mode Cration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .316

Utilisation de contenu d'en-tte pour les pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .322

Utilisation des inclusions ct serveur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .326

Gestion des bibliothques de balises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .328

Importation de balises personnalises dans Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .330

Chapitre 12 : Ajout de comportements JavaScript

Utilisation des comportements JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .333

Application de comportements Dreamweaver intgrs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .336

Chapitre 13 : Utilisation d'autres applications

Intgration entre les applications . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .351

Utilisation de Fireworks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .352

Utilisation de Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .358

Utilisation de Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .366

Utilisation de Bridge . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .367

Utilisation de Device Central . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .369

Chapitre 14 : Cration et gestion des modles

A propos des modles Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .371

Reconnaissance des modles et des documents bass sur un modle . . . . . . . . . . . . . . . . . . . . .376

v

Cration d'un modle Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .378

Cration de rgions modifiables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .381

Cration de rgions rptes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .382

Utilisation des rgions facultatives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .384

Dfinition d'attributs de balise modifiables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .387

Cration d'un modle imbriqu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .388

Modification, mise jour et suppression de modles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .390

Exportation et importation du contenu d'un modle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .393

Application ou suppression d'un modle depuis un document existant . . . . . . . . . . . . . . . . . . .394

Modification du contenu d'un document bas sur un modle . . . . . . . . . . . . . . . . . . . . . . . . . . . . .396

Syntaxe des modles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .398

Dfinition de prfrences de programmation pour les modles . . . . . . . . . . . . . . . . . . . . . . . . . . .399

Chapitre 15 : Affichage de donnes XML

A propos de XML et de XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .401

Excution de transformations XSL sur le serveur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .408

Excution de transformations XSL sur le client . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .424

Entits de caractre manquant . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .426

Chapitre 16 : Cration visuelle de pages Spry

A propos du cadre applicatif Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .428

Ajout de widgets Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .428

Utilisation du widget accordon . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .430

Utilisation du widget de barre de menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .432

Utilisation du widget de panneau rductible . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .437

Utilisation du widget de panneau onglet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .439

Utilisation du widget Validation de zone de texte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .442

Utilisation du widget Zone de texte de validation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .446

Utilisation du widget Validation de la slection . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .449

Utilisation du widget Validation de case cocher . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .452

Affichage de donnes l'aide de Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .455

Ajout d'effets Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .462

Chapitre 17 : Prparation la cration de sites dynamiques

Description des applications Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .466

Installation d'un serveur Web local . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .473

Configuration d'une application Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .476

Connexions aux bases de donnes pour les dveloppeurs ColdFusion . . . . . . . . . . . . . . . . . . . .483

Connexions aux bases de donnes pour les dveloppeurs ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . .484

Connexions aux bases de donnes pour les dveloppeurs PHP . . . . . . . . . . . . . . . . . . . . . . . . . . .491

Connexions aux bases de donnes pour les dveloppeurs ASP.NET . . . . . . . . . . . . . . . . . . . . . . . .492

Connexions des bases de donnes pour les dveloppeurs JSP . . . . . . . . . . . . . . . . . . . . . . . . . . .495

Rsolution des problmes de connexion aux bases de donnes . . . . . . . . . . . . . . . . . . . . . . . . . . .499

Suppression de scripts de connexion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .504

Chapitre 18 : Sources de donnes d'applications Web

Utilisation d'une base de donnes pour stocker un contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .505

Collecte de donnes envoyes par les utilisateurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .506

Accs des donnes stockes dans des variables de session . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .509

vi

Chapitre 19 : Ajout de contenu dynamique aux pages Web

Optimisation de l'espace de travail pour le dveloppement visuel . . . . . . . . . . . . . . . . . . . . . . . . .512

Conception de pages dynamiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .515

Prsentation des sources de contenu dynamique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .517

Panneaux de contenu dynamique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .520

Dfinition de sources de contenu dynamique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .521

Ajout de contenu dynamique dans les pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .537

Modification d'un contenu dynamique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .540

Affichage des enregistrements de base de donnes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .543

Affichage des donnes dynamiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .552

Utilisation des services Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .556

Ajout de comportements de serveur personnaliss . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .562

Cration de formulaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .572

Chapitre 20 : Cration visuelle d'applications

Cration de pages principales et dtailles (tous les serveurs) . . . . . . . . . . . . . . . . . . . . . . . . . . . . .586

Cration de pages de recherche et de rsultats (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . .595

Cration d'une page de recherche dans une base de donnes (ASP.NET) . . . . . . . . . . . . . . . . . .600

Cration d'une page d'insertion d'enregistrement (tous les serveurs) . . . . . . . . . . . . . . . . . . . . . .604

Cration de pages de mise jour d'enregistrements (tous les serveurs) . . . . . . . . . . . . . . . . . . . .608

Cration de pages de suppression d'un enregistrement (tous les serveurs) . . . . . . . . . . . . . . . .614

Cration de pages avec objets de manipulation de donnes avancs (ColdFusion, ASP, ASP.NET, JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .621

Cration d'une page d'enregistrement (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . . . .628

Cration d'une page de connexion (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . . .630

Cration d'une page accs restreint (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . . . . . .632

Scurisation dun dossier dans votre application (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . .635

Utilisation des composants ColdFusion (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .636

Utilisation de JavaBeans (JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .642

Chapitre 21 : Cration de formulaires ASP.NET et ColdFusion

Cration de formulaires ColdFusion MX 7 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .644

Cration de formulaires ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .655

Cration de contrles Web Grille de donnes et Liste de donnes ASP.NET . . . . . . . . . . . . . . . .660

Chapitre 22 : Automatisation des tches

Automatisation des tches . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .668

Chapitre 23 : Accessibilit

Dreamweaver et l'accessibilit . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .674

Fonctions d'accessibilit de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .675

Conception de pages dans un souci d'accessibilit . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .677

Chapitre 24 : Raccourcis et extensions

Raccourcis clavier . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .678

Extensions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .680

Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .681

1

Chapitre 1 : Dmarrage

Si vous n'avez pas encore install votre nouveau logiciel, prenez le temps de lire quelques informations relatives l'installation et d'autres notions prliminaires. Avant de commencer utiliser votre logiciel, parcourez la prsentation de l'aide d'Adobe et des nombreuses ressources accessibles aux utilisateurs. Vous pouvez accder des vidos didactiques, des complments, des modles, des communauts d'utilisateurs, des sminaires, des didacticiels, des flux RSS et bien plus encore.

Installation

Configuration requise Pour vrifier la configuration systme complte et recommandations pour votre logiciel Adobe, consultez le fichier Lisez-moi situ sur le DVD d'installation.

Installation du logiciel1 Fermez toute autre application Adobe en cours d'excution sur votre ordinateur.

2 Introduisez le disque d'installation dans le lecteur de DVD-ROM, puis suivez les instructions qui s'affichent l'cran.

Remarque : pour de plus amples informations, consultez le fichier Lisez-moi situ sur le DVD d'installation.

Activation du logicielSi vous possdez une licence pour un utilisateur unique pour votre logiciel Adobe, il vous sera demand d'activer votre logiciel ; ce processus est trs simple et anonyme et vous devez l'avoir excut dans les 30 jours aprs le dbut de l'utilisation du logiciel.

Pour plus d'informations sur l'activation du produit, reportez-vous au fichier Lisez-moi de votre DVD d'installation ou visitez le site Web d'Adobe l'adresse www.adobe.com/go/activation_fr.

1 Si la bote de dialogue d'activation n'est pas ouverte, choisissez Aide > Activation.

2 Suivez les instructions qui s'affichent l'cran.

Remarque : si vous souhaitez installer le logiciel sur un autre ordinateur, vous devez, au pralable, le dsactiver sur votre ordinateur. Slectionnez Aide > Dsactiver.

EnregistrementEnregistrez votre produit afin de bnficier, gratuitement, d'une aide l'installation, de notifications de mises jour, ainsi que d'autres services.

Pour vous enregistrer, suivez les instructions affiches dans la bote de dialogue d'enregistrement qui apparat aprs l'installation et l'activation du logiciel.

Si vous reportez l'enregistrement, vous pourrez effectuer cette procdure ultrieurement en slectionnant Aide > Enregistrement.

Aide Adobe

Ressources d'assistance d'AdobeLa documentation de vos logiciels Adobe est disponible dans plusieurs formats.

http://www.adobe.com/go/activation_fr

DREAMWEAVER CS3Guide de l'utilisateur

2

Aide en ligne et LiveDocs

L'aide en ligne vous donne accs l'ensemble de la documentation et du matriel didactique disponible au moment de la distribution du logiciel. Elle est disponible partir du menu d'aide du logiciel Adobe.

L'aide LiveDocs contient l'intgralit de l'aide en ligne, plus des mises jour et des liens vers du matriel didactique supplmentaire disponible sur le Web. Pour certains produits, vous pouvez galement ajouter des commentaires aux rubriques dans l'aide LiveDocs. L'aide au format LiveDocs est disponible dans le Centre de ressources d'aide d'Adobe l'adresse www.adobe.com/go/documentation_fr.

La plupart des versions de l'aide en ligne et LiveDocs vous permettent d'effectuer une recherche dans les systmes d'aide de plusieurs produits. Certaines rubriques peuvent galement proposer des liens vers du contenu connexe sur le Web ou vers des rubriques d'aide d'un autre produit.

Vous devez considrer le module d'aide comme une plate-forme d'accs vers du contenu supplmentaire et des communauts d'utilisateurs. La version la plus rcente et la plus complte de l'aide est toujours disponible sur le Web.

Documentation au format PDF

L'aide en ligne est galement disponible sous la forme d'un fichier PDF optimis pour l'impression. D'autres documents, tels que des guides d'installation et des livres blancs, peuvent galement tre fournis au format PDF.

Tous les documents au format PDF sont disponibles par le biais du Centre de ressources d'aide d'Adobe l'adresse www.adobe.com/go/documentation_fr. Pour consulter la documentation PDF incluse avec le logiciel, accdez au dossier Documents sur le DVD d'installation ou de contenu.

Documentation papier

La version imprime de l'aide en ligne est disponible la vente sur Adobe Store l'adresse www.adobe.com/go/store_fr. Vous y trouverez galement des ouvrages dits par des partenaires d'Adobe.

Un guide de l'utilisateur imprim est livr avec tous les produits Adobe Creative Suite 3, les produits Adobe autonomes tant quant eux fournis avec un guide de prise en main imprim.

Utilisation du module d'aide du produitL'aide en ligne est accessible par le biais du menu Aide. Aprs avoir ouvert Adobe Help Viewer, cliquez sur Parcourir pour consulter l'aide des autres produits Adobe installs sur votre ordinateur.

http://www.adobe.com/go/documentation_frhttp://www.adobe.com/go/documentation_frhttp://www.adobe.com/go/store_fr


3

La fonction d'aide fournit des informations sur diffrents produits :

certaines rubriques contiennent des liens vers les systmes d'aide d'autres produits Adobe ou vers des informations supplmentaires sur le Web.

D'autres rubriques sont communes plusieurs produits. Par exemple, si vous voyez une rubrique Aide marque de l'icne de Adobe Photoshop et de l'icne Adobe After Effects, vous savez que la rubrique concerne une fonctionnalit semblable dans les deux produits ou dcrit des processus communs aux deux produits.

Vous pouvez effectuer une recherche dans les systmes d'aide de plusieurs produits.

Si vous recherchez une expression, telle que outil forme, placez-la entre guillemets afin de n'afficher que les rubriques contenant tous les mots de l'expression en question.

AideA. Boutons Prcdent/Suivant (liens prcdemment visits) B. Sous-rubriques extensibles C. Icnes indiquant une rubrique partage D. Boutons Prcdent/Suivant (liens prcdemment visits) (rubriques en ordre squentiel)

Fonctions d'accessibilit

L'aide d'Adobe est accessible aux personnes souffrant d'un handicap (mobilit rduite, ccit ou dficience visuelle). L'aide intgre au produit prend en charge les fonctions d'accessibilit standard suivantes :

L'utilisateur peut modifier la taille du texte l'aide de commandes de menu contextuel standard.

Les liens sont souligns pour une identification aise.

Si le texte d'un lien ne correspond pas au titre cible, ce dernier est indiqu dans l'attribut Titre de la balise d'ancrage. Par exemple, les liens Prcdent et Suivant incluent le titre des rubriques prcdente et suivante.

Le contenu prend en charge le mode forts contrastes.

Les images sans lgende prsentent un texte de remplacement.

Chaque cadre est dot d'un titre indiquant son utilit.

Les balises HTML standard dfinissent la structure du contenu pour les outils de lecture d'cran ou de synthse de la parole partir du texte.

Les feuilles de style contrlent la mise en forme, d'o une absence totale de polices incorpores.

Raccourcis clavier pour les commandes de barre d'outils de l'aide (Windows)Bouton Prcdent Alt + Flche Gauche

C

D

B

A


4

Bouton Page suivante Alt + Flche Droite

Imprimer Ctrl+P

Bouton A propos de Ctrl+I

Menu Parcourir Alt+touche Bas ou Alt+touche Haut pour consulter l'aide d'une autre application

Zone de recherche Ctrl+S pour placer le point d'insertion dans la zone Rechercher

Raccourcis clavier de navigation dans l'aide (Windows)

Pour passer d'un panneau un autre, appuyez sur Ctrl+Tab (vers l'avant) ou Maj+Ctrl+Tab (vers l'arrire).

Pour parcourir les liens souligns dans un panneau, appuyez sur Tab (vers l'avant) ou Maj+Tab (vers l'arrire).

Pour activer un lien soulign, appuyez sur Entre.

Pour agrandir le texte, appuyez sur Ctrl+signe gal.

Pour rduire la taille du texte, appuyez sur Ctrl+-.

Slection des documents d'aide approprisLa liste suivante numre la documentation accessible depuis le menu Aide. Utilisez-la pour trouver le systme d'aide qui rpondra vos questions.

L'aide de Dreamweaver (baptise Utilisation de Dreamweaver), destine tous les utilisateurs, fournit des informations dtailles sur toutes les fonctionnalits de Adobe Dreamweaver CS3.

Le guide Extension de Dreamweaver, qui dcrit le cadre Dreamweaver et l'interface de programmation d'applications (API), est destin aux utilisateurs chevronns qui veulent crer des extensions ou personnaliser l'interface de Dreamweaver.

Le Guide des API de Dreamweaver tudie l'API des utilitaires et l'API JavaScript, employes par les utilisateurs chevronns qui veulent crer des extensions ou personnaliser l'interface.

L'aide du cadre applicatif Spry explique la cration d'ensembles de donnes Ajax, de widgets et d'effets au moyen du cadre applicatif Spry. Elle contient des exemples de code et des guides de mise en route. Ces documents ne sont pas spcifiques Dreamweaver. Vous trouverez des rubriques consacres Spry et spcifiques Dreamweaverdans Utilisation de Dreamweaver.

L'aide de ColdFusion consiste en une slection d'ouvrages de la bibliothque de rfrence consacre Macromedia ColdFusion d'Adobe (la bibliothque entire est disponible sur LiveDocs). Ces documents d'aide sont destins aux dveloppeurs, dbutants et chevronns, qui s'intressent ColdFusion.

Rfrence permet d'accder des manuels de rfrence consacrs au langage HTML, au modle de serveur, etc. Ils ont t conus pour quiconque a besoin de plus d'informations sur la syntaxe de codage, les concepts de codage, etc.

Ressources

Atelier vido AdobeL'atelier vido Adobe Creative Suite 3 propose plus de 200 vidos de formation pour Adobe Creative Suite 3. Ces ateliers couvrent un large ventail de sujets l'intention des professionnels de l'impression, du Web et de la vido.


5

Vous pouvez utiliser l'atelier vido Adobe pour en apprendre davantage sur le produit Creative Suite 3. De nombreuses vidos vous expliquent comment utiliser les applications Adobe de manire combine.

Lorsque vous lancez l'atelier vido Adobe, vous choisissez les produits que vous voulez apprendre et les sujets que vous voulez voir. Des informations dtailles sont disponibles pour chaque vido afin de vous aider et diriger votre apprentissage.


6

Communaut de prsentateurs

Avec cette nouvelle version, Adobe Systems invite les membres de la communaut Adobe partager leurs comptences et leurs connaissances. Adobe et Lynda.com mettent votre disposition des didacticiels, trucs et astuces proposs par des concepteurs et dveloppeurs de renom parmi lesquels Joseph Lowery, Katrin Eismann et Chris Georgenes. Des experts Adobe, tels que Lynn Grillo, Greg Rewis et Russell Brown, vous prodigueront galement de prcieux conseils. Au total, pas moins de 30 experts partageront leurs connaissances avec vous !

Didacticiels et fichiers source

L'Atelier vido Adobe propose des formations pour les utilisateurs dbutants et expriments. Vous y trouverez galement des vidos concernant les nouvelles fonctions et les techniques essentielles. Chaque vido porte sur un seul sujet et dure gnralement entre 3 et 5 minutes. La plupart des vidos s'accompagnent d'un didacticiel illustr et de fichiers source. Vous pourrez ainsi imprimer les procdures dtailles et excuter seul le didacticiel.

Utilisation de l'atelier vido Adobe

Pour accder l'Atelier vido Adobe, utilisez le DVD inclus dans votre produit Creative Suite 3. Il est galement disponible en ligne l'adresse www.adobe.com/go/learn_videotutorials_fr. Adobe s'engage ajouter rgulirement de nouvelles vidos son atelier vido en ligne. Nous vous invitons donc vous enregistrer pour dcouvrir toutes les nouveauts.

Vidos Dreamweaver CS3L'atelier vido Adobe couvre un large ventail de sujets concernant Adobe Dreamweaver CS3. En voici un aperu :

Utilisation et personnalisation de mises en page bases sur CSS

Utilisation de widgets Spry

Formatage de formulaires avec CSS

Dpannage de problmes de publication

Cration de boutons anims

Les vidos vous expliquent galement comment utiliser Dreamweaver CS3 avec d'autres logiciels Adobe :

Conception de sites Web avec Dreamweaver et Photoshop

Utilisation de modles Dreamweaver avec Contribute

Importation, copie et collage de donnes entre des applications Web

Pour accder aux dictaticiels vido d'Adobe Creative Suite 3, visitez l'atelier vido Adobe l'adresse www.adobe.com/go/learn_videotutorials_fr.

ExtrasVous avez accs de trs nombreuses ressources afin de vous aider tirer le meilleur parti possible de votre logiciel Adobe. Certaines de ces ressources sont installes sur votre ordinateur pendant la procdure d'installation ; d'autres chantillons et documents trs pratiques se trouvent sur le DVD d'installation ou de contenu. Des supplments particulirement intressants sont galement proposs en ligne par la communaut Adobe Exchange, l'adresse suivante www.adobe.com/go/exchange_fr.

Ressources installes

Lors de l'installation du logiciel, plusieurs ressources sont places dans votre dossier d'application. Pour visualiser ces fichiers, accdez au dossier correspondant sur votre ordinateur.

Windows: [lecteur de lancement]\Program Files\Adobe\Adobe [application]

Mac OS : [disque de dmarrage]/Applications/Adobe [application]

Le dossier de l'application peut contenir les lments suivants :

Plug-ins Les plug-ins (ou modules externes) sont de petits logiciels qui tendent les fonctionnalits de votre logiciel ou en ajoutent de nouvelles. Une fois installs, les modules externes s'affichent comme options dans les menus Importation ou

http://www.adobe.com/go/learn_videotutorials_frhttp://www.adobe.com/go/learn_videotutorials_frhttp://www.adobe.com/go/exchange_fr


7

Exportation, comme formats de fichier dans les botes de dialogue Ouvrir, Enregistrer sous et Exporter l'original ou bien encore comme filtres dans les sous-menus Filtres. Par exemple, plusieurs modules externes avec des effets particuliers sont automatiquement installs dans le dossier Modules externes du dossier Photoshop CS3.

Prconfigurations Les prconfigurations se composent d'un ventail d'outils, de prfrences, d'effets et d'images particulirement pratiques. Les prconfigurations de produit contiennent des pinceaux, nuanciers, groupes de couleurs, symboles, formes personnalises, styles de graphiques et de calques, motifs, textures, actions, espaces de travail, etc. Du contenu prdfini est disponible dans toute l'interface utilisateur. Certaines prconfigurations (c'est le cas des bibliothques de pinceaux Photoshop, par exemple) s'activent uniquement lorsque vous slectionnez l'outil correspondant. Si vous ne souhaitez pas crer un effet ou une image en partant de zro, puisez votre inspiration dans les bibliothques prdfinies.

Modles Vous pouvez ouvrir et visualiser les fichiers de modles partir d'Adobe Bridge, les ouvrir partir de l'cran de bienvenue ou directement partir du menu Fichier. En fonction du produit, les fichiers de modles vont des en-ttes de lettre aux bulletins d'information en passant par les sites Web, menus de DVD et autres boutons vido. Chaque fichier de modle a t labor par un concepteur professionnel et illustre parfaitement les fonctionnalits du produit. Ces modles peuvent se rvler particulirement utiles pour dmarrer un projet.

Echantillons Les fichiers chantillons contiennent des conceptions plus complexes. Ils constituent la solution idale pour prsenter, de manire dynamique, les nouveauts d'un produit. Ces fichiers illustrent toutes les possibilits cratives votre disposition.

Polices Votre solution Creative Suite s'accompagne de plusieurs familles de polices et polices OpenType. Les polices sont copies sur votre ordinateur lors de l'installation :

Windows : [lecteur de lancement]\Windows\Fonts

Mac OS X : [lecteur de lancement]/Bibliothque/Fonts

Pour plus d'informations sur l'installation des polices, consultez le fichier Lisez-moi situ sur le DVD d'installation.

Contenu du DVD

Le DVD d'installation ou de contenu fourni avec votre produit contient des ressources supplmentaires utilisables avec votre logiciel. Le dossier En prime contient des fichiers spcifiques au produit, tels que des modles, images, prconfigurations, actions, plug-ins et effets, ainsi que des sous-dossiers destins aux polices et banques d'images. Le dossier Documentation contient une version PDF de l'aide, des informations techniques et d'autres documents, tels que des feuilles modles, des guides de rfrence et des informations spcialises.

ET VERO E

OS ET ACCU

SAM ET JUS

TO

DUO DOLORE

S ET EA RE

BUM. STET

CLITA KASD

.

ET COSETETU

R SADIPSCI

NG

01 PelletirInc.

CORE INVESTMENT SPECTRUMVel illum dolore eu feugiat nulla facilisis at vero eros et accumsan

et iusto odio dignissim qui.

RETIREMENT SAVING PLANVel illum dolore eu feugiat nulla facilisis at vero eros et accumsan

et iusto odio dignissim qui.

Your Investment GuideAre you leaving money on the table?

01

Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum

claritatem. Investigationes demonstraverunt lectores legere me lius quod ii

legunt saepius. Claritas est etiam processus.

Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum

claritatem. Investigationes demonstraverunt lectores legere me lius quod ii

legunt saepius. Claritas est etiam processus.

Travel EarthBest 100 places to see on the planet in your lifetime

volute ipsummy , commy re eugia-rud tem

eraes- exer

n ullutet

Vel: Ad : Vulputate:

SURVICE MENU

NULCHEvero dio eum

nulcheagiamet ad lorperit

sum a$45agiamet ad atin utet

vero dio eum

nulche sumaagaimet ad eum

nullam$25lorperit sum a

agiamet ad lorperit

vero dioeum nullam$35

SUCCIVEROS

sucicvero diovero dio eum

nulche suma

$15eum nullam

vero dio eum


nullam$35N

eum nullam$35

SUCCIVEROS

sucicvero diovero dio eum

nulche suma$15

eum nullamvero dio eum


nullam$35

CCasiopiaSpA


8

Adobe Exchange

Vous en voulez plus ? Dans ce cas, rendez-vous sur www.adobe.com/go/exchange_fr, une communaut en ligne o les utilisateurs tlchargent et changent, titre gracieux, des milliers d'actions, extensions, plug-ins et autres lments utilisables avec les produits Adobe.

Accueil BridgeL'Accueil Bridge, une nouvelle destination dans Adobe Bridge CS3, runit en un seul emplacement fonctionnel des informations rcentes sur tous vos logiciels Adobe Creative Suite 3. Dmarrez Adobe Bridge, puis cliquez sur l'icne Accueil Bridge dans la partie suprieure du panneau Favoris pour accder aux dernires astuces, actualits et ressources concernant vos outils Creative Suite.

Remarque : l'Accueil Bridge n'est peut-tre pas disponible dans toutes les langues.

Adobe Design CenterAdobe Design Center met votre disposition des articles, modles et instructions proposs par des experts de l'industrie, des concepteurs de renom et des partenaires d'dition d'Adobe. Du nouveau contenu est ajout tous les mois.

http://www.adobe.com/go/exchange_fr


9

Outre des centaines de didacticiels axs sur les logiciels de conception, vous y trouverez des conseils et techniques sous la forme de vidos, de didacticiels HTML et d'extraits de chapitres de livre.

Les ides nouvelles sont au cur mme de Think Tank, Dialog Box et Gallery :

Les articles Think Tank analysent la faon dont les concepteurs contemporains embrassent la technologie et ce que leurs expriences signifient pour la cration, les outils de cration et la socit en gnral.

Dans Dialog Box, des experts partagent leurs ides nouvelles en termes d'animations et de cration numrique.

Dans Gallery, vous dcouvrirez ce que les artistes entendent par conception en mouvement.

Rendez-vous sur Adobe Design Center l'adresse www.adobe.com/fr/designcenter.

Centre des dveloppeurs AdobeLe Centre des dveloppeurs Adobe propose des chantillons, des didacticiels, des articles et diverses ressources l'usage des dveloppeurs qui utilisent des produits Adobe pour laborer, entre autres projets, du contenu mobile, des applications Internet et des sites Web sophistiqus. Ce centre contient galement des ressources l'intention des dveloppeurs de plug-ins pour produits Adobe.

Outre des chantillons de code et des didacticiels, vous y trouverez des flux RSS, des sminaires en ligne, des kits SDK, des guides de cration de scripts, ainsi que bien d'autres ressources techniques.

Rendez-vous sur le Centre des dveloppeurs Adobe l'adresse www.adobe.com/go/developer_fr.

Support techniqueConsultez le site Web d'assistance technique d'Adobe (www.adobe.com/fr/support) pour obtenir des informations de dpannage pour votre produit et en savoir plus sur les options d'assistance technique gratuites et payantes. Suivez le lien Formation pour accder des manuels Adobe Press, un ventail de ressources de formation, des programmes de certification de logiciels d'Adobe, etc.

TlchargementsRendez-vous l'adresse www.adobe.com/go/downloads_fr pour obtenir gratuitement des mises jour, des versions d'essai et d'autres logiciels utiles. Adobe Store (www.adobe.com/go/store_fr) vous donne galement accs des milliers de plug-ins de dveloppeurs tiers, ce qui vous aide automatiser des tches, personnaliser des flux de production, crer des effets spciaux de qualit professionnelle et bien d'autres choses encore.

http://www.adobe.com/fr/designcenterhttp://www.adobe.com/go/developer_frhttp://www.adobe.com/fr/supporthttp://www.adobe.com/go/downloads_frhttp://www.adobe.com/go/store_fr


10

Adobe LabsAdobe Labs vous permet d'utiliser et d'valuer des technologies nouvelles et mergentes, ainsi que des produits Adobe.

Adobe Labs vous donne accs un ventail de ressources :

Prversions de logiciels et technologies venir

Echantillons de code et mthodes conseilles pour acclrer votre apprentissage

Prversions de la documentation technique et produit

Forums, contenu Wikipdia et autres ressources de collaboration pour vous aider interagir avec des dveloppeurs qui partagent vos opinions

Adobe Labs favorise la mise en place d'un processus de dveloppement de logiciels ax sur la collaboration. Dans cet environnement, les clients utilisant de nouveaux produits et technologies deviennent rapidement productifs. Adobe Labs est galement un forum de commentaires, que l'quipe de dveloppement Adobe utilise pour crer des logiciels correspondant aux besoins et aux attentes de la communaut.

Visitez Adobe Labs l'adresse www.adobe.com/go/labs_fr.

Communauts d'utilisateursLes communauts d'utilisateurs comprennent des forums, des blogs et d'autres moyens leur permettant de partager des technologies, des outils et des informations. Les utilisateurs peuvent poser des questions afin de savoir comment les autres utilisateurs exploitent au mieux leur logiciel. Les forums utilisateur sont disponibles en anglais, franais, allemand et japonais ; les blogs sont rdigs dans un large ventail de langues.

Pour participer des forums ou des blogs, rendez-vous l'adresse www.adobe.com/fr/communities.

Dernires nouveauts

Principales nouvelles fonctionnalits d'Adobe Dreamweaver CS3

Cadre applicatif Spry pour Ajax

Adobe Dreamweaver CS3 permet de concevoir, dvelopper et dployer, le tout de manire visuelle, des interfaces utilisateur dynamiques l'aide du cadre applicatif Spry pour Ajax. Le cadre applicatif Spry pour Ajax est une bibliothque JavaScript qui permet aux concepteurs Web de crer des pages offrant une exprience enrichie leurs utilisateurs. Contrairement d'autres cadres Ajax, Spry est accessible aux concepteurs et aux dveloppeurs, car il consiste 99% en langage HTML. Voir Cration visuelle de pages Spry la page 428.

Widgets Spry

Les widgets Spry sont des composants d'interface utilisateur communs, prdfinis, que vous pouvez personnaliser l'aide de CSS afin de les ajouter vos pages Web. Dreamweaver permet d'ajouter divers widgets Spry vos pages, dont des listes et des tableaux anims par XML, des accordons, des interfaces onglets et des lments de formulaire validation. Voir Ajout de widgets Spry la page 428.

Effets Spry

Les effets Spry sont une manire simple et lgante d'amliorer l'apparence de votre site Web. Vous pouvez les appliquer pratiquement n'importe quel lment d'une page HTML. Vous pouvez ajouter des effets Spry pour agrandir, rduire, attnuer et mettre en vidence des lments, modifier visuellement un lment de page pendant une priode prcise, et bien plus encore. Voir Ajout d'effets Spry la page 462.

http://www.adobe.com/go/labs_frhttp://www.adobe.com/fr/communities


11

Intgration avance de Photoshop CS3

Dreamweaver comprend une intgration amliore avec Photoshop CS3. Dsormais, un concepteur peut slectionner une partie d'un concept dans Photoshop, y compris sur plusieurs calques, et la coller directement dans une page Dreamweaver. Dreamweaver affiche une bote de dialogue o vous pouvez dfinir les options d'optimisation de l'image. Si vous voulez modifier l'image, il suffit de double-cliquer dessus pour ouvrir le fichier PSD d'origine, avec ses calques, dans Photoshop. Voir Utilisation de Photoshop la page 358.

Vrification de la compatibilit avec les navigateurs

La nouvelle fonction Vrification de la compatibilit avec les navigateurs de Dreamweaver gnre des rapports qui identifient les problmes de restitution lis CSS dans divers navigateurs. En mode Code, les problmes sont souligns en vert, ce qui vous permet de les reprer aisment. Quand vous avez identifi le problme, vous pouvez le corriger rapidement si vous connaissez la solution. Si vous avez besoin d'un complment d'information, vous pouvez visiter le site Adobe CSS Advisor. Voir Vrification de problmes de restitution CSS entre les navigateurs la page 137.

Adobe CSS Advisor

Le site Web Adobe CSS Advisor fournit des informations sur les problmes CSS les plus rcents. Il est accessible directement partir de l'interface utilisateur de Dreamweaver au cours du processus Vrification de la compatibilit avec les navigateurs. Plus qu'un simple forum, une page wiki ou un groupe de discussion, le site CSS Advisor permet d'entrer des commentaires qui fournissent des suggestions et des amliorations de contenu existant, ou d'ajouter de nouveaux problmes, qui profiteront la communaut entire. Voir Vrification de problmes de restitution CSS entre les navigateurs la page 137.

Mises en forme CSS

Dreamweaver fournit un ensemble de mises en forme CSS prdfinies qui vous permettront d'obtenir rapidement une page fonctionnelle et vous apprendront utiliser la mise en page CSS, grce la prsence de commentaires dtaills inclus dans le code. La plupart des concepts de sites sur le Web peuvent tre classifis en mises en forme une, deux ou trois colonnes, accompagne chacune de divers lments complmentaires (comme en-ttes et pieds de page). Dreamweaver fournit dsormais une liste complte de concepts de mise en forme essentiels, que vous pouvez personnaliser selon vos besoins. Voir Cration d'une page avec une mise en page CSS la page 145.

Gestion des styles CSS

La fonctionnalit de gestion des styles CSS facilite le dplacement de rgles CSS d'un document vers un autre, de la section head d'un document vers une feuille de style externe, entre des fichiers CSS externes, etc. Vous pouvez galement convertir du code CSS intgr en rgles CSS, et les placer o vous le souhaitez, par glisser/dposer. Voir Dplacement des rgles CSS la page 134 et Conversion d'un style CSS intgr en une rgle CSS la page 135.

Adobe Device Central

Intgr Dreamweaver ainsi qu'aux autres logiciels de la famille Creative Suite 3, Adobe Device Central simplifie la cration de contenu mobile en vous permettant d'accder rapidement aux caractristiques techniques essentielles de chaque appareil, et de rduire le texte et les images de votre page HTML afin d'en obtenir une restitution identique l'apparence qu'elle aurait sur l'appareil concern. Voir Aperu des pages sur les appareils mobiles la page 286.

Adobe Bridge CS3

La combinaison de Dreamweaver et d'Adobe Bridge CS3 permet une gestion aise et cohrente des images et des actifs. Adobe Bridge offre un accs centralis vos fichiers de projet, vos applications et vos paramtres, sans oublier des fonctionnalits de marquage et de recherche de mtadonnes XMP. Avec ses fonctions d'organisation et de partage de fichiers, ainsi qu'un accs Adobe Stock Photos, Adobe Bridge garantit un flux cratif plus efficace. Vous matrisez ainsi les moindres aspects de vos projets d'impression, Web, vido et mobiles. Voir Utilisation de Bridge la page 367.

12

Chapitre 2 : Espace de travail

L'espace de travail de Adobe Dreamweaver CS3 contient les barres d'outils, les inspecteurs et les panneaux qui servent la cration de pages Web. Vous pouvez personnaliser l'apparence gnrale et le comportement de l'espace de travail.

Droulement du travail et espace de travail dans Dreamweaver

Prsentation des processus de DreamweaverVous pouvez utiliser plusieurs approches pour crer un site Web ; voici l'une des approches possibles :

Planification et configuration de votre site

Dterminez l'emplacement o vos fichiers seront enregistrs et examinez les besoins du site, les profils de ses utilisateurs et les objectifs du site. Il convient galement d'examiner les conditions techniques requises, notamment l'accs utilisateur et les restrictions en matire de navigateurs, de plug-ins ou de tlchargement. Aprs avoir organis vos informations et dfini une structure, vous pouvez commencer la cration du site. (Voir Utilisation de sites Dreamweaver la page 38.)

Organisation et gestion des fichiers de votre site

Dans le panneau Fichiers, vous pouvez facilement ajouter, supprimer et renommer des fichiers et des dossiers afin de modifier l'organisation en fonction de vos besoins Dans le panneau Fichiers, vous trouverez de nombreux outils permettant la gestion de votre site, le transfert de vos fichiers vers et depuis un serveur distant, la configuration d'un processus d'archivage/extraction pour empcher l'crasement des fichiers et la synchronisation des fichiers sur vos sites locaux et distants. Utilisez le panneau Actifs pour organiser facilement les actifs sur un site ; vous pouvez ensuite faire glisser la plupart des actifs directement du panneau vers un document Dreamweaver. Dreamweaver vous permet galement de grer certains aspects de vos sites Adobe Contribute. (Voir Gestion des fichiers et des dossiers la page 74 et Gestion des actifs et des bibliothques la page 105.)

Mise en forme de vos pages Web

Slectionnez la technique de mise en forme de votre choix ou combinez les options de mise en forme de Dreamweaver pour dfinir la prsentation de votre site. Vous pouvez utiliser des lments PA, des styles de positionnement CSS ou des mises en forme CSS prdfinies de Dreamweaver pour dfinir la mise en forme. Les outils de cration de tableaux vous permettent de concevoir des pages rapidement en dessinant, puis en rorganisant la structure des pages Si vous souhaitez afficher plusieurs lments simultanment dans un navigateur Web, vous pouvez utiliser des cadres pour mettre en forme vos documents. Finalement, vous pouvez crer de nouvelles pages partir d'un modle Dreamweaver, puis actualiser automatiquement leur mise en forme lorsque le modle change (Voir Cration de pages avec CSS la page 117 et Mise en forme des pages avec HTML la page 167.)

Ajout de contenu dans les pages

Ajoutez des actifs et des lments de conception, par exemple du texte, des images, des images avec effet de survol, des cartes graphiques, des couleurs, des animations, des sons, des liens HTML, des menus de reroutage, etc. Vous pouvez utiliser les fonctions intgres de cration de page pour les lments tels que les titres et les arrire-plans, taper directement dans la page ou importer du contenu d'autres documents. Dreamweaver fournit galement des comportements permettant d'excuter des tches en rponse des vnements spcifiques, comme par exemple la validation d'un formulaire lorsque le visiteur clique le sur bouton Envoyer ou l'ouverture d'une deuxime fentre de navigateur lorsque le chargement de la page principale est termin. Finalement, Dreamweaver comprend des outils permettant d'optimiser les performances de votre site Web et de tester les pages pour garantir leur compatibilit avec diffrents navigateurs Web (Voir Ajout de contenu dans les pages la page 206).


13

Cration de pages par codage manuel

Le codage manuel des pages Web constitue une autre approche de la cration de pages. Dreamweaver dispose d'outils d'dition visuelle conviviaux ainsi que d'un environnement de codage sophistiqu. Vous pouvez utiliser l'une ou l'autre de ces mthodes (ou bien les deux) pour crer et modifier vos pages. (Voir Utilisation de code de page la page 288.)

Configuration d'une application Web pour un contenu dynamique

De nombreux sites Web contiennent des pages dynamiques qui permettent aux visiteurs d'afficher les informations stockes dans des bases de donnes, voire d'ajouter ou de modifier des donnes dans certains cas. Pour crer ce type de pages, vous devez d'abord configurer un serveur Web et un serveur d'application, crer ou modifier un site Dreamweaver et vous connecter une base de donnes. (Voir Prparation la cration de sites dynamiques la page 466.)

Cration de pages dynamiques

Dans Dreamweaver, vous pouvez dfinir diverses sources de contenu dynamique, y compris des jeux d'enregistrements extraits de bases de donnes, des paramtres de formulaire et des composants JavaBeans. Pour ajouter le contenu dynamique une page, il suffit de le faire glisser vers cette dernire.

Vous pouvez dfinir une configuration de page qui affiche un ou plusieurs enregistrements la fois (ou plusieurs pages d'enregistrements), ajoute des liens spciaux permettant de passer d'une page d'enregistrements une autre et cre des compteurs d'enregistrements pour faciliter la gestion de ces derniers. Vous pouvez encapsuler la logique d'application ou d'entreprise en faisant appel des technologies telles que Macromedia ColdFusion d'Adobe et les services Web. Si vous avez besoin de plus de souplesse, vous pouvez crer des comportements de serveur et formulaires interactifs personnaliss. (Voir Ajout de contenu dynamique aux pages Web la page 512.)

Test et publication

Le test de vos pages est un processus continu qui se droule tout au long du cycle de dveloppement. A la fin de ce cycle, vous publiez le site sur un serveur. De nombreux dveloppeurs programment galement une maintenance rgulire pour s'assurer que le site reste jour et est oprationnel. (Voir Acquisition et placement de fichiers depuis ou vers votre serveur la page 84.)

Espace de travail L'espace de travail de Dreamweaver permet d'afficher des documents et les proprits des objets. Il comporte des barres d'outils donnant accs aux oprations les plus courantes, vous permettant ainsi de modifier rapidement vos documents.

Sous Windows, Dreamweaver propose une prsentation intgre en une seule fentre. Dans l'espace de travail intgr, toutes les fentres et tous les panneaux sont rassembls dans une grande fentre d'application.


14

A. Barre Insertion B. Barre d'outils du document C. Fentre de document D. Groupes de panneaux E. Slecteur de balises F. Inspecteur Proprits G. Panneau Fichiers

Sous Mac OS, Dreamweaver peut afficher de multiples documents dans une seule fentre avec des onglets qui identifient chacun des documents. Dreamweaver permet galement d'afficher un espace de travail flottant o chaque document dispose de sa propre fentre. Les groupes de panneaux sont initialement ancrs ensemble, mais vous pouvez les sparer pour les faire apparatre dans leur propre fentre. Les fentres s'alignent automatiquement les unes sur les autres sur les cts de l'cran, et sur la fentre du document au fur et mesure que vous les faites glisser ou que vous les redimensionnez.

A. Barre Insertion B. Barre d'outils du document C. Fentre de document D. Groupes de panneaux E. Slecteur de balises F. Inspecteur Proprits G. Panneau Fichiers

Vous trouverez un didacticiel consacr la configuration de l'espace de travail de Dreamweaver l'adresse www.adobe.com/go/vid0143_fr.

A B C D

E F G

A B C D

E F G

http://www.adobe.com/go/vid0143_fr


15

Voir aussi

Utilisation des barres d'outils, des inspecteurs, des menus contextuels et des panneaux la page 26

Choix de la prsentation de l'espace de travail (sous Windows) la page 32

Choix de la prsentation de l'espace de travail (Macintosh) la page 32

Affichage de documents onglets (Macintosh) la page 32

Espace de travail L'espace de travail contient les lments suivants:

Remarque : Dreamweaver propose de nombreux autres inspecteurs, panneaux et fentres. Pour ouvrir les panneaux, inspecteurs et fentres, utilisez le menu Fentre. Si vous n'arrivez pas localiser un panneau, un inspecteur ou une fentre indiqus comme ouverts, choisissez Fentre > Rorganiser Panneaux pour prsenter tous les panneaux ouverts l'cran.

Ecran d'accueil Permet d'ouvrir un document rcent ou de crer un nouveau document. Vous pouvez galement, partir de l'cran d'accueil, survoler Dreamweaver ou accder un didacticiel.

Barre Insertion Contient des boutons permettant d'insrer divers types d'objets, tels que des images, tableaux et lments PA dans un document. Chaque objet est une portion de code HTML vous permettant de dfinir diffrents attributs lors de son insertion. Vous pouvez, par exemple, insrer un tableau en cliquant sur le bouton Tableau de la barre Insertion. Si vous le prfrez, vous pouvez insrer les objets partir du menu Insertion.

Barre d'outils du document Contient des boutons permettant d'accder aux diffrents modes d'affichage de la fentre du document (tels que le mode Cration ou le mode Code), de dfinir les diffrentes options d'affichage et d'effectuer certaines oprations courantes, telles que la prvisualisation dans un navigateur.

Barre d'outils standard Non affiche dans l'agencement par dfaut de l'espace de travail. Contient des boutons correspondant aux oprations courantes des menus Fichier et Edition : Nouveau, Ouvrir, Enregistrer, Enregistrer tout, Couper, Copier, Coller, Annuler et Rpter. Pour afficher la barre d'outils standard, choisissez Affichage > Barres d'outils > Standard.

La barre d'outils de codage Affiche en mode Code uniquement. Regroupe des boutons couvrant la plupart des oprations de codage standard.

La barre d'outils de rendu de style Masque par dfaut. Compose de boutons qui vous permettent d'avoir un aperu de votre cration dans diffrents types de mdia si vous utilisez des feuilles de style dpendantes du mdia. Elle contient galement un bouton qui permet d'activer ou de dsactiver les styles CSS (Cascading Style Sheets).

Fentre de document Affiche le document que vous crez et modifiez.

L'inspecteur Proprits Permet de visualiser et de modifier diverses proprits de l'objet ou du texte slectionn. Chaque objet contient des proprits diffrentes. L'inspecteur Proprits n'est pas dvelopp par dfaut dans la prsentation de l'espace de travail Codeur.

Le slecteur de balises Situe dans la barre d'tat, dans le bas de la fentre de document. Affiche la hirarchie des balises entourant la slection active. Cliquez sur une balise quelconque dans la hirarchie pour la slectionner avec son contenu.

Groupes de panneaux Ensembles de panneaux associs regroups sous un mme titre. Pour dvelopper un groupe de panneaux, cliquez sur la flche d'agrandissement situe gauche du nom du groupe ; pour dtacher un groupe de panneaux, faites glisser la poigne d'ancrage sur le ct gauche de la barre de titre du groupe.

Le panneau Fichiers Permet de grer vos fichiers et dossiers, qu'ils fassent partie d'un site Dreamweaver ou qu'ils se trouvent sur un serveur distant. Il permet galement d'accder tous les fichiers situs sur votre disque local, tout comme l'Explorateur Windows (Windows) ou le Finder (Macintosh).


16

Voir aussi

Utilisation de la fentre de document la page 23

Utilisation des barres d'outils, des inspecteurs, des menus contextuels et des panneaux la page 26

A propos des groupes de panneaux la page 29

Prsentation de la fentre de documentLa fentre de document affiche le document actif. Vous pouvez choisir parmi les modes d'affichage suivants :

Mode Cration Un environnement de cration pour la mise en forme visuelle des pages, l'dition visuelle et le dveloppement rapide d'applications. Dans ce mode, Dreamweaver affiche une reprsentation visuelle entirement modifiable du document, similaire la reprsentation de la page sur un navigateur. Vous pouvez configurer le mode Cration pour qu'il affiche le contenu dynamique pendant que vous travaillez sur le document.

Mode Code Environnement de codage manuel pour rdiger et modifier du code HTML, JavaScript et de langage de serveur, tel que le langage PHP ou CFML (ColdFusion Markup Language), ou tout autre type de code.

Modes Code et Cration Permettent d'obtenir l'affichage Code et l'affichage Cration du document dans une mme fentre.

Lorsque la fentre de document dispose d'une barre de titre, cette dernire affiche le titre de la page, et, entre parenthses, le chemin et le nom de fichier du document. Dreamweaver affiche un astrisque la suite du nom de fichier si vous avez apport des modifications et que vous ne les avez pas encore enregistres.

Lorsque vous agrandissez la fentre de document de la prsentation de l'espace de travail intgr (sous Windows uniquement), elle s'affiche sans barre de titre; le titre de la page, ainsi que le chemin et le nom du fichier s'affichent alors dans la barre de titre de la fentre principale de l'espace de travail.

Lorsqu'une fentre de document est agrandie, des onglets s'affichent en haut de la fentre de document indiquant les noms de fichier de tous les documents ouverts. Pour passer un autre document, cliquez sur son onglet.

Voir aussi

Utilisation de la fentre de document la page 23

A propos du codage dans Dreamweaver la page 288

Affichage de donnes dynamiques en mode Cration la page 552

Prsentation de la barre d'outils de documentLa barre d'outils de document est compose de boutons qui permettent d'accder rapidement aux diffrents modes d'affichage : Code, Cration et un mode d'affichage partag pour afficher les modes Code et Cration en mme temps.

La barre d'outils contient galement plusieurs commandes et options courantes permettant d'afficher le document et de le transfrer d'un site local vers un site distant.

A. Afficher le mode Code B. Afficher les modes Code et Cration C. Afficher le mode Cration D. Titre du document E. Gestion des fichiers F. Aperu/Dbogage dans le navigateur G. Actualiser mode Cration H. Afficher les options I. Assistances visuelles J. Valider le marqueur K. Vrification de la compatibilit avec les navigateurs

Les options suivantes s'affichent dans la barre d'outils de document :

Afficher le mode Code Affiche uniquement le mode Code dans la fentre de document.

Afficher les modes Code et Cration Fractionne la fentre de document afin d'afficher le mode Code et le mode Cration. Dans ce cas, l'option Mode Cration en haut est active dans le menu Options d'affichage.

Afficher le mode Cration Affiche uniquement le mode Cration dans la fentre de document.

A B C D E F G H I J K


17

Remarque : Si vous utilisez certaines types de fichiers, tels que XML, JavaScript, CSS ou d'autres types en mode code, les fichiers ne sont pas visibles en mode Cration, et les boutons Cration et Scinder sont griss.

Titre du document Permet d'attribuer un titre votre document et l'afficher dans la barre de titre du navigateur. Si votre document possde dj un titre, celui-ci s'affiche dans ce champ.

Gestion des fichiers Affiche le menu contextuel Gestion des fichiers.

Aperu/Dbogage dans le navigateur Permet de prvisualiser ou de dboguer votre document dans un navigateur. Slectionnez un navigateur dans le menu contextuel.

Actualiser mode Cration Actualise le mode Cration du document aprs avoir apport des modifications dans le mode Code. Les modifications apportes dans le mode Code n'apparaissent pas automatiquement dans le mode Cration. Vous devez excuter tout d'abord certaines oprations, comme enregistrer le fichier ou utiliser ce bouton.

Remarque : L'actualisation met galement jour les fonctionnalits de code qui dpendent de DOM (Document Object Model), comme la possibilit de slectionner les balises d'ouverture ou de fermeture d'un bloc de code.

Afficher les options Permet de dfinir les options d'affichage des modes Code et Cration, notamment le mode devant s'afficher au-dessus de l'autre. Les options du menu s'appliquent l'affichage actuel : Mode Cration, mode Code ou les deux.

Assistances visuelles Permet d'utiliser diffrents supports visuels en vue de la conception de vos pages.

Valider le marqueur Permet de valider le document actif ou la balise slectionne.

Vrification de la compatibilit avec les navigateurs Permet de vrifier si votre code CSS est compatible avec diffrents navigateurs.

Voir aussi

Affichage des barres d'outils la page 26

Personnalisation de l'environnement de codage la page 296

Affichage et modification de contenu d'en-tte la page 322

Utilisation d'assistances visuelles pour la mise en forme la page 167

Prsentation de la barre d'outils standardLa barre d'outils standard contient des boutons correspondant aux oprations courantes des menus Fichier et Edition : Nouveau, Ouvrir, Enregistrer, Enregistrer tout, Couper, Copier, Coller, Annuler et Rpter. Utilisez ces boutons comme vous utiliseriez les commandes de menu quivalentes.

Voir aussi


Cration et ouverture de documents la page 66

Prsentation de la barre d'tatLa barre d'tat, situe au bas de la fentre de document, fournit des informations supplmentaires sur le document en cours de cration.


18

A. Slecteur de balises B. Outil Slectionner C. Outil Main D. Outil Zoom E. Dfinir le facteur de zoom F. Menu contextuel Taille de fentre G. Taille du document et estimation du temps de tlchargement

Slecteur de balises Affiche la hirarchie des balises entourant la slection active. Cliquez sur une balise quelconque dans la hirarchie pour la slectionner avec son contenu. Cliquez sur pour slectionner tout le corps du document. Pour dfinir les attributs class ou id d'une balise dans le slecteur de balises, cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Option enfonce (Macintosh) sur la balise et choisissez une classe ou un ID dans le menu contextuel.

Outil Slectionner Active et dsactive l'outil Main.

Outil Main Permet de cliquer sur le document et de le glisser jusque dans la fentre de document.

Outil Zoom et le menu contextuel Dfinir le facteur de zoom Permettent de dfinir un taux d'agrandissement pour votre document.

Menu contextuel Taille de fentre Visible en mode Cration uniquement. Permet de redimensionner la fentre du document selon des dimensions prdfinies ou personnalises.

Taille du document et temps de tlchargement Fournit une estimation de la taille du document et du temps de tlchargement de la page, ainsi que la liste de tous les fichiers dpendants, tels que les images et autres fichiers de donnes.

Voir aussi

Dfinition de la taille des fentres et de la vitesse de connexion la page 25

Zoom avant et arrire la page 215

Redimensionnement de la fentre de document la page 24

Dfinition des prfrences de dure et de taille des tlchargements la page 216

Prsentation de la barre InsertionLes boutons qui composent la barre Insertion permettent de crer et d'insrer des objets, tels que des tableaux, des lments PA et des images. Lorsque vous placez le curseur de la souris sur un bouton, une info-bulle indiquant le nom de ce bouton apparat.

Les boutons sont organiss en plusieurs catgories, que vous pouvez afficher en cliquant sur les onglets dans la partie suprieure de la barre Insertion. D'autres catgories s'affichent lorsque le document slectionn contient du code serveur, tel que des documents ASP ou CFML. Au dmarrage de Dreamweaver, la dernire catgorie utilise s'ouvre.

Certaines catgories disposent de boutons ouvrant des menus contextuels. Lorsque vous slectionnez une option dans l'un d'eux, l'action associe est attribue par dfaut au bouton. Par exemple, si vous slectionnez le menu contextuel du bouton Image, puis Espace rserv pour l'image, la prochaine fois que vous cliquerez sur le bouton Image, Dreamweaver insrera un espace rserv pour l'image. Lorsque vous slectionnez une nouvelle option dans l'un de ces menus, l'action attribue par dfaut au bouton change.

La barre Insertion est organise en diffrentes catgories, comme suit :

Catgorie Commun Permet de crer et d'insrer les objets les plus couramment utiliss, comme les images et les tableaux.

Catgorie Mise en forme Permet d'insrer des tableaux, des balises div, des cadres et des widgets Spry. Vous pouvez choisir deux modes pour les tableaux : Standard (par dfaut) et Dvelopp.

A B C D E F G


19

Catgorie Formulaires Contient des boutons permettant de crer des formulaires et d'insrer des lments de formulaire, dont des widgets de validation Spry.

Catgorie Donnes Permet d'insrer des lments de donnes Spry et d'autres lments dynamiques, tels que des jeux d'enregistrements, des rgions rptes et des formulaires d'insertion et de mise jour d'enregistrements.

Catgorie Spry Contient des boutons permettant de crer des pages Spry, avec des objets de donnes Spry et des widgets.

Catgorie Texte Permet d'insrer diverses balises de mise en forme de texte et de liste, telles que b, em, p, h1 et ul.

Catgorie Favoris Permet de regrouper et d'organiser, dans un espace commun, les boutons de la barre Insertion que vous utilisez le plus frquemment.

Catgories de code serveur Disponibles uniquement pour les pages utilisant un langage serveur spcifique, comme ASP, ASP.NET, CFML Basic, CFML Flow, CFML Advanced, JSP et PHP. Ces catgories proposent des objets de type code serveur que vous pouvez insrer en mode Code.

Voir aussi

Utilisation de la barre Insertion la page 26

Cration visuelle de pages Spry la page 428

Prsentation de la barre d'outils de codageLa barre d'outils de codage est compose de boutons qui vous permettent d'effectuer de nombreuses oprations de codage standard (rduction et agrandissement des slections de code, mise en vidence de code non valide, application et suppression de commentaires, mise en retrait de code, insertion de fragments de code rcemment utiliss, etc.) La barre d'outils Codage est visible uniquement en mode Code et apparat verticalement sur le ct gauche de la fentre de Document.

Vous ne pouvez pas dtacher ni dplacer la barre d'outils de codage mais vous pouvez la masquer.

Vous pouvez galement modifier la barre d'outils de codage pour afficher des boutons supplmentaires (Retour automatique la ligne, Caractres cachs et Retrait auto) ou pour masquer des boutons que vous ne souhaitez pas utiliser. Nanmoins, vous devez pour cela modifier le fichier XML qui gnre la barre d'outils. Pour plus d'informations, voir Extension de Dreamweaver.


20

Voir aussi


Insertion de code avec la barre d'outils de codage la page 303

Prsentation de la barre d'outils Rendu de styleLa barre d'outils de rendu de style (masque par dfaut) est compose de boutons qui vous permettent d'avoir un aperu de votre cration dans diffrents types de mdia si vous utilisez des feuilles de style dpendantes du mdia. Elle contient galement un bouton qui permet d'activer ou de dsactiver les styles CSS. Pour afficher la barre d'outils standard, choisissez Affichage > Barres d'outils > Rendu de style.

Cette barre d'outil n'est fonctionnelle que si vos documents appliquent des feuilles de styles dpendantes du mdia. Par exemple, votre feuille de style peut comporter une rgle relative au corps du texte pour l'impression et une autre pour l'affichage sur des tlphones portables. Pour plus d'informations sur la cration de feuilles de style dpendantes du mdia, consultez le site Web du World Wide Web Consortium l'adresse www.w3.org/TR/CSS21/media.html.

Par dfaut, Dreamweaver affiche votre mise en forme pour le type de mdia cran (qui indique comment une page apparat sur un cran d'ordinateur). Vous pouvez afficher les rendus de type de mdia suivants en cliquant sur les boutons respectifs dans la barre d'outils de rendu de style.

Rendu pour le type de support Ecran Indique comment la page apparat sur un cran d'ordinateur.

Rendu pour le type de support Impression Indique comment la page apparat sur une feuille de papier imprime.

Rendu pour le type de support Tlphone mobile Indique comment la page apparat sur un appareil portatif comme un tlphone mobile et un BlackBerry.

Rendu pour le type de support Projection Indique comment la page apparat sur un projecteur.

Rendu pour le type de support TTY Indique comment la page apparat sur un appareil de type tltype.

Rendu pour le type de support TV Indique comment la page apparat sur un tlviseur.

Intervertir l'affichage des Styles CSS Permet d'activer ou de dsactiver les styles CSS. Ce bouton fonctionne indpendamment des autres boutons de mdia.

Pour accder un didacticiel relatif la cration de feuilles de style pour l'impression et les appareils portatifs, consultez le site Web de Adobe l'adresse www.adobe.com/go/vid0156_fr.

Voir aussi


Prsentation de l'inspecteur PropritsL'inspecteur Proprits permet d'examiner et de modifier les proprits les plus frquentes de l'lment de la page slectionne, tel que le texte ou un objet insr. Le contenu de l'inspecteur Proprits varie en fonction de l'lment slectionn. Par exemple, si vous slectionnez une image de la page, l'inspecteur Proprits se modifie pour montrer les proprits de l'image (telles que le chemin d'accs au fichier, la largeur et la hauteur de l'image, la bordure autour de l'image, s'il y a lieu, et ainsi de suite).

http://www.w3.org/TR/CSS21/media.htmlhttp://www.adobe.com/go/vid0156_fr


21

L'inspecteur Proprits se trouve par dfaut dans le bas de l'espace de travail. Vous pouvez toutefois le dplacer dans le haut ou le transformer en panneau flottant sur l'espace de travail.

Voir aussi

Ancrage et annulation d'ancrage de panneaux et de groupes de panneaux la page 30

Utilisation de l'inspecteur Proprits la page 28

Prsentation du panneau FichiersVous pouvez utiliser les panneaux Fichiers pour afficher et exploiter les fichiers dans votre site Dreamweaver.

Lorsque vous affichez des sites, des fichiers ou des dossiers dans le panneau Fichiers, vous pouvez modifier la taille de la zone d'affichage. Vous pouvez galement agrandir ou rduire le panneau Fichiers. Dans sa forme rduite, le panneau Fichiers affiche le contenu du site local, du site distant ou du serveur d'valuation sous la forme d'une liste de fichiers. Sous sa forme dveloppe, le panneau affiche le site local et soit le site distant, soit le serveur d'valuation. Le panneau Fichiers peut galement afficher une carte d'arborescence du site local.

Pour les sites Dreamweaver, il est galement possible de personnaliser le panneau Fichiers en modifiant la vue (site local ou distant) qui s'affiche par dfaut dans le panneau rduit.

Voir aussi

Utilisation des fichiers depuis le panneau Fichiers la page 77


22

Prsentation du panneau Styles CSSIl vous permet de suivre les rgles CSS et les proprits qui affectent un lment de page slectionn (mode Current (ou Slection)), ou les rgles et les proprits qui affectent l'ensemble d'un document (mode All (ou Tout)). Un bouton bascule plac sur la partie suprieure du panneau Styles CSS vous permet de passer d'un mode l'autre. Le panneau Styles CSS vous permet de modifier les proprits CSS dans les deux modes.

Vous pouvez redimensionner n'importe quel volet en faisant glisser les cadres entre les volets.

En mode Current (Slection), le panneau Styles CSS prsente trois volets : un volet Summary for Selection (Rcapitulatif de la slection) qui prsente les proprits CSS de la slection en cours dans le document; un volet Rules (Rgles) qui prcise l'emplacement des proprits slectionnes (ou une cascade de rgles pour la balise slectionne, selon votre slection); et un volet Proprits qui vous permet de modifier les proprits CSS de la rgle dfinissant la slection.

En mode All (Tout), le panneau Styles CSS prsente deux volets : un volet All Rules (Toutes les rgles) (en haut) et un volet Proprits (en bas). Le volet Toutes les rgles prsente la liste des rgles dfinies dans le document actif, ainsi que l'ensemble des rgles dfinies dans les feuilles de styles jointes ce document. Le volet Proprits permet de modifier les proprits CSS de toute rgle slectionne dans le volet Toutes les rgles.

Toute modification apporte dans le volet Proprits s'applique immdiatement, ce qui vous permet d'avoir un aperu direct de votre travail.

Voir aussi

Cration et gestion CSS la page 121

Prsentation des guides visuelsDreamweaver met votre disposition plusieurs types de guides visuels pour vous aider concevoir vos documents et prvoir approximativement l'aspect qu'ils auront dans un navigateur. Vous pouvez effectuer les oprations suivantes :

Adapter instantanment la taille de la fentre de document un format d'affichage donn, afin de contrler la disposition des lments sur la page

Utiliser un trac d'image en arrire-plan de la page, de manire pouvoir reproduire plus aisment une mise en forme cre dans une application graphique telle que Adobe Photoshop ou Adobe Fireworks.

Utiliser des rgles et des guides comme repre visuel pour le positionnement et le redimensionnement prcis des lments de page


23

Utilisez la grille afin d'effectuer un positionnement et un redimensionnement prcis des lments positionnement absolu (PA).

Si la fonction d'alignement automatique est active, les lments PA s'alignent automatiquement sur le croisillon de grille le plus proche lorsqu'ils sont dplacs ou redimensionns (d'autres ob