Macromedia Using Dreamweaver User Manual

Using Dreamweaver

Trademarks

1 Step RoboPDF, ActiveEdit, ActiveTest, Authorware, Blue Sky Software, Blue Sky, Breeze, Breezo, Captivate, Central, ColdFusion, Contribute, Database Explorer, Director, Dreamweaver, Fireworks, Flash, FlashCast, FlashHelp, Flash Lite, FlashPaper, Flex, Flex Builder, Fontographer, FreeHand, Generator, HomeSite, JRun, MacRecorder, Macromedia, MXML, RoboEngine, RoboHelp, RoboInfo, RoboPDF, Roundtrip, Roundtrip HTML, Shockwave, SoundEdit, Studio MX, UltraDev, and WebHelp are either registered trademarks or trademarks of Macromedia, Inc. and may be registered in the United States or in other jurisdictions including internationally. Other product names, logos, designs, titles, words, or phrases mentioned within this publication may be trademarks, service marks, or trade names of Macromedia, Inc. or other entities and may be registered in certain jurisdictions including internationally.

Third-Party Information

This guide contains links to third-party websites that are not under the control of Macromedia, and Macromedia is not responsible for the content on any linked site. If you access a third-party website mentioned in this guide, then you do so at your own risk. Macromedia provides these links only as a convenience, and the inclusion of the link does not imply that Macromedia endorses or accepts any responsibility for the content on those third-party sites.

Copyright © 1997-2005 Macromedia, Inc. All rights reserved. This manual may not be copied, photocopied, reproduced, translated, or converted to any electronic or machine-readable form in whole or in part without written approval from Macromedia, Inc. Notwithstanding the foregoing, the owner or authorized user of a valid copy of the software with which this manual was provided may print out one copy of this manual from an electronic version of this manual for the sole purpose of such owner or authorized user learning to use such software, provided that no part of this manual may be printed out, reproduced, distributed, resold, or transmitted for any other purposes, including, without limitation, commercial purposes, such as selling copies of this documentation or providing paid-for support services.

Acknowledgments

Project Management: Charles Nadeau

Writing: Jon Michael Varese

Additional Writing: Jennifer Rowe, Paul Gubbay, Charles Nadeau

Editing: Rosana Francescato, Lisa Stanziano, Anne Szabla, Mary Ferguson, Mark Nigara

Production and Editing Management: Patrice O’Neill and Rosana Francescato

Media Design and Production: Adam Barnett, Aaron Begley, Paul Benkman, John Francis, Geeta Karmarkar, Paul Rangel, Arena Reed, Mario Reynoso

Localization Management: Melissa Baerwald

Special thanks to Sheila McGinn, Paul Gubbay, Vic Mitnick, Jim Doubek, Joaquin Blas, Wenlan Du, Ken Karleskint, Jennifer Taylor, Jorge Taylor, Nick Halbakken, Scott Richards, Sami Kaied, John Skidgel, Masayo Noda, Kristin Conradi, Yuko Yagi, the beta testers, and the entire Dreamweaver engineering and QA teams.

First Edition: September 2005 Macromedia, Inc.

601 Townsend St. San Francisco, CA 94103

PART 1: DREAMWEAVER BASICS

Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

What’s new in Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

Where to start . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21

Dreamweaver workflow for creating websites. . . . . . . . . . . . . . . . . . . . 25

Using Dreamweaver with other applications . . . . . . . . . . . . . . . . . . . . . 29

Dreamweaver and accessibility. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

Guide to Dreamweaver instructional media . . . . . . . . . . . . . . . . . . . . . . . 31

Typographical conventions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

HTML and web technologies resources . . . . . . . . . . . . . . . . . . . . . . . . . 36

Chapter 1: Exploring the Workspace. . . . . . . . . . . . . . . . . . . . . . . 39

About the Dreamweaver workspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39

Working in the Document window . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51

Using toolbars, inspectors, and context menus . . . . . . . . . . . . . . . . . . . 54

Using panels and panel groups . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61

Using Dreamweaver accessibility features . . . . . . . . . . . . . . . . . . . . . . . 64

Optimizing the workspace for accessible page design . . . . . . . . . . . . 69

Using visual guides in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71

Dreamweaver customizing basics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71

Chapter 2: Setting Up a Dreamweaver Site . . . . . . . . . . . . . . . . .79

About Dreamweaver sites . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .79

Setting up a new Dreamweaver site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82

Using the Advanced settings to set up a Dreamweaver site. . . . . . . . 83

Editing settings for a Dreamweaver site . . . . . . . . . . . . . . . . . . . . . . . . . .87

Editing existing websites in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . 88

Chapter 3: Creating and Opening Documents . . . . . . . . . . . . . . . 91

Creating new documents . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92

Saving a new document. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95

Setting a default new document type . . . . . . . . . . . . . . . . . . . . . . . . . . . .95

Setting the default file extension of new HTML documents . . . . . . . . 96

Opening existing documents . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96

Cleaning up Microsoft Word HTML files . . . . . . . . . . . . . . . . . . . . . . . . . 97

PART 2: WORKING WITH DREAMWEAVER SITES

Chapter 4: Managing Your Files . . . . . . . . . . . . . . . . . . . . . . . . . . 101

About site management . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102

Accessing sites, a server, and local drives . . . . . . . . . . . . . . . . . . . . . . . 106

Viewing files and folders . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .110

Comparing files for differences. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .113

Rolling back files (Contribute users) . . . . . . . . . . . . . . . . . . . . . . . . . . . . .119

Managing files and folders in the Files panel. . . . . . . . . . . . . . . . . . . . . .119

Working with a visual map of your site . . . . . . . . . . . . . . . . . . . . . . . . . . 124

Importing and exporting sites . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132

Removing a Dreamweaver site from your list of sites . . . . . . . . . . . . . 133

Checking in and checking out files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134

Getting and putting files to and from your server . . . . . . . . . . . . . . . . . 140

Synchronizing the files on your local and remote sites . . . . . . . . . . . . 144

Identifying and deleting unused files . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146

Cloaking folders and files in your site . . . . . . . . . . . . . . . . . . . . . . . . . . . 146

Storing file information in Design Notes. . . . . . . . . . . . . . . . . . . . . . . . . 150

Testing your site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 154

Chapter 5: Managing Site Assets and Libraries . . . . . . . . . . . . . 159

About library items. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159

Working with assets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .161

Creating and managing a list of favorite assets . . . . . . . . . . . . . . . . . . 168

Working with library items . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172

Chapter 6: Managing Contribute Sites with Dreamweaver . . . . 181

About managing Contribute sites. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 182

Preparing a site for use with Contribute . . . . . . . . . . . . . . . . . . . . . . . . . 186

Administering a Contribute site using Dreamweaver. . . . . . . . . . . . . . 187

Managing Contribute files using Dreamweaver . . . . . . . . . . . . . . . . . . 189

Troubleshooting a Contribute site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 192

4Contents

PART 3: LAYING OUT PAGES

Chapter 7: Laying Out Pages with CSS . . . . . . . . . . . . . . . . . . . . 197

About layers in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .198

Inserting a layer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200

Setting layer preferences and properties . . . . . . . . . . . . . . . . . . . . . . . 202

Managing layers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204

Manipulating layers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208

Converting layers to tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .210

Animating layers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .212

Inserting div tags for layout. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .221

Working with div tags for layout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222

Changing the highlight color for div tags. . . . . . . . . . . . . . . . . . . . . . . . 223

Working with CSS layout visualization . . . . . . . . . . . . . . . . . . . . . . . . . 224

Using rulers, guides, and the grid to lay out pages . . . . . . . . . . . . . . . 226

Using a tracing image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 230

Chapter 8: Presenting Content with Tables. . . . . . . . . . . . . . . . 233

About tables. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234

Inserting a table and adding content . . . . . . . . . . . . . . . . . . . . . . . . . . . 235

Importing and exporting tabular data . . . . . . . . . . . . . . . . . . . . . . . . . . . 237

Selecting table elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 238

Using Expanded Tables mode for easier table editing. . . . . . . . . . . . .241

Formatting tables and cells . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243

Resizing tables, columns, and rows . . . . . . . . . . . . . . . . . . . . . . . . . . . . 245

Adding and removing rows and columns . . . . . . . . . . . . . . . . . . . . . . 250

Splitting and merging cells . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .251

Copying, pasting, and deleting cells. . . . . . . . . . . . . . . . . . . . . . . . . . . . 253

Nesting tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 255

Sorting tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 256

Chapter 9: Laying Out Pages in Layout Mode . . . . . . . . . . . . . 257

About Layout mode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 258

Switching from Standard to Layout mode . . . . . . . . . . . . . . . . . . . . . . .261

Drawing in Layout mode. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262

Adding content to a layout cell . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 265

Clearing automatically set cell heights. . . . . . . . . . . . . . . . . . . . . . . . . . 267

Resizing and moving layout cells and tables . . . . . . . . . . . . . . . . . . . . 267

Formatting layout cells and tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 269

Setting column width. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 270

Setting preferences for Layout mode . . . . . . . . . . . . . . . . . . . . . . . . . . 273

Contents 5

Chapter 10: Using Frames . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 275

About frames and framesets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .276

Working with framesets in the Document window. . . . . . . . . . . . . . . 280

Creating frames and framesets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281

Selecting frames and framesets. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .284

Opening a document in a frame . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .287

Saving frame and frameset files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .287

Viewing and setting frame properties and attributes . . . . . . . . . . . . . .288

Viewing and setting frameset properties . . . . . . . . . . . . . . . . . . . . . . . 290

Controlling frame content with links . . . . . . . . . . . . . . . . . . . . . . . . . . . . 291

Handling browsers that can’t display frames. . . . . . . . . . . . . . . . . . . . .292

Using JavaScript behaviors with frames . . . . . . . . . . . . . . . . . . . . . . . .293

Chapter 11: Managing Templates . . . . . . . . . . . . . . . . . . . . . . . . 295

About Dreamweaver templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296

Creating a Dreamweaver template . . . . . . . . . . . . . . . . . . . . . . . . . . . . 308

Creating templates for a Contribute site. . . . . . . . . . . . . . . . . . . . . . . . . 312

Creating editable regions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 314

Creating repeating regions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 317

Using optional regions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 320

Defining editable tag attributes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .323

Creating a nested template . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .324

Editing and updating templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .326

Managing templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .329

Exporting and importing template XML content . . . . . . . . . . . . . . . . 330

Exporting a site without template markup . . . . . . . . . . . . . . . . . . . . . . .332

Applying or removing a template from an existing document . . . . . .332

Editing content in a template-based document . . . . . . . . . . . . . . . . . .334

PART 4: ADDING CONTENT TO PAGES

Chapter 12: Working with Pages . . . . . . . . . . . . . . . . . . . . . . . . . 341

About working with pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 341

Saving web pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .345

Specifying HTML instead of CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .347

Setting page properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .347

Working with colors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 350

Selecting elements in the Document window. . . . . . . . . . . . . . . . . . . . 351

Zooming in and out . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .354

Using the History panel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .355

6Contents

Automating tasks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 356

Using JavaScript behaviors to detect browsers and plug-ins . . . . . 363

Previewing and testing pages in browsers . . . . . . . . . . . . . . . . . . . . . . 363

Setting download time and size preferences . . . . . . . . . . . . . . . . . . . . 366

Chapter 13: Inserting and Formatting Text . . . . . . . . . . . . . . . . 369

About text formatting in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . 369

Inserting text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .381

Formatting paragraphs and document structure. . . . . . . . . . . . . . . . . 385

Formatting text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 388

Using Cascading Style Sheets to format text . . . . . . . . . . . . . . . . . . . 394

Checking spelling . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 404

Searching for and replacing text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 405

Chapter 14: Inserting Images. . . . . . . . . . . . . . . . . . . . . . . . . . . . 407

About images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 407

Inserting an image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 409

Resizing an image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .414

Cropping an image. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .415

Optimizing an image using Fireworks . . . . . . . . . . . . . . . . . . . . . . . . . . .416

Adjusting the brightness and contrast of an image. . . . . . . . . . . . . . . .416

Sharpening an image. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .417

Creating a rollover image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .418

Using an external image editor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .419

Applying behaviors to images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 420

Chapter 15: Linking and Navigation . . . . . . . . . . . . . . . . . . . . . . . 421

Understanding document locations and paths . . . . . . . . . . . . . . . . . . 422

Jump menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 425

Navigation bars . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 425

About image maps . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 426

Creating links. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 427

Managing links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 437

Inserting jump menus. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .441

Using navigation bars . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 444

Using image maps . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 446

Attaching JavaScript behaviors to links . . . . . . . . . . . . . . . . . . . . . . . . 448

Checking for broken, external, and orphaned links. . . . . . . . . . . . . . . 449

Fixing broken links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 450

Opening linked documents in Dreamweaver . . . . . . . . . . . . . . . . . . . . 452

Contents 7

Chapter 16: Working with Other Applications . . . . . . . . . . . . . . 453

About Fireworks and Flash integration. . . . . . . . . . . . . . . . . . . . . . . . . .453

Optimizing your work environment for Fireworks and Flash . . . . . . 454

Working with Fireworks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 455

Working with Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .466

Chapter 17: Adding Audio, Video, and Interactive Elements . . 469

About media files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .470

Inserting and editing media objects. . . . . . . . . . . . . . . . . . . . . . . . . . . . .472

Starting an external editor for media files. . . . . . . . . . . . . . . . . . . . . . . .474

Using Design Notes with media objects. . . . . . . . . . . . . . . . . . . . . . . . .476

Inserting and modifying a Flash button object . . . . . . . . . . . . . . . . . . .476

Inserting a Flash text object. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .479

Inserting Flash content. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 480

Downloading and installing Flash elements . . . . . . . . . . . . . . . . . . . . 480

Inserting Flash elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 481

Editing Flash element attributes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 481

Inserting FlashPaper documents . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .482

Inserting Flash Video content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .483

Inserting Shockwave movies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .487

Adding video (non-Flash) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .487

Adding sound to a page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .488

Inserting Netscape Navigator plug-in content . . . . . . . . . . . . . . . . . . 489

Inserting an ActiveX control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 491

Inserting a Java applet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 492

Using behaviors to control media. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 492

Chapter 18: Using JavaScript Behaviors . . . . . . . . . . . . . . . . . . 493

Using the Behaviors panel. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 494

About events. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 495

Applying a behavior. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 496

Attaching a behavior to text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .497

Changing a behavior . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 498

Updating a behavior . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 498

Creating new actions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 499

Downloading and installing third-party behaviors . . . . . . . . . . . . . . . 499

Using the behavior actions that come with Dreamweaver . . . . . . . . 499

8Contents

PART 5: WORKING WITH PAGE CODE

Chapter 19: Setting Up Your Coding Environment . . . . . . . . . . . 531

Viewing your code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .531

Using the coder-oriented workspace (Windows only). . . . . . . . . . . . 533

Setting coding preferences . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 533

Customizing keyboard shortcuts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 537

Opening files in Code view by default . . . . . . . . . . . . . . . . . . . . . . . . . . 537

Setting Validator preferences . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 538

Managing tag libraries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 538

Importing custom tags into Dreamweaver . . . . . . . . . . . . . . . . . . . . . . 543

Using an external HTML editor with Dreamweaver . . . . . . . . . . . . . . 545

Chapter 20: Coding in Dreamweaver. . . . . . . . . . . . . . . . . . . . . 549

About coding in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 549

Writing and editing code. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 558

Searching and replacing tags and attributes . . . . . . . . . . . . . . . . . . . . 570

Making quick changes to a code selection. . . . . . . . . . . . . . . . . . . . . . 572

Using language-reference material . . . . . . . . . . . . . . . . . . . . . . . . . . . . 573

Printing your code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 574

Chapter 21: Optimizing and Debugging Your Code . . . . . . . . . 575

Cleaning up your code. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 575

Verifying that tags and braces are balanced . . . . . . . . . . . . . . . . . . . . 576

Checking for browser compatibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . 577

Validating your tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 580

Making pages XHTML-compliant . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .581

Using the ColdFusion debugger (Windows only) . . . . . . . . . . . . . . . . 582

Chapter 22: Editing Code in Design View . . . . . . . . . . . . . . . . . 585

Editing code with the Property inspector . . . . . . . . . . . . . . . . . . . . . . . 585

Changing attributes with the Tag inspector . . . . . . . . . . . . . . . . . . . . . 586

Editing code with the Quick Tag Editor . . . . . . . . . . . . . . . . . . . . . . . . . 587

Editing code with the tag selector. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 590

Editing scripts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .591

Working with server-side includes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 593

Using JavaScript behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 594

Viewing and editing head content. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 595

Contents 9

PART 6: PREPARING TO BUILD DYNAMIC SITES

Chapter 23: Setting Up a Web Application . . . . . . . . . . . . . . . . 599

What you need to build web applications. . . . . . . . . . . . . . . . . . . . . . . 599

Setting up a web server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 600

Setting up an application server. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 601

Creating a root folder for the application . . . . . . . . . . . . . . . . . . . . . . . 605

Defining a Dreamweaver site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 606

Connecting to a database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 609

Chapter 24: Database Connections for ColdFusion

Developers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 611

Connecting to a database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .611

Editing or deleting a database connection. . . . . . . . . . . . . . . . . . . . . . . 613

Chapter 25: Database Connections for ASP.NET Developers. 615

Connecting to a database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 615

Editing or deleting a database connection. . . . . . . . . . . . . . . . . . . . . . . 619

Chapter 26: Database Connections for ASP Developers . . . . . 621

About database connections in ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . 621

Creating a DSN connection . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .624

Creating a DSN-less connection . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .627

Connecting to a database on an ISP. . . . . . . . . . . . . . . . . . . . . . . . . . . .628

Editing or deleting a database connection. . . . . . . . . . . . . . . . . . . . . . .632

Chapter 27: Database Connections for JSP Developers . . . . 633

About database connections in JSP. . . . . . . . . . . . . . . . . . . . . . . . . . . .633

Connecting to a database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .635

Connecting through an ODBC driver . . . . . . . . . . . . . . . . . . . . . . . . . . .637

Editing or deleting a database connection. . . . . . . . . . . . . . . . . . . . . . 640

Chapter 28: Database Connections for PHP Developers . . . . . 641

Connecting to a database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 641

Editing or deleting a database connection. . . . . . . . . . . . . . . . . . . . . . .642

Chapter 29: Troubleshooting Database Connections . . . . . . . 643

Troubleshooting permissions problems . . . . . . . . . . . . . . . . . . . . . . . . .643

Troubleshooting Microsoft error messages. . . . . . . . . . . . . . . . . . . . . .645

Troubleshooting MySQL error messages . . . . . . . . . . . . . . . . . . . . . . 650

10 Contents

PART 7: MAKING PAGES DYNAMIC

Chapter 30: Optimizing the Workspace for

Visual Development. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 653

Displaying web-application development panels . . . . . . . . . . . . . . . . 653

Viewing your database within Dreamweaver . . . . . . . . . . . . . . . . . . . . 656

Viewing live data in Design view . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 656

Working in Design view without live data . . . . . . . . . . . . . . . . . . . . . . . 662

Previewing dynamic pages in a browser . . . . . . . . . . . . . . . . . . . . . . . . 663

Restricting database information displayed in Dreamweaver . . . . . 664

Chapter 31: The Workflow for Dynamic Page Design . . . . . . . 665

Designing the page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 665

Creating a source of dynamic content . . . . . . . . . . . . . . . . . . . . . . . . . . 666

Adding dynamic content to a web page . . . . . . . . . . . . . . . . . . . . . . . . 668

Enhancing the functionality of a dynamic page . . . . . . . . . . . . . . . . . . 668

Testing and debugging the page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 670

Chapter 32: Obtaining Data for Your Page . . . . . . . . . . . . . . . . 673

Using a database to store content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 673

Collecting data submitted by users. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 674

Accessing data stored in session variables . . . . . . . . . . . . . . . . . . . . . 679

Chapter 33: Defining Sources of Dynamic Content . . . . . . . . . 685

About dynamic content sources . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 685

Defining a recordset. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .691

Defining URL parameters. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 695

Defining form parameters. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 696

Defining session variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 698

Defining application variables for ASP and ColdFusion . . . . . . . . . . 699

Using a variable as a data source for a ColdFusion recordset . . . . . 700

Defining server variables. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 701

Caching content sources . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 703

Changing or deleting content sources. . . . . . . . . . . . . . . . . . . . . . . . . . 704

Copying a recordset from one page to another page. . . . . . . . . . . . . 705

Chapter 34: Adding Dynamic Content to Web Pages . . . . . . . 707

About adding dynamic content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 707

Making text dynamic . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 709

Making images dynamic . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .710

Making HTML attributes dynamic . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 711

Contents 11

Making ActiveX, Flash, and other object parameters dynamic . . . . . 714

Editing dynamic content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 715

Deleting dynamic content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 715

Creating dynamic pages in a Contribute site . . . . . . . . . . . . . . . . . . . . . 716

Chapter 35: Displaying Database Records. . . . . . . . . . . . . . . . . 717

About displaying database records . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 717

Using predefined data formats . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .723

Creating recordset navigation links . . . . . . . . . . . . . . . . . . . . . . . . . . . .725

Showing and hiding regions based on recordset results . . . . . . . . . .728

Displaying multiple recordset results . . . . . . . . . . . . . . . . . . . . . . . . . . .729

Creating a table with a Repeat Region server behavior . . . . . . . . . . .730

Creating a record counter . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 731

Chapter 36: Displaying XML Data in Web Pages. . . . . . . . . . . .735

About using XML and XSL with web pages . . . . . . . . . . . . . . . . . . . . .735

About server-side XSL transformations. . . . . . . . . . . . . . . . . . . . . . . . . 737

About client-side XSL transformations . . . . . . . . . . . . . . . . . . . . . . . . .740

About XML data and repeating elements . . . . . . . . . . . . . . . . . . . . . . .743

About previewing XML data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .744

Performing XSL transformations on the server . . . . . . . . . . . . . . . . . . 746

Performing XSL transformations on the client . . . . . . . . . . . . . . . . . . .760

Applying styles to XSLT fragments. . . . . . . . . . . . . . . . . . . . . . . . . . . . .763

Troubleshooting XSL transformations . . . . . . . . . . . . . . . . . . . . . . . . . .764

Chapter 37: Using Web Services . . . . . . . . . . . . . . . . . . . . . . . . .765

About web services. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .766

Configuring proxy generators for use with Dreamweaver . . . . . . . . .770

Adding a web service proxy using the WSDL description . . . . . . . . . 773

Adding a web service to a page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .774

Editing the UDDI web service site list . . . . . . . . . . . . . . . . . . . . . . . . . . . 776

Chapter 38: Adding Custom Server Behaviors. . . . . . . . . . . . . . 777

About custom server behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 777

Installing third-party server behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . 787

Using the Server Behavior Builder . . . . . . . . . . . . . . . . . . . . . . . . . . . . .788

Using parameters in server behaviors. . . . . . . . . . . . . . . . . . . . . . . . . . . 791

Positioning code blocks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .792

Creating a dialog box for a custom server behavior . . . . . . . . . . . . . .794

Editing and modifying server behaviors . . . . . . . . . . . . . . . . . . . . . . . . .796

12 Contents

Chapter 39: Creating Forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . 799

About forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 799

Creating HTML forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 803

Inserting HTML form objects. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 805

Inserting dynamic HTML form objects . . . . . . . . . . . . . . . . . . . . . . . . . .810

Validating HTML form data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .814

Attaching JavaScript behaviors to HTML form objects . . . . . . . . . . .815

Attaching custom scripts to HTML form buttons . . . . . . . . . . . . . . . . .815

Creating accessible HTML forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .816

PART 8: DEVELOPING APPLICATIONS RAPIDLY

Chapter 40: Building ColdFusion Applications Rapidly. . . . . . . 821

About rapid application development (all servers) . . . . . . . . . . . . . . . .821

Building ColdFusion MX 7 forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 827

Building master/detail pages (ColdFusion) . . . . . . . . . . . . . . . . . . . . . 838

Building search/results pages (ColdFusion, ASP, JSP, PHP). . . . . 847

Building a record insert page (all servers). . . . . . . . . . . . . . . . . . . . . . . 853

Building pages to update a record (ColdFusion). . . . . . . . . . . . . . . . . 856

Building pages to delete a record (ColdFusion) . . . . . . . . . . . . . . . . . 863

Using stored procedures to modify databases (ColdFusion) . . . . . . 872

Building pages that restrict access to your site (ColdFusion,

ASP, JSP, PHP). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 874

Securing a folder in your application (ColdFusion) . . . . . . . . . . . . . . . 884

Using ColdFusion components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 884

Chapter 41: Building ASP.NET Applications Rapidly . . . . . . . . 893

Building ASP.NET forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 893

Creating ASP.NET DataGrid and DataList web controls . . . . . . . . . 897

Building master/detail pages (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . 902

Building a database search page (ASP.NET) . . . . . . . . . . . . . . . . . . . 909

Building a record insert page (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . .915

Building pages to update a record (ASP.NET) . . . . . . . . . . . . . . . . . . .915

Building pages to delete a record (ASP.NET) . . . . . . . . . . . . . . . . . . . 924

Using stored procedures to modify databases (ASP.NET) . . . . . . . 932

Building pages that restrict access to your site (ASP.NET) . . . . . . . 934

Chapter 42: Building ASP and JSP Applications Rapidly. . . . 935

Building master/detail pages (ASP and JSP) . . . . . . . . . . . . . . . . . . . 935

Building search/results pages (ASP and JSP) . . . . . . . . . . . . . . . . . . 939

Contents 13

Building a record insert page (ASP and JSP). . . . . . . . . . . . . . . . . . . 939

Building pages to update a record (ASP and JSP) . . . . . . . . . . . . . . 940

Building pages to delete a record (ASP and JSP). . . . . . . . . . . . . . . 945

Building pages with advanced data manipulation objects

(ASP and JSP). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 949

Building pages that restrict access to your site (ASP and JSP) . . . 953

Using JavaBeans (JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 953

Chapter 43: Building PHP Applications Rapidly . . . . . . . . . . . 957

Building master/detail pages (PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . . .957

Building search/results pages (PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . .963

Building a record insert page (PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . . 964

Building pages to update a record (PHP) . . . . . . . . . . . . . . . . . . . . . . 964

Building pages to delete a record (PHP) . . . . . . . . . . . . . . . . . . . . . . . . 971

Building pages that restrict access to your site (PHP) . . . . . . . . . . . .979

PART 9: APPENDIXES

Appendix A: Beginner’s Guide to Databases . . . . . . . . . . . . . . 983

About databases . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .983

Database design basics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 984

Understanding database connections . . . . . . . . . . . . . . . . . . . . . . . . . . 991

Appendix B: SQL Primer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 997

Syntax basics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .997

Defining the columns of a recordset . . . . . . . . . . . . . . . . . . . . . . . . . . . 999

Limiting the records in a recordset . . . . . . . . . . . . . . . . . . . . . . . . . . . . 999

Sorting the records in a recordset . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1003

Joining tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1003

Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1005

14 Contents

PART 1

Dreamweaver Basics

Learn how to use Macromedia Dreamweaver 8 documentation and other resources, and set up the Dreamweaver workspace to fit your preferred working style. Then plan and set up a site, and begin to create pages.

This part contains the following chapters:

Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

Chapter 1: Exploring the Workspace . . . . . . . . . . . . . . . . . . . . . . . . .39

Chapter 2: Setting Up a Dreamweaver Site . . . . . . . . . . . . . . . . . . . 79

Chapter 3: Creating and Opening Documents. . . . . . . . . . . . . . . . . 91

Introduction

Macromedia Dreamweaver 8 is a professional HTML editor for designing, coding, and developing websites, web pages, and web applications. Whether you enjoy the control of hand-coding HTML or prefer to work in a visual editing environment, Dreamweaver provides you with helpful tools to enhance your web creation experience.

The visual editing features in Dreamweaver let you quickly create pages without writing a line of code. You can view all your site elements or assets and drag them from an easy-to-use panel directly into a document. You can streamline your development workflow by creating and editing images in Macromedia Fireworks or another graphics application, then importing them directly into Dreamweaver, or by adding Macromedia Flash objects.

Dreamweaver also provides a full-featured coding environment that includes code-editing tools (such as code coloring and tag completion) and language reference material on Cascading Style Sheets (CSS), JavaScript, and ColdFusion Markup Language (CFML), among others. Macromedia Roundtrip HTML technology imports your hand-coded HTML documents without reformatting the code; you can then reformat code with your preferred formatting style.

Dreamweaver also enables you to build dynamic database-backed web applications using s e r v e r t e c h n o l o g i e s s uc h a s C F M L , A S P. N E T, A S P, J SP, a n d P H P.

Dreamweaver is fully customizable. You can create your own objects and commands, modify keyboard shortcuts, and even write JavaScript code to extend Dreamweaver capabilities with new behaviors, Property inspectors, and site reports.

This chapter contains the following sections:

What’s new in Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

Where to start . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21

Dreamweaver workflow for creating websites. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25

Using Dreamweaver with other applications . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29

Dreamweaver and accessibility. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

Guide to Dreamweaver instructional media . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31

Typographical conventions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

HTML and web technologies resources . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

What’s new in Dreamweaver 8

Dreamweaver 8 includes various new features that improve usability and help you to build pages whether you’re working in the design or the coding environment.

First, Dreamweaver 8 provides support for best practices and industry standards, including support for advanced CSS use, XML and RSS feeds, and accessibility requirements.

Work with best practices

Visual authoring with XML data

New, unified CSS panel The new, unified CSS panel provides a central location for

CSS layout visualization Apply visual aides at design time to outline CSS layout borders

Style Rendering toolbar View content the same way users will see it no matter what the

Get up to speed with XML using powerful, visual tools to integrate feeds into work and remove the mystery from XML to HTML translation. Integrate XML-based data, such as RSS feeds, into web pages using a simple drag-and-drop workflow. Jump to Code view to customize the transformation, using improved code hinting for XML and XSLT. For more information, see Chapter 36, “Displaying XML Data in

Web Pages,” on page 735.

learning, understanding, and working with the CSS styles applied to pages in a visual way. All the CSS functionality is consolidated into one panel set and enhanced to make working with CSS styles easier and more productive. The new interface makes it easier to see the cascade of styles applied to a specific element so that you can easily identify where attributes are defined. A property grid allows for quick edits. For more information, see “Using the CSS Styles panel” on page 394,

or color CSS layouts. Applying visual aides reveals complex nesting schemes and improves selection. Click the CSS layout for valuable tooltips that help you understand the elements that are controlling the design. See Chapter 7, “Laying Out Pages

with CSS,” on page 197.

delivery mechanism with new support for CSS media types. Use the Style Rendering toolbar to toggle to Design view and see how it will look in print, on a handheld, or onscreen. See

“The Style Rendering toolbar” on page 49.

18 Introduction

Work with best practices

CSS rendering improvements

Accessibility: Support for WCAG/W3C priority 2 checkpoints

Improved WebDAV WebDAV in Dreamweaver 8 now supports digest

Match how complex CSS layouts will render in most browsers with substantial improvements in Design view accuracy. Dreamweaver now fully supports advanced CSS techniques, such as overflow, pseudo-elements, and form elements.

In addition to the integrated accessibility evaluation tool for Section 508 and WCAG Priority 1 checkpoints, Dreamweaver now supports both CSS and accessibility with an updated evaluation tool that includes WCAG Priority 2 checkpoints.

authentication and SSL for secure file transfer, and offers improved connectivity with a wider array of servers. See “Using

WebDAV to check in and check out files” on page 136.

Get more done in less time with optimized user workflows that reduce the time required to complete common tasks. Dreamweaver 8 takes the hassle out of the little things so you can spend more time designing and developing engaging websites and applications.

Get more done

Background file transfer Keep working while Dreamweaver 8 uploads files to the server.

For more information, see “Managing file transfers”

on page 144.

Zoom Get greater control over your design with zoom. Zoom in and

inspect an image or work with a complex nested table layout. Zoom out to preview how a page will look. For more information, see “Zooming in and out” on page 354.

Guides Compare the page layout to page mockups with pixel-perfect

accuracy using guides to measure page layouts. Visual feedback helps measure distances accurately and supports intelligent snapping. For more information, see “Using guides”

on page 227.

Coding toolbar The new Coding toolbar provides buttons for common coding

features in a gutter bar along the side of Code view. For more information, see “Inserting code quickly with the Coding

toolbar” on page 561.

Code collapse Focus only on the code you want to see by hiding and

expanding blocks of code. For more information, see

“Collapsing and expanding code fragments” on page 566.

What’s new in Dreamweaver 8 19

Get more done

Workspace layouts Customize and save workspace configurations. Dreamweaver

8 ships with four different configurations tailored to the needs of designers and coders. You can also build a custom workspace. For more information, see “Saving custom workspace layouts”

on page 73.

Tabbed documents for the Mac

New starter pages New layouts and designs let you to create sites quickly.

Improved site synchronize and check-in/check-out

Compare files Quickly compare files to identify what has changed. You can

Paste Special With the new pasting options in Dreamweaver, you can retain

Site-relative references Work seamlessly with server-side includes at design time and

Code-editing improvements Gain greater control over how Dreamweaver provides code

New document tabs on the Mac help simplify the user interface and make it easier to select documents. For more information, see “Displaying tabbed documents (Macintosh)” on page 72.

Manage sites with increased reliability and confidence. Improved site synchronization features help ensure that the file in use is the latest version. Prevent accidental overwriting of others' work with improved check-in/check-out functionality. For more information, see “Synchronizing the files on your local

and remote sites” on page 144.

compare two local files, a file on the local computer and one on a remote computer, or two files on the remote computer. Use your favorite file comparison tool with Dreamweaver on both the Macintosh and Windows platforms. For more information, see “Comparing files for differences” on page 113.

all the source formatting created in Microsoft Word, or just paste the text. For more information, see “Adding text to a

document” on page 381.

runtime by ensuring that references are relative to sites instead of local files. For more information, see “Setting the relative

path of new links” on page 432.

hints and completes tags to fit with your coding style.

20 Introduction

Dreamweaver 8 supports efforts to learn and take advantage of new technologies, including PHP 5, Flash Video, ColdFusion MX 7, and the Macromedia Web Publishing System.

Integrates with the latest technologies and standards

Support for ColdFusion MX 7Updated support for ColdFusion MX 7 includes new server

behaviors and code hinting. To match the code hinting and debugging with the correct version of ColdFusion, Dreamweaver automatically detects the server version the first time it connects to the site. The tight integration between Dreamweaver and ColdFusion lets you add and remove databases directly from the Databases panel, and view only ColdFusion components defined in the current site. For more information, see “Enabling the ColdFusion enhancements”

on page 828.

Support for PHP 5 Take advantage of updated support for PHP 5, including server

behaviors and code hinting.

Flash Video Quickly and easily insert a Flash Video file in a web page. For

more information, see “Inserting Flash Video content”

on page 483.

Macromedia Web Publishing System: notification and event logging

Updated reference material from O'Reilly

Keep track of everything that is going on within your site. Events in Dreamweaver notify the Macromedia Web Publishing System server so that all changes to a website in the WPS system are recorded.

Consult new reference content for XML, XSLT, and XPath, and updated content for ASP and JSP.

Where to start

Dreamweaver documentation includes information for readers from various backgrounds. To get the most out of the documentation, start by reading the parts that are most appropriate for you.

For information about Dreamweaver resources, see “Guide to Dreamweaver instructional

media” on page 31.

Where to start 21

Web-design novices

If you are relatively new to web design, this section will point you to sections of the Dreamweaver documentation that are most appropriate for your background.

For web-design novices:

1. Begin by reading the tutorials in Getting Started in Dreamweaver.

2. In Using Dreamweaver (Help > Using Dreamweaver), read Chapter 1, “Exploring the

Workspace,” on page 39, Chapter 2, “Setting Up a Dreamweaver Site,” on page 79, Chapter 4, “Managing Your Files,” on page 101, and Chapter 3, “Creating and Opening Documents,” on page 91.

3. Learn about page layout by reading Chapter 9, “Laying Out Pages in Layout Mode,” on

page 257.

4. To learn about formatting text and including images in your pages, read Chapter 13,

“Inserting and Formatting Text,” on page 369 and Chapter 14, “Inserting Images,” on page 407.

That’s all you really need to begin producing high-quality websites, but when you’re ready to learn how to use more advanced tools, you can proceed through the rest of the static-page chapters in Using Dreamweaver. You might want to wait to read the dynamic-page chapters until you’re more familiar with creating web pages.

Experienced web designers

If you are an experienced web designer, this section will point you to sections of the Dreamweaver documentation that are most appropriate for your background. There are two different approaches: one for designers who are new to Dreamweaver and one for designers who are familiar with Dreamweaver but would like to learn more about creating dynamic pages.

For experienced web designers who are new to Dreamweaver:

1. Begin by reading the tutorials in Getting Started in Dreamweaver.

2. In Using Dreamweaver, read Chapter 1, “Exploring the Workspace,” on page 39 to learn

more about the Dreamweaver user interface.

3. Although much of the material in Chapter 2, “Setting Up a Dreamweaver Site,” on page 79

and Chapter 4, “Managing Your Files,” on page 101 is probably familiar to you, you should skim those chapters to see how these familiar concepts are implemented in Dreamweaver. Pay particular attention to the sections about setting up a Dreamweaver site.

22 Introduction

4. For useful information on the details of using Dreamweaver to create basic HTML pages,

read Chapter 13, “Inserting and Formatting Text,” on page 369 and Chapter 14,

“Inserting Images,” on page 407.

5. For information about coding in Dreamweaver, see “Setting Up Your Coding

Environment” on page 531, “Coding in Dreamweaver” on page 549, “Optimizing and Debugging Your Code” on page 575, and “Editing Code in Design View” on page 585.

6. Read the overview at the beginning of each of the other chapters in Using Dreamweaver to

determine whether its topics are of interest to you.

For experienced web designers, familiar with Dreamweaver, who want to learn about creating dynamic pages:

1. Begin by reading Chapter 12, “Understanding Web Applications” and “Tutorial:

Developing a Web Application” in Getting Started with Dreamweaver.

2. In Using Dreamweaver, skim Chapter 1, “Exploring the Workspace,” on page 39 to learn

about new aspects of the Dreamweaver user interface, then read “Optimizing the

Workspace for Visual Development” on page 653.

3. Become familiar with the Dreamweaver workflow for dynamic pages by reading “The

Workflow for Dynamic Page Design” on page 665.

4. Set up a web server and application server. (See Chapter 23, “Setting Up a Web

Application,” on page 599.)

5. Connect to a database. (See “Connecting to a database” on page 609.)

6. Read the overview at the beginning of each chapter in Using Dreamweaver to determine

whether its topics are of interest to you.

7. If you’re interested in customizing Dreamweaver by hand, read “Customizing

Dreamweaver” on the Macromedia Support Center at www.macromedia.com/go/

customizing_dreamweaver. If you want to write extensions for Dreamweaver, read

Extending Dreamweaver.

Where to start 23

Experienced hand-coders

If you are an experienced hand-coder, this section will point you to sections of the Dreamweaver documentation that are most appropriate for your background.

For experienced hand-coders:

1. In Using Dreamweaver, read Chapter 1, “Exploring the Workspace,” on page 39 to learn

more about the Dreamweaver user interface.

2. Although much of the material in Chapter 2, “Setting Up a Dreamweaver Site,” on page 79

and Chapter 4, “Managing Your Files,” on page 101 is probably familiar to you, skim those chapters to see how these familiar concepts are implemented in Dreamweaver. Pay particular attention to the sections on setting up a Dreamweaver site.

3. Read more about coding with Dreamweaver in Chapter 19, “Setting Up Your Coding

Environment,” on page 531, Chapter 20, “Coding in Dreamweaver,” on page 549, Chapter 21, “Optimizing and Debugging Your Code,” on page 575, and Chapter 22, “Editing Code in Design View,” on page 585.

4. Read the overview at the beginning of each chapter in Using Dreamweaver to determine

whether its topics are of interest to you.

Web application developers

If you are a web application developer, this section will point you to sections of the Dreamweaver documentation that are most appropriate for your background. There are two different approaches, depending on whether you’ve used Dreamweaver before.

For web application developers who have not used Dreamweaver:

1. Begin by quickly reading Getting Started in Dreamweaver to familiarize yourself with the

basics of using Dreamweaver.

2. In Using Dreamweaver, read Chapter 1, “Exploring the Workspace,” on page 39 to learn

more about the Dreamweaver user interface.

3. Although much of the material in Chapter 2, “Setting Up a Dreamweaver Site,” on page 79

4. Set up a web server and application server using Dreamweaver. (See Chapter 23, “Setting

Up a Web Application,” on page 599.)

24 Introduction

5. Connect to a database. (See “Connecting to a database” on page 609.)

6. Read the overview at the beginning of each of the chapter in Using Dreamweaver to

determine whether its topics are of interest to you.

For experienced web application developers who have used Dreamweaver:

1. Begin by reading “What’s new in Dreamweaver 8” on page 18.

2. In Using Dreamweaver, skim Chapter 1, “Exploring the Workspace,” on page 39 to learn

about new aspects of the Dreamweaver user interface.

3. If you’re interested in customizing Dreamweaver by hand, read “Customizing

Dreamweaver” on the Macromedia Support Center at www.macromedia.com/go/

customizing_dreamweaver. If you want to write extensions for Dreamweaver, read

Extending Dreamweaver.

Dreamweaver workflow for creating websites

There are many possible approaches to creating a website. The workflow presented in this documentation starts by defining a site’s strategy or goals. If you’re developing web applications, you have to set up servers and databases as needed. Then you design the look and feel of the site. When the design is complete, you build the site and code the pages, adding content and interactivity; then you link pages together, and test the site for functionality and to see if it meets its defined objectives. You can include dynamic pages in your site as well. At the end of the cycle, you publish the site on a server. Many developers also schedule periodic maintenance to ensure that the site remains current and functional.

Planning your site

Planning and organizing your site carefully from the start can save you time later on. Organizing your site includes not only determining where the files will go, but also examining site requirements, audience profiles, and site goals. Additionally, you should consider technical requirements such as user access, as well as browser, plug-in, and download restrictions.

Dreamweaver workflow for creating websites 25

Once you’ve organized your information and determined a structure, you can begin creating your site.

■ Use the Dreamweaver Files panel to set up your site’s organizational structure. In the Files

panel, you can easily add, delete, and rename files and folders to change the organization as needed. (See Chapter 2, “Setting Up a Dreamweaver Site,” on page 79 and Chapter 4,

“Managing Your Files,” on page 101.)

■ You can begin to create simple pages which you’ll later turn into more complex designs.

Create new blank pages or pages based on predesigned page designs. (See Chapter 3,

“Creating and Opening Documents,” on page 91.)

If you work on a web-development team, you may also be interested in these topics:

■ Set up a system to prevent team members from overwriting files. (See “Checking in and

checking out files” on page 134.)

■ Use Design Notes to communicate with web team members. (See “Storing file

information in Design Notes” on page 150.)

Managing your site files

The Dreamweaver Files and Assets panels make it easy for you to manage your site files.

■ In the Dreamweaver Files panel you’ll find many tools to help you manage your site,

transfer files to and from a remote server, set up a Check In/Check Out process to prevent files from being overwritten, and synchronize the files on your local and remote sites. (See

“Managing Your Files” on page 101.)

■ Use the Assets panel to easily organize the assets in a site; you can then drag most assets

directly from the Assets panel into a Dreamweaver document. (See Chapter 5, “Managing

Site Assets and Libraries,” on page 159.)

■ You can use Dreamweaver to manage aspects of your Contribute sites. (See Chapter 6,

“Managing Contribute Sites with Dreamweaver,” on page 181.)

Laying out web pages

Dreamweaver provides you flexibility as you mock-up and work toward a final layout for your pages. Choose the layout technique that works for you, or use the Dreamweaver layout options in conjunction with one another to create your site’s look.

■ You can use Dreamweaver layers or CSS positioning styles to create your layout. (See

Chapter 7, “Laying Out Pages with CSS,” on page 197.)

26 Introduction

■ The table tools and Layout mode in Dreamweaver let you quickly design web pages by

drawing and then rearranging the page structure. (See Chapter 8, “Presenting Content

with Tables,” on page 233 and Chapter 9, “Laying Out Pages in Layout Mode,” on page 257.)

■ If you want to display multiple documents at once in a web browser, you can lay out

documents using frames. (See Chapter 10, “Using Frames,” on page 275.)

■ Dreamweaver templates enable you to easily apply reusable content and page designs to

your site. You can create new pages based on a Dreamweaver template, then update the layout of those pages automatically when the template changes. (See Chapter 11,

“Managing Templates,” on page 295.)

Adding content to pages

Using Dreamweaver, you can easily add a variety of content to web pages. Add assets and design elements, such as text, images, colors, movies, sound, and other forms of media.

■ Dreamweaver page creation features enable you to specify web page properties such, as

page titles, background images and colors. In addition, Dreamweaver provides tools to help you maximize website performance, and to test pages to ensure compatibility with different web browsers. (See Chapter 12, “Working with Pages,” on page 341.)

■ Type directly in a Dreamweaver document, or import text from other documents, then

format the text using the Dreamweaver Property inspector. You can also easily create your own Cascading Style Sheets. (See Chapter 13, “Inserting and Formatting Text,” on

page 369.)

■ Insert images, including rollover images, image maps, and Fireworks sliced images, and

use alignment tools to position images in a page. You can also resize images directly in Dreamweaver. (See Chapter 14, “Inserting Images,” on page 407 and Chapter 16,

“Working with Other Applications,” on page 453.)

■ With Dreamweaver you can create standard HTML links, including anchor links and e-

mail links, or easily set up graphical navigation systems, such as jump menus and navigation bars. (See Chapter 15, “Linking and Navigation,” on page 421.)

■ Insert other types of media in a web page, such as Flash, Shockwave, and QuickTime

movies, sound, and applets. (See Chapter 17, “Adding Audio, Video, and Interactive

Elements,” on page 469.)

■ Use behaviors to perform tasks in response to specific events, such as highlighting a button

when the visitor passes the pointer over it, validating a form when the visitor clicks the Submit button, or opening a second browser window when the main page is finished loading. (See Chapter 18, “Using JavaScript Behaviors,” on page 493.)

Dreamweaver workflow for creating websites 27

Hand-coding

Coding web pages by hand is another approach to creating pages. Dreamweaver provides easyto-use visual editing tools, but it also provides a sophisticated coding environment; you can use either approach, or both, to create and edit your pages.

■ You can work in a coding environment without visual tools; coding tools help you create

and edit code, format code, and make sure that your code adheres to standards. (See

Chapter 19, “Setting Up Your Coding Environment,” on page 531 and Chapter 20, “Coding in Dreamweaver,” on page 549, and Chapter 21, “Optimizing and Debugging Your Code,” on page 575.)

■ You can also use some Dreamweaver coding tools in Design view, the visual design

environment. (See Chapter 22, “Editing Code in Design View,” on page 585.)

Setting up a web application

Many websites contain dynamic pages that allow visitors to view information stored in databases, and usually allow some visitors to add new information and edit information in the databases. To create such pages, you must first complete several preparatory steps.

■ Set up a web server and application server, then create or modify a Dreamweaver site. (See

Chapter 23, “Setting Up a Web Application,” on page 599.)

■ Connect to a database. (See “Connecting to a database” on page 609).

Creating dynamic pages

In Dreamweaver, you can define a variety of sources of dynamic content, including recordsets extracted from databases, form parameters, and JavaBeans components. To add the dynamic content to a page, simply drag it onto the page.

You can set your page to display one record or many records at a time, display more than one page of records, add special links to move from one page of records to the next (and back), and create record counters to help users keep track of the records.

■ If you’re unfamiliar with creating web applications in Dreamweaver, learn how to use

Dreamweaver to build dynamic pages. (See Chapter 30, “Optimizing the Workspace for

Visual Development,” on page 653 and Chapter 31, “The Workflow for Dynamic Page Design,” on page 665.)

■ Define and display dynamic content on your pages. (See Chapter 32, “Obtaining Data for

Your Page,” on page 673, Chapter 33, “Defining Sources of Dynamic Content,” on page 685, Chapter 34, “Adding Dynamic Content to Web Pages,” on page 707, and Chapter 35, “Displaying Database Records,” on page 717.)

28 Introduction

■ Encapsulate application or business logic using leading-edge technologies such as

Macromedia ColdFusion components and web services. (See “Using ColdFusion

components” on page 884 and Chapter 37, “Using Web Services,” on page 765.)

■ If you need more flexibility, you can create your own server behaviors and interactive

forms. (See Chapter 38, “Adding Custom Server Behaviors,” on page 777 and Chapter 39,

“Creating Forms,” on page 799.)

Rapid application development

Dreamweaver offers a number of rapid application development (RAD) tools, including server behaviors and application objects, that help you build sophisticated web applications without having to write any server-side code.

■ Quickly create pages that search and modify databases and display the results. Provide

security by restricting access to your pages. (See “Building ColdFusion Applications

Rapidly” on page 821, “Building ASP.NET Applications Rapidly” on page 893, “Building ASP and JSP Applications Rapidly” on page 935, and “Building PHP Applications Rapidly” on page 957.)

Using Dreamweaver with other applications

Dreamweaver accommodates your web design and development process by making it easy for you to work with other applications. For information about working with other applications such as browsers, HTML editors, image editors, and animation tools, see the following topics:

■ For information about using Dreamweaver with other HTML editors, such as HomeSite

or BBEdit, see “Using an external HTML editor with Dreamweaver” on page 545.

■ You can specify preferred browsers for previewing your site. (See “Previewing and testing

pages in browsers” on page 363.)

■ You can start an external image editor, such as Macromedia Fireworks or Adobe

Photoshop, from within Dreamweaver. (See “Using an external image editor”

on page 419.)

■ You can configure Dreamweaver to start a different editor for each file type. (See “Starting

an external editor for media files” on page 474.)

Using Dreamweaver with other applications 29

■ For information about adding interactivity to your site using Macromedia Flash, see

“Inserting and modifying a Flash button object” on page 476, “Inserting a Flash text object” on page 479, or “Downloading and installing Flash elements” on page 480.

■ For information about using ColdFusion, see Using ColdFusion (Help > Using

ColdFusion).

Dreamweaver and accessibility

Accessibility refers to making websites and web products usable for people with visual, auditory, motor, and other disabilities. Examples of accessibility features for software products and websites include screen reader support, text equivalents for graphics, keyboard shortcuts, change of display colors to high contrast, and so on.

NOTE

For more information about two significant accessibility initiatives, see the World Wide Web Consortium Web Accessibility Initiative (www.w3.org/wai) and Section 508 of the Federal Rehabilitation Act (www.section508.gov).

Dreamweaver provides tools that make the product accessible and tools that help you author accessible content:

Using Dreamweaver accessibility features For Dreamweaver web designers who need to

use accessibility features, Dreamweaver offers screen reader support, keyboard navigation, and operating system accessibility support.

For more information, see “Using Dreamweaver accessibility features” on page 64.

Authoring for accessibility For Dreamweaver web designers who need to create accessible

content, Dreamweaver assists you in creating accessible pages that contain useful content for screen readers and comply with government guidelines.

Dreamweaver provides dialog boxes that prompt you to enter accessibility attributes when you insert page elements (see “Optimizing the workspace for accessible page design” on page 69). For example, the accessibility dialog box for images reminds you to add text equivalents for graphics. Then, when the image appears on a page for a user with visual disabilities, the screen reader reads the description.

30 Introduction

+ 1000 hidden pages