Adobe dreamweaver CS4 bible

About the Instructional Designer One of the innovations in Dreamweaver CS4 Bible is the inclusion of Captivate simulations on the Web site, one for each of the Dreamweaver Techniques in

Adobe ® Dreamweaver ®

CS4 Bible Joseph Lowery

www.it-ebooks.info

Adobe ® Dreamweaver ®

CS4 Bible

Adobe ® Dreamweaver ®

CS4 Bible Joseph Lowery

www.it-ebooks.info

Adobe ® Dreamweaver ®

CS4 Bible Joseph Lowery

Adobe® Dreamweaver® CS4 Bible

Copyright © 2009 by Wiley Publishing, Inc., Indianapolis, Indiana

Published simultaneously in Canada

ISBN: 978-0-470-38252-3

Manufactured in the United States of America

10 9 8 7 6 5 4 3 2 1

Library of Congress Cataloging-in-Publication Data is available from the publisher.

No part of this publication may be reproduced, stored in a retrieval system or transmitted in any form or by any means,

electronic, mechanical, photocopying, recording, scanning or otherwise, except as permitted under Sections 107 or 108

of the 1976 United States Copyright Act, without either the prior written permission of the Publisher, or authorization

through payment of the appropriate per-copy fee to the Copyright Clearance Center, 222 Rosewood Drive, Danvers,

MA 01923, (978) 750-8400, fax (978) 646-8600 Requests to the Publisher for permission should be addressed to the

Permissions Department, John Wiley & Sons, Inc., 111 River Street, Hoboken, NJ 07030, (201) 748-6011, fax (201)

748-6008, or online at http://www.wiley.com/go/permissions.

Limit of Liability/Disclaimer of Warranty: The publisher and the author make no representations or warranties with

respect to the accuracy or completeness of the contents of this work and specifically disclaim all warranties, including

without limitation warranties of fitness for a particular purpose No warranty may be created or extended by sales or

promotional materials The advice and strategies contained herein may not be suitable for every situation This work

is sold with the understanding that the publisher is not engaged in rendering legal, accounting, or other professional

services If professional assistance is required, the services of a competent professional person should be sought Neither

the publisher nor the author shall be liable for damages arising herefrom The fact that an organization or Web site is

referred to in this work as a citation and/or a potential source of further information does not mean that the author or

the publisher endorses the information the organization or Web site may provide or recommendations it may make

Further, readers should be aware that Internet Web sites listed in this work may have changed or disappeared between

when this work was written and when it is read.

For general information on our other products and services please contact our Customer Care Department within the

United States at (877) 762-2974, outside the United States at (317) 572-3993 or fax (317) 572-4002.

Trademarks: Wiley and the Wiley logo are trademarks or registered trademarks of John Wiley & Sons, Inc and/

or its affiliates, in the United States and other countries, and may not be used without written permission All other

trademarks are the property of their respective owners Wiley Publishing, Inc is not associated with any product or

vendor mentioned in this book.

Wiley also publishes its books in a variety of electronic formats Some content that appears in print may not be available

in electronic books.

www.it-ebooks.info

For Nelee—thanks for the never-ending support,

love, red wine, and brie

www.it-ebooks.info

About the Author

Joseph Lowery has been writing about computers and new technology since 1981 He is the

author of the previous editions of Dreamweaver Bible as well as the recent Adobe CS3 Web Workflows, and CSS Hacks and Filters (all published by Wiley) He is also the author of Joseph Lowery’s Beyond

Dreamweaver, Dreamweaver MX 2004 Killer Tips (with Angela Buraglia), and Dreamweaver MX 2004 Web Application Recipes and Dreamweaver 8 Recipes (with Eric Ott), all published by New Riders He

has also written books on HTML and using the Internet for business His books are international bestsellers, having sold more than 400,000 copies worldwide in eleven different languages Joe

is also a consultant and trainer and has presented at Seybold in both Boston and San Francisco, Adobe conferences in the U.S and Europe, and at ThunderLizard’s Web Design World He is cur-rently the Vice President of Marketing for WebAssist, the leading provider of Adobe extensions

About the Instructional Designer

One of the innovations in Dreamweaver CS4 Bible is the inclusion of Captivate simulations on the

Web site, one for each of the Dreamweaver Techniques in the book All of these interactive movies were created by Mark Fletcher

Mark Fletcher has been in the I.T industry for 19 years He began his career as a database

administrator and has been a web developer/trainer for the Virtual Training Company Mark is involved in developing training courses on Dreamweaver amongst other Adobe internet products

He is a regular contributor to Adobe’s Developer Centre Mark currently works for the Adobe Extension developer WebAssist where he spends much of his time creating instructional content

created in Adobe Captivate Mark was also the technical editor for CSS Hacks and Filters by Joseph

Lowery (Wiley Publishing, Inc.) Mark lives on the Northwest coast of the United Kingdom with his wife Vanessa and their two children, Joel and Lucy Mark can be reached on his personal blog, http://macrofireball.blogspot.com

Jack Lewis

Credits

www.it-ebooks.info

With the Creative Suite 4 version, Dreamweaver celebrates its 10th birthday I feel

hon-ored and extremely lucky to have been involved from the beginning Best of all, I’ve had the good fortune to meet and work with a great number of very talented, nice and way cool folks—some of whom I now get to thank

Looking for a technical editor par excellence? Well, keep looking, ’cause I’m hanging onto mine

Derren Whiteman has made sure the material is on the technical straight-and-narrow with his wide-ranging expertise and adept juggling of multiple operating systems and configurations

Thanks for all your work, Derren; you’ve really had a significant impact on the book—and your instant message humor has kept me going when I just want to nap

Adobe has been wonderfully supportive of my efforts to bring out the most detailed Bible possible I

can only imagine the collective groan that goes up when yet another e-mailed question from me—

with a deadline, no less—arrives Warm thanks and heartfelt appreciation to Scott Fegette, Devin Fernandez, Paul Gubbay, Donald Booth, Kin Blas, Heidi Voltmer, Christine Jennings, Charles Nadeau, Jay London, Randy Edmunds, Alain Dumesney, Lori Hylan-Cho, and all the other Dream-weaver team members who allowed me to pick their brains

To me, there’s no higher compliment than to be told that I know my business Well, the folks I work with at Wiley sure know their business: Executive Editor Scott Meyers and all the additional support staff I’d like to call out all the hard work and wonderful patience of Maryann Steinhart, who has been exceptional this time around

One last note of appreciation: To all the people who took a chance with some of their hard-earned money and bought the previous editions of this book That small sound you hear in the back-ground is me applauding you in thanks for your support I hope my efforts continue to be worthy

Introduction xxxi

Part I: Laying the Groundwork in Dreamweaver CS4 1

Chapter 1: What’s New in Dreamweaver CS4 3

Chapter 2: Introducing Dreamweaver CS4 13

Chapter 3: Touring Dreamweaver 49

Chapter 4: Setting Your Preferences 105

Chapter 5: Setting Up Sites and Servers 145

Part II: Designing and Crafting Basic Pages 181

Chapter 6: Accessing the Code Directly 183

Chapter 7: Building Style Sheet Web Pages 255

Chapter 8: Working with Text 301

Chapter 9: Inserting Images 357

Chapter 10: Establishing Web Links 401

Part III: Adding Advanced Design Features 421

Chapter 11: Working with Divs and AP Elements 423

Chapter 12: Using Behaviors 467

Chapter 13: Setting Up Tables 515

Chapter 14: Interactive Forms 551

Chapter 15: Creating Lists 589

Chapter 16: Using Frames and Framesets 619

Chapter 17: Powering Ajax Pages with Spry 651

Chapter 18: Working with JavaScript Frameworks .705

Part IV: Incorporating Dynamic Data 717

Chapter 19: Establishing Connections and Recordsets 719

Chapter 20: Making Data Dynamic 751

Chapter 21: Managing Data 773

Chapter 22: Working with Live Data 789

Chapter 23: Crafting Multiple-Page Applications 807

Part V: Including Multimedia Elements 845

Chapter 24: Adobe Photoshop, Fireworks, and Bridge Integration 847

Chapter 25: Inserting Flash Elements 881

Chapter 26: Adding Video to Your Web Page 895

Chapter 27: Using Audio on Your Web Page 925

www.it-ebooks.info

Part VI: Enhancing Productivity and Web Site Management 947

Chapter 28: Using Dreamweaver Templates 949

Chapter 29: Using Library Items and Server-side Includes 1009

Chapter 30: Maximizing Cross-browser Compatibility 1027

Chapter 31: Building Web Sites with a Team 1045

Chapter 32: Integrating with XML and XSLT 1099

Part VII: Extending Dreamweaver .1125

Chapter 33: Customizing Dreamweaver 1127

Chapter 34: Handling Server Behaviors 1175

Chapter 35: Creating Adobe AIR Applications 1207

Appendix A: What’s on the Web Site 1223

Index 1227

Contents at a Glance

www.it-ebooks.info

Introduction         xxxi

Part I: Laying the Groundwork in Dreamweaver CS4 1 Chapter 1: What’s New in Dreamweaver CS4        .3

New Workflows 4

Expanded Integration 5

Modern Web Practices 7

New Adobe Services 11

Summary 11

Chapter 2: Introducing Dreamweaver CS4         13

The Dynamic World of Dreamweaver 13

Connecting to the world’s data 14

True data representation 14

Integrated visual and text editors 15

World-class code editing 16

Web site maintenance tools 18

Team-oriented site building 19

The Dreamweaver Interface 20

Easy text entry 20

Drag-and-drop data fields 21

One-stop object modification 22

Accessing and managing resources 22

Complete custom environment 23

Managing keyboard shortcuts 23

Simple selection process 24

Enhanced layout options 25

Plugin media preview 25

Extended find and replace 25

Up-to-Date Code Standards 26

Cutting-edge CSS support 26

Addressing accessibility 27

Straightforward text and graphics support 27

Enhanced table capabilities 28

Easy form entry 29

Click-and-drag frame setup 30

Multimedia enhancements 31

Contents

Next-Generation Features 31

Ajax spoken here 31

Dynamic style updates 32

Photoshop, Flash, and Fireworks integration 33

Server-side behaviors 33

XML and XSLT integration 34

CSS layout control 36

JavaScript behaviors 37

Program Extensibility 38

Objects and behaviors 38

Server Behavior Builder 38

Commands and floating panels 39

Adjustable Insert panels 40

Custom tags, translators, and Property inspectors 40

Automation Enhancements 40

Rapid application development with Application objects 40

Importing Office documents 41

Reference panel 42

History panel 42

Site Management Tools 42

Object libraries 43

Supercharged templates 44

Browser targeting 45

Converting Web pages 46

Verifying links 46

FTP publishing 46

File Check In/Check Out 47

Summary 48

Chapter 3: Touring Dreamweaver         49

Choosing a Workspace Layout 49

Viewing the Document Window 54

Switching views in the Document window 56

Working with the status bar 60

Accessing the Toolbars 66

The Application bar 67

The Related Files bar 68

The Document toolbar 68

The Standard toolbar 72

The Style Rendering toolbar 73

The Coding toolbar 74

The Live Data toolbar 77

Selecting from the Insert Panel 77

Common objects 79

Layout objects 81

Forms objects 82

www.it-ebooks.info

Data objects 82

Spry objects 83

InContext Editing objects 86

Text objects 86

Favorites 88

ASP objects 89

ASP.NET objects 89

CFML objects 89

JSP objects 89

PHP objects 90

XSLT objects 90

Getting the Most Out of the Property Inspector 90

Manipulating the Property inspector 90

Property inspector elements 91

Customizing Your Workspace with Dockable Panels 93

Hiding and showing panels 98

Customizing panel groups 99

Accessing the Menus 100

Connecting to Adobe Services 102

Summary 104

Chapter 4: Setting Your Preferences         105

Customizing Your Environment 105

General preferences 105

Preferences for invisible elements 111

Highlighting preferences 113

Status Bar preferences 114

File Types / Editors preferences 116

Copy/Paste preferences 119

New Document preferences 120

Adjusting Advanced Features 122

Accessibility preferences 122

AP Elements preferences 124

CSS Styles preferences 126

Making Online Connections 128

Site preferences 128

Preview In Browser preferences 130

Customizing Your Code 132

Fonts preferences 132

Code Hints preferences 134

Code Rewriting preferences 135

Code Coloring preferences 137

Code Format preferences 139

Validator preferences 142

Summary 144

Contents

Chapter 5: Setting Up Sites and Servers         145

Planning Your Site 146

Deciding what you want to say 146

Targeting your audience 146

Determining your resources 146

Mapping Dynamic Pages for Web Applications 147

Defining a Site 148

Using the Site Definition Wizard 148

Using Advanced mode 153

Establishing local connections 153

Specifying the remote site 155

Adding testing server details 158

Cloaking Site Folders 159

Managing Site Info 161

Working Directly with Servers 161

Establishing a siteless server connection 162

Accessing server files 165

Creating and Saving New Pages 166

Starting Dreamweaver 166

Opening existing files 167

Opening a new file 167

Saving your file 169

Saving to remote servers 169

Closing the file 170

Quitting the program 170

Creating New Documents 171

Using the New Document dialog box 171

Creating a new default document 173

Previewing Your Web Pages 174

Putting Your Pages Online 176

Transferring with FTP 176

Using the FTP Log panel 179

Summary 180

Part II: Designing and Crafting Basic Pages 181 Chapter 6: Accessing the Code Directly         183

The Structure of a Web Page 184

Expanding into XHTML 185

doctype and doctype Switching 186

Defining <head> Elements 187

Establishing Page Properties 188

Understanding <meta> and other <head> tags 194

Adding to the <body> 201

Logical styles 202

Physical styles 203

www.it-ebooks.info

Working with Code View and the Code Inspector 203

Enabling Code view options 206

Printing code 207

Integrating Live View, Related Files, and Code Navigator Features 207

Enhanced workflow with Live view 208

Accessing Related Files 213

Navigating with the Code Navigator 213

Using the Coding Toolbar 214

Code collapse 215

Code selection and highlight 217

Commenting code 218

Manipulating CSS 218

Other Coding toolbar functions 220

Enhancing Code Authoring Productivity 220

Code Hints and Tag Completion 220

Modifying blocks of code 223

Inserting code with the Tag Chooser 225

Adding Code Through the Snippets Panel 226

Using the Reference Panel 229

Modifying Code with the Tag Inspector 231

Rapid Tag Modification with the Quick Tag Editor 233

Insert HTML mode 234

Wrap Tag mode 235

Edit Tag mode 238

Adding Java Applets 239

Managing JavaScript and VBScript 242

Inserting JavaScript and VBScript 242

Editing JavaScript and VBScript 244

Extracting JavaScript 245

Validating Your Page 247

Inserting Symbols and Special Characters 249

Named characters 249

Decimal characters and UTF-8 encoding 250

Using the Character objects 250

Summary 252

Chapter 7: Building Style Sheet Web Pages         255

Understanding Cascading Style Sheets 256

Grouping properties 256

Inheritance of properties 257

Cascading characteristics 257

Defining new class and ID selectors for extended design control 258

Specificity 259

How styles are applied 260

Working with the CSS Styles Panel 262

All mode 262

Current mode 264

Contents

Creating and Applying Styles 266

Generating new styles 266

Applying styles through the Property inspector 271

Attaching an external style sheet 271

Applying, changing, and removing a style 273

Editing and managing style sheets 277

Debugging your applied CSS 282

Styles and Their Attributes 285

Type options 286

Background options 287

Block options 289

Box options 291

Border options 292

List options 293

Positioning options 293

Extensions options 295

Design Time Style Sheets 298

Summary 300

Chapter 8: Working with Text         301

Starting with Headings 301

Working with Paragraphs 303

Inserting text 305

Cutting, copying, and pasting 305

Using drag-and-drop 306

Inserting text from other text applications 307

Copying and pasting code 308

Undo, redo, and the History panel 308

Checking Your Spelling 310

Using Find and Replace 312

Finding on the visual page 313

Searching the code 317

Concentrating your search with regular expressions 323

Controlling Whitespace 327

Indenting text 327

Working with preformatted text 328

The <br> tag 329

Working with Microsoft Office Documents 331

Copying and pasting Office content 331

Importing Office documents 332

Dragging and dropping Word and Excel files 333

Importing Word HTML 333

Styling Your Text 336

Depicting various styles 337

Using the <address> tag 339

Adding abbreviations and acronyms 340

www.it-ebooks.info

Modifying Text Format 341

Adjusting font size 341

Adding font color 343

Assigning a specific font 347

Aligning text 350

Indenting entire paragraphs 351

Incorporating Dates 352

Commenting Your Code 354

Summary 356

Chapter 9: Inserting Images         357

Web Graphic Formats 357

GIF 358

JPEG 359

PNG 360

Using Inline Images 361

Inserting images 362

Dragging images from the Assets panel 366

Optimizing and altering images 370

Modifying image attributes 378

Working with alignment options 382

Adding Background Images 385

Dividing the Web Page with Horizontal Rules 388

Applying Simple Web Animation 390

Including Banner Ads 391

Inserting Rollover Images 394

Adding a Navigation Bar 396

Summary 399

Chapter 10: Establishing Web Links         401

Understanding URLs 401

Surfing the Web with Hypertext 403

Eliminating underlines from links 406

Inserting URLs from the Assets panel 407

Pointing to a file 409

Addressing types 410

Checking links 411

Adding an Email Link 413

Navigating with Anchors 414

Moving within the same document 416

Using named anchors in a different page 416

Creating null links 417

Targeting Your Links 419

Summary 420

Chapter 12: Using Behaviors         467

Understanding Behaviors,Events, and Actions 467Attaching a Behavior 468Using the Behaviors panel 469Adding a behavior 470Managing events 472Standard actions 476Spry effects in Dreamweaver 495Deprecated behaviors 503Installing, Managing, and Modifying Behaviors 509Altering the parameters of a behavior 510Sequencing behaviors 511Deleting behaviors 511Summary 513

www.it-ebooks.info

Chapter 13: Setting Up Tables         515

HTML Table Fundamentals 515Rows 516Cells 517Column and row headings 518Inserting Tables in Dreamweaver 518Modifying Tables 523Selecting table elements 523Editing a table’s contents 526Working with table properties 531Setting cell, column, and row properties 542Sorting Tables 545Importing Tabular Data 547Summary 549

Chapter 14: Interactive Forms         551

How HTML Forms Work 551Inserting a Form in Dreamweaver 553Using Text Fields 555Inserting text fields 556Creating password fields 557Inserting multiline text areas 557Providing Checkboxes and Radio Buttons 561Checkboxes 561Radio buttons 561Creating Form Lists and Menus 566Drop-down menus 566Menu values 567Scrolling lists 568Navigating with a Jump Menu 573Modifying a jump menu 574Activating Go buttons 575Activating Your Form with Buttons 576Submit, Reset, and Command buttons 576Graphical buttons 577Using Hidden and File Fields 579The hidden input type 579The file input type 580Improving Accessibility 580Styling Forms with CSS 582Highlighting the form 582Altering input fields 583Distinguishing lists and menus 585Changing labels and legends 585Highlighting focus 587Summary 588

Contents

Chapter 15: Creating Lists         589

Creating Unordered (Bulleted) Lists 589Editing unordered lists 591List tags 591Using other bullet symbols 594Styling lists with CSS 595Mastering Ordered (Numbered) Lists 596Editing ordered lists 597Using other numbering styles 599Creating Navigation Buttons from Lists 600Step 1: Preparing background graphics 601Step 2: Creating the list and containing <div> 602Step 3: Building the CSS styles 605Step 4: Applying the CSS 609Making Definition Lists 610Using Nested Lists 613Accessing Special List Types 615Menu lists 615Directory lists 616Summary 616

Chapter 16: Using Frames and Framesets         619

Frames and Framesets: The Basics 620Columns and rows 620Sizing frames 621Creating a Frameset and Frames 621Creating a new frameset file 621Hand-coding framesets 623Creating a frameset visually 624Creating framesets quickly with frame objects 625Adding More Frames 628Using the menus 628Using the mouse 629Selecting, Saving, and Closing Framesets 630Selecting framesets and frames 630Saving framesets and frames 631Closing framesets 632Working with the Frameset Property Inspector 634Resizing frames in a frameset 634Manipulating frameset borders 635Modifying a Frame 636Page properties 637Working with the Frame Property inspector 637Modifying content 641Deleting frames 641

www.it-ebooks.info

Targeting Frame Content 642Targeting sections of your frameset 642Targeting specific frames in your frameset 643Updating two or more frames at once 643Handling Frameless Browsers 645Investigating Iframes 647Summary 650

Chapter 17: Powering Ajax Pages with Spry         651

Understanding Ajax and Spry 652What is Ajax? 652What is Spry? 653Integrating XML or HTML Data with Spry 654Merging HTML data into Web pages 656Connecting to XML data 661Defining Spry regions 665Binding data to the page 668Repeating Spry regions 670Enhancing Your Site with Spry Widgets 676Validating form fields 677Extending layout options 692Spry Effects 702Summary 703

Chapter 18: Working with JavaScript Frameworks         705

Using JavaScript Frameworks 706Integrating Framework Functions 707Implementing a Web Widget 712Summary 716

Part IV: Incorporating Dynamic Data 717 Chapter 19: Establishing Connections and Recordsets         719

Data Source Basics 720Understanding How Active Content Pages Work 723Opening a Connection to a Data Source 724Using Data Source Names (DSN) 726Specifying connection strings 733PHP 737Managing Connections 738Extracting Recordsets 740Building simple recordsets 740Writing advanced SQL statements 742Working with recordsets 747Summary 749

Contents

Chapter 20: Making Data Dynamic         751

Working with Dynamic Text 751Inserting dynamic text 751Viewing dynamic data 753Formatting Dynamic Data 756Data formatting 756Editing and creating new data formats 762Making Images Dynamic 764Integrating Flash and Other Dynamic Media 770Summary 771

Chapter 21: Managing Data         773

Displaying Data Conditionally 773Repeating data 774Showing and hiding page elements 779Handling Record Navigation 781Building record navigation links 781Using Application objects for record navigation 783Tracking record status 784Summary 786

Chapter 22: Working with Live Data         789

Viewing Live Data 790How Live Data works 790Setting up for Live Data 792Entering and exiting Live Data view 795Making changes in Live Data 795Live Data Settings 796Getting the query string 796Posting responses with Live Data settings 799Previewing an Application in the Browser 802Using the Server Debug Panel with ColdFusion 803Summary 805

Chapter 23: Crafting Multiple-Page Applications         807

Using the URL to Pass Parameters 807Sending parameters 808Receiving parameters 810Automating Master-Detail Page production 813Getting Values from a Form 818Passing single values from a form 818Passing multiple values from a form 820Passing form and URL values to a related page 820Establishing Dynamic Form Elements 823Text fields 823Checkboxes 824

www.it-ebooks.info

Radio buttons 825List/menus 826Managing Data Sources Online 827Inserting data 828Updating data 831Deleting data 834Inserting Variables 835Application and session variables 835Request and other variables 835Connecting to the Customer 838Logging in existing customers 838Restricting access 840Helping users log out 842Adding new customers 843Summary 844

Part V: Including Multimedia Elements 845 Chapter 24: Adobe Photoshop, Fireworks, and Bridge Integration         847

Bringing in Photoshop Images 848Inserting Photoshop files 848Copying and pasting from Photoshop 850Updating a Photoshop Smart Object 851Integrating Fireworks 856Optimizing an image in Fireworks 856Editing an image in Fireworks 861Replacing an image placeholder using Fireworks 863Inserting Rollovers 865Using Dreamweaver’s behaviors 866Using Fireworks’ code 868Modifying sliced images 872Controlling Fireworks with Dreamweaver 873Creating a Web photo album 873Building Dreamweaver/Fireworks extensions 876Working with Bridge 878Summary 880

Chapter 25: Inserting Flash Elements         881

Including Flash Movies in Dreamweaver Projects 882Designating SWF Attributes 884Setting Scale in Flash movies 885Additional parameters for Flash 886Configuring MIME Types 887Editing SWF Files from within Dreamweaver 887Inserting FlashPaper Documents 888Adding Shockwave Files 891Summary 893

Contents

Chapter 26: Adding Video to Your Web Page         895

Video on the Web 895The Flash Video Revolution 896Encoding video 897Progressive download versus streaming 898Inserting Flash video 899Publishing Flash video files 902Modifying Flash video parameters 902Mainstream Streaming Media 904RealMedia 904QuickTime 906Windows Media 907Working with Video Clips 908Linking to video 910Embedding video 910Playing Videos in Dreamweaver 911Inserting QuickTime Movies 912QuickTime versions 916Playing QuickTime VR 917Streaming with RealMedia 920Creating RealMedia metafiles 920Inserting RealMedia in your Web page 921Summary 923

Chapter 27: Using Audio on Your Web Page         925

Digital Audio Fundamentals 925File formats 926Making audio files lighter 927MIDI Files 929MP3 Mini-Primer 930Player support 931Encoding MP3 931Linking to Audio Files 931Embedding Sounds and Music 933Playing Background Music 934Targeting Specific Plugins 936Windows Media Player audio 936Using embed with ActiveX 938Installing Streaming Audio 939Working with floating or embedded RealAudio players 939Accessing RealAudio parameters 942Integrating Podcasts 943Podcast XML feeds 943Linking to podcasts and feeds 945Summary 946

www.it-ebooks.info

Part VI: Enhancing Productivity and Web Site Management 947 Chapter 28: Using Dreamweaver Templates         949

Understanding Templates 950Creating Your Own Templates 952Using Editable Regions 953Marking existing content as editable 953Inserting a new editable region 954Creating links in templates 955Locking an editable region 956Adding Content to Template Documents 957Making Attributes Editable 960Setting Editable Attributes 963Enabling Repeating Regions 964Modifying a repeating region 966Constructing a repeating table 967Establishing Optional Regions 971Combining editable and optional regions 973Setting optional region properties 974Evaluating template expressions 975Template expression examples 979Nesting Templates 986Working with Templates in the Assets Panel 988Creating a blank template 989Opening and deleting templates 990Applying templates 990Mapping inconsistent template regions 991Updating Templates 992Removing Template Markup 993Deleting template markup individually 993Removing template markup from an entire page 994Exporting a site without template markup 994Changing the Default Document 995Editing Content in the Browser 996Setting up InContext Editing templates 997Registering an InContext Editing site 1003Making edits online 1005Summary 1007

Chapter 29: Using Library Items and Server-side Includes         1009

Dreamweaver Library Items 1009Using the Library Assets Panel 1010Adding a Library item 1011Moving Library items to a new site 1012Inserting a Library item in your Web page 1013

Contents

Deleting an item from the Library 1015Renaming a Library item 1016Editing a Library Item 1017Updating Your Web Sites with Libraries 1019Applying Server-Side Includes 1022Adding server-side includes 1023Editing server-side includes 1025Summary 1025

Chapter 30: Maximizing Cross-browser Compatibility         1027

Converting Pages in Dreamweaver 1027Validating Your Code 1029Setting Validator preferences 1030Checking Your Page for Compatibility 1033Checking your pages 1038Using the results of the Browser Compatibility Check 1041Summary 1043

Chapter 31: Building Web Sites with a Team         1045

Following Check In/Check Out Procedures 1046Check In/Check Out overview 1046Enabling Check In/Check Out 1048Checking files in and out 1049Keeping Track with Design Notes 1051Setting up for Design Notes 1052Setting the status with Design Notes 1054Creating custom Design Notes 1055Viewing Design Notes 1055Browsing File View Columns 1056Generating Reports 1059Outputting HTML reports 1061Using Workflow reports 1062Administering Adobe Contribute Sites 1064Setting up Contribute compatibility 1066Entering sitewide administrator settings 1067Establishing Contribute roles 1068Connecting users 1080Rolling back a Contribute page in Dreamweaver 1083Integrating Dreamweaver with Visual SourceSafe 1084Communicating with WebDAV 1086Version Control with Subversion 1088Connecting to a Subversion server 1089Managing files in the repository 1090Summary 1097

www.it-ebooks.info

Chapter 32: Integrating with XML and XSLT         1099

Understanding XML 1100Exporting XML 1102Importing XML 1104Building Your Own XML Files 1105Styling with XSL 1106Including XSLT fragments 1107Building full XSLT pages 1116Summary 1123

Chapter 33: Customizing Dreamweaver         1127

Adding New Commands 1128Understanding Dreamweaver commands 1129Recording and replaying commands 1132Scripting commands 1135Useful command routines 1137Managing Menus and Keyboard Shortcuts 1142Handling History panel commands 1143Using the Keyboard Shortcut editor 1144Adjusting the menus.xml file 1146Building menu commands 1150Working with Custom Tags 1152Customizing Property Inspectors 1154Coding a Property inspector 1155Designing a Property inspector 1158Making Custom Floating Panels 1159Developing Translators 1162Translator functions 1163Locking code 1166Extending C-Level Libraries 1167Calling C-level extensions 1167Building C-level extensions 1169Customizing Your Tag Libraries 1170Editing tag libraries, tags, and attributes 1170Creating and deleting tag libraries, tags, and attributes 1172Importing a DTD or schema to create a new tag library 1173Summary 1173

Chapter 34: Handling Server Behaviors         1175

Understanding Server Behaviors 1176Applying and Managing Server Behaviors 1177Inserting and removing server behaviors 1177Editing the parameters 1178

Contents

Standard Server Behaviors 1179Recordset (Query) 1179Repeat Region 1180Recordset Paging 1181Move To Specific Record 1182Show Region 1183

Go To Detail Page 1184

Go To Related Page 1185Insert Record 1186Update Record 1187Delete Record 1188User authentication 1189Dynamic elements 1193Stored procedure/command/callable 1199Installing Additional Server Behaviors 1200Creating Custom Server Behaviors 1202Summary 1205

Chapter 35: Creating Adobe AIR Applications         1207

About Adobe AIR 1207Installing AIR into Dreamweaver 1210Designing for AIR 1211Packaging Your AIR Application 1215Summary 1220

Appendix A: What’s on the Web Site?         1223 Index         1227

www.it-ebooks.info

What’s in a name? In the case of Adobe’s Dreamweaver, you find one of the most

appro-priate product names around Web page design is a blend of art and craft; whether you’re a deadline-driven professional or a vision-filled amateur, Dreamweaver provides

an intuitive way to make your Web visions a reality Dreamweaver implies development, and it excels at producing multifaceted Web pages that bring content locked in a data store to the surface

Dreamweaver CS4 stands at the center of a complex series of overlapping worlds In one realm, designers of static Web pages are looking to expand their knowledge base into data-driven sites

Over there, you’ll find application developers—some savvy in Active Server Pages, some in Fusion, and others in PHP—anxious to develop for the Internet The spectrum of experience in both camps runs the gamut from eager novice to experienced professional, all of whom benefit from the advanced style capabilities of Cascading Style Sheets (CSS) There’s yet another group of prospective Web craftsmen and artists who want to do it all and are looking for a place to start

Cold-Dreamweaver CS4 is the one program robust enough for them all, and the Cold-Dreamweaver CS4 Bible is your guidebook to all its features and capabilities

To use this book, you need only two items: the Dreamweaver software and a desire to make cutting-edge Web pages (If you don’t have Dreamweaver, you can download a trial copy from www.adobe.com.) From quick design prototyping to ongoing Web site management, Dream-weaver automates and simplifies much of a Webmaster’s workload Dreamweaver is not only the first Web authoring tool to bring the ease of visual editing to an HTML-code–oriented world, it also brings a point-and-click interface to complex coding whether server-side or client-side The Dreamweaver CS4 Bible is designed to help you master every nuance of the program Are you styling your pages and creating your layouts with CSS? Are you building multipage Web applica-tions? Are you creating a straightforward layout with the visual editor? Do you need to extend Dreamweaver’s capabilities by building your own custom objects? With Dreamweaver and this book, you can weave your dreams into reality for the entire world to experience

Who Should Read This Book

Dreamweaver attracts a wide range of Web developers Because it’s the first Web authoring tool that doesn’t rewrite original code, veteran designers are drawn to using Dreamweaver as their first visual editor Because it also automates complicated effects, beginning Web designers are interested in Dreamweaver’s power and performance Dreamweaver CS4 Bible addresses the full spectrum of Web professionals, providing basic information on HTML if you’re just starting, as well as advanced tips and tricks for seasoned pros Moreover, this book is a complete reference for everyone working with Dreamweaver on a daily basis

Introduction

How This Book Is Organized

Dreamweaver CS4 Bible can take you from raw beginner to full-fledged professional if read cover to

cover However, you’re more likely to read each section as needed, taking the necessary information

and coming back later To facilitate this approach, Dreamweaver CS4 Bible is divided into seven major

task-oriented parts After you’re familiar with Dreamweaver, feel free to skip around the book, using

it as a reference guide as you increase your own knowledge base

The early chapters present the basics, and all chapters contain clearly written steps for the tasks you need to perform In most chapters, you encounter sections labeled Dreamweaver Techniques, completely rewritten for this version of the Dreamweaver Bible Dreamweaver Techniques are step-by-step instructions for accomplishing specific Web designer tasks; taken together, the Dreamweaver Techniques constitute an entire how-to course These step-by-step instructions are self-contained in each chapter, so you’re free to explore them in any order you choose You’ll find all the practice files for working on the Techniques on the Web site, both as starting points and as completed files Natu-rally, you can also use the Dreamweaver Techniques as stepping stones for your own explorations into Web page creation

You’ll find yet another cool addition to the Dreamweaver Bible on the Web site: interactive tions for each Dreamweaver Technique Created by master trainer Mark Fletcher with Adobe Capti-vate, these simulations give you the opportunity to practice all the steps in each Technique As my dad used to say, “Get it in your hand and you’ll get it in your head.”

simula-The Web site also offers a vast number of additional Dreamweaver server behaviors, objects, mands, and other extensions, in addition to relevant code from the book

com-Part I—Laying the Groundwork in Dreamweaver CS4

Part I begins with a look at what’s new in Dreamweaver CS4—and there’s an awful lot to cover Next

up, you’ll find an overview of Dreamweaver’s philosophy and design To get the most out of the gram, you need to understand the key advantages it offers over other authoring programs and their deficiencies, which Dreamweaver addresses Part I takes you all the way to setting up your first site

pro-Part II—Designing and Crafting Basic Pages

Although Dreamweaver is partly a visual design tool, its roots derive from the language of the Web:

HTML Part II gives you a solid foundation in the basics of HTML, even if you’ve never seen code

It also shows you how to get the most out of Dreamweaver’s code environment with any language

Chapter 6 describes what you need to know about the overall structure of a Web page, including the all-important <meta> tags

Reflecting the current emphasis in Web design on Cascading Style Sheets, Chapter 7 lays the dation to CSS In this chapter, you learn the basics of CSS, as well as how to define and apply styles

foun-in Dreamweaver Followfoun-ing the foun-introduction to CSS, you learn the three fundamentals of static Web pages: text, images, and links In Chapters 8, 9, and 10, you explore how to completely incorporate these elements

www.it-ebooks.info

Part III—Adding Advanced Design Features

After you master the basics, you’re ready to learn about some of Dreamweaver’s true power tools

in Part III First up is one of the most important constructs of HTML: <div> tags, also known in Dreamweaver as AP elements Chapter 11 examines this brave new world of pixel-perfect position-ing, AP elements that fly in and then disappear as if by magic, and Web sites that can change their look and feel at the click of a mouse Chapter 12 offers an in-depth look at the capabilities of Dream-weaver behaviors These bring a great deal of interactivity to AP elements specifically and to your Web page in general Each standard behavior is covered in detail with step-by-step instructions

Chapter 13 explores the various uses of tables—from a clear presentation of data to organizing entire Web pages Here you learn how to use Dreamweaver’s visual table editing capabilities to resize and reshape your HTML tables quickly Forms are an essential element in dynamic Web page design, and you learn all about them in Chapter 14 Chapter 15 presents another fundamental HTML option: lists You study the list in all its forms: numbered lists, bulleted lists, definition lists, nested lists, and more

Chapter 16 investigates the somewhat complex world of frames You see how Dreamweaver has greatly simplified the task of building and managing these multifile creations, particularly with the Frame objects You also learn how to handle more advanced design tasks such as updating multiple frames with just one click

Chapter 17 takes the Web to a whole new level: Web 2.0 to be exact With the introduction of the Spry framework, Adobe has made the sophisticated inner-workings of Ajax accessible to every Web developer This chapter explains what Ajax is and how Spry fits into the picture before diving into the wide range of Spry tools available in Dreamweaver CS4, including Spry Data, Spry Widgets, and Spry Effects Chapter 18 broadens Dreamweaver’s scope to incorporate other JavaScript frameworks such as jQuery, YUI or MooTools

Part IV—Incorporating Dynamic Data

Chapter 19 begins an in-depth investigation of Dreamweaver’s power to create dynamic Web pages by describing how to set up your basic connections and recordsets Chapter 20 explains how to insert text from a data source onto your Web page and how to format it after it’s incorporated You also see how

to relate other Web page elements—such as images, Flash movies, and other media files—to a data source Chapter 21 continues the exploration by delving into Dreamweaver’s powerful Repeat Region server behavior as well as discussing techniques for hiding and showing your data at will

One of Dreamweaver’s most useful features, the Live Data Preview, is examined extensively in ter 22 Chapter 23 enters the world of multipage applications and explains how variables and other data can be passed from one page to another

Introduction

Part V—Including Multimedia Elements

In recent years, the Web has moved from a relatively static display of text and simple images to a full-blown multimedia circus with streaming video, background music, and interactive animations

Part V contains the power tools for incorporating various media files into your Web site

Graphics remain the key medium on the Web today, and Adobe’s graphics programs are the world leaders Chapter 24 delves into methods for incorporating both Adobe Photoshop Smart objects and Adobe Fireworks graphics as well as graphics management through Adobe Bridge Special focus is given to the Dreamweaver-to-Photoshop and Dreamweaver-to-Fireworks communication links and how your Web production efforts can benefit from it

In addition to Dreamweaver, Adobe is perhaps best known for one other contribution to Web media: Adobe Flash Chapter 25 explores the possibilities offered by incorporating Flash and Shock-wave movies into Dreamweaver-designed Web pages and includes everything you need to know about configuring MIME types You also find step-by-step instructions for building Shockwave inline controls and playing Shockwave movies in frame-based Web pages, as well as how to add Flash Buttons, Flash Text, and the new Flash elements

multi-Chapter 26 covers digital video in its many forms—downloadable AVI files, streaming RealVideo displays, panoramic QuickTime movies, and the newest, hottest media: Flash video Chapter 27 focuses on digital audio, with coverage of standard WAV and MIDI sound files as well as the newer streaming audio formats like MP3

Part VI—Enhancing Productivity and Web Site Management

Although Web page design gets all the glory, Web site management pays the bills In Part VI, you see how Dreamweaver makes this essential part of any Webmaster’s day easier to handle Chapter 28 starts off with a look at the use of Dreamweaver Templates and how they can speed up production while ensuring a unified look and feel across your Web site, along with the in-browser site modifica-tions possible with the InContext Editing service Chapter 29 covers the Library, which can signifi-cantly reduce any Webmaster’s workload by providing reusable—and updatable—page elements

Chapter 30 describes Dreamweaver’s built-in tools for maintaining cross- and backward-browser compatibility, including the essential Browser Compatibility Check, which reviews your page for rendering issues in a number of modern browsers

Until now, individual Web developers have been stymied when attempting to integrate weaver into a team development environment File locking was all too easily subverted, allowing team members to inadvertently overwrite revisions Site reports were limited in scope and output only to HTML, and, worst of all, version control was nonexistent Dreamweaver CS4 tackles all these concerns while laying a foundation for future connectivity In Chapter 31, you see how you can tie Dreamweaver into an existing Visual SourceSafe, WebDAV or Subversion version control system Other new features covered include custom file view columns and enhanced Design Notes accessibility

Dream-www.it-ebooks.info

I can’t think of any new technology on the Web that has gained widespread acceptance as quickly

as XML has In a nutshell, XML (short for Extensible Markup Language) enables you to create your own custom tags that make the most sense for your business or profession Although XML doesn’t enjoy full browser support as of this writing, it’s only a matter of time—and little time at that Chap-ter 32 shows you how to apply this fast-approaching technology of tomorrow in Dreamweaver today, with a special section on Dreamweaver CS4’s new XML/XSLT technology

Part VII—Extending Dreamweaver

Dreamweaver is a program with immense capabilities for expanding its own power Chapter 33 explores the brave new world of Dreamweaver extensibility, with complete coverage of using and building commands as well as custom tags, translators, floaters, and C-level extensions With its own set of objects and behaviors, Dreamweaver complements HTML’s extensibility Finally, Chapter 34 examines server behaviors, describing every standard one in detail and then exploring the use of the Server Behavior Builder, Dreamweaver’s tool for creating custom server behaviors

Finally, in Chapter 35, you can see how Dreamweaver is on the cutting edge of producing Adobe AIR applications

Appendix

The appendix describes the contents of Dreamweaver CS4 Bible’s companion Web site, www.wiley com/go/dreamweavercs4bible Throughout this book, whenever you encounter a reference to files or programs on the Web site, please check this appendix for more information

Conventions and Features

There are many different organizational and typographical features throughout this book designed

to help you get the most of the information

Windows and Macintosh Conventions

Because Dreamweaver CS4 Bible is a cross-platform book, it gives instructions for both Windows and Macintosh users when keystrokes for a particular task differ Throughout this book, the Win-dows keystrokes are given first; the Mac’s are given second in parentheses, as follows:

To undo an action, press Ctrl+Z (Command+Z)

The first action instructs Windows users to press the Ctrl and Z keys in combination, and the ond action (in parentheses) instructs Macintosh users to press the Command and Z keys together

sec-Key Combinations

When you are instructed to press two or more keys simultaneously, each key in the combination is separated by a plus sign For example:

Ctrl+Alt+T (Command+Option+T)

When instructed to select or choose an item, you can click it once as previously described If you are selecting text or multiple objects, click the mouse button once, press Shift, and then move the mouse

to a new location and click again The color of the selected item or items inverts to indicate the tion To clear the selection, click once anywhere on the Web page

selec-Menu Commands

When instructed to select a command from a menu, you see the menu and the command separated

by an arrow symbol For example, when instructed to execute the Open command from the File menu, you see the notation File ➪ Open Some menus use submenus, in which case you see an arrow for each submenu, as follows: Insert ➪ Form Object ➪ Text Field

Typographical Conventions

I use italic type for new terms and for emphasis and boldface type for text that you need to type

directly from the computer keyboard

This code font is also used within paragraphs to designate HTML tags, attributes, and values such as

<body>, bgcolor, and #FFFFFF All HTML tags are presented in lowercase, as written by weaver, although browsers are not generally case-sensitive in terms of HTML

Dream-The code continuation character (i) at the end of a code line indicates that the line is too long to fit within the margins of the printed book You should continue typing the next line of code before pressing the Enter (Return) key

The New Feature icon is especially helpful for experienced Dreamweaver users It marks a section that details an innovation introduced in Dreamweaver CS4

NEW FEATURE

www.it-ebooks.info

Dreamweaver Techniques

A Dreamweaver Technique section provides the steps you need to try out a specific Dreamweaver task An interactive simulation of each technique is included in download material on this book’s Web site

Tips, Notes, and Cautions

Whenever the authors want to bring something important to your attention the information will appear in a Tip, Note, or Caution

This information is important and is set off in a separate paragraph with a special icon

Cautions provide information about things to watch out for, whether simply inconvenient

or potentially hazardous to your data or systems.

Tips generally are used to provide information that can make your work easier—special shortcuts or methods for doing something easier than the norm.

Notes provide additional, ancillary information that is helpful, but somewhat outside of the current presentation of information.

Cross-references point you to other places in the book that have additional information relative to the current topic.

On the Web tells you about useful material that you can download from Dreamweaver

I can’t promise instantaneous turnaround, but I answer all my mail to the best of my abilities

www.it-ebooks.info