Table Of Content

Dreamweaver® 4 Bible Joseph W. Lowery Hungry Minds, Inc. New York, NY ✦Cleveland, OH ✦Indianapolis, IN About the Author Joseph W. Lowery has been writing about computers and new technology since 1981. He is the author of the previous editions of Dreamweaver Bibleand Fireworks Bibleas well as Buying Online For Dummies(all from Hungry Minds, formerly IDG Books Worldwide). He recently co-wrote a book on Flash with designer Hillman Curtis and has also written books on HTML and using the Internet for business. Joseph is currently Webmaster for a variety of sites and is also a Web design trainer and consultant. Joseph and his wife, dancer/choreographer Debra Wanner, have a daughter, Margot. Foreword W e live in a time of great change, and I feel privileged to have the opportu- nity to affect the expression of a new medium, the Internet. Everything about the Web is evolving quickly—the design, the tools, and even the medium itself. Dreamweaver is an evolutionary product for Macromedia as well as a revolu- tionary one. Not only is Dreamweaver the state-of-the-art Web authoring tool used by more professionals than any other, it has also evolved into an application platform central to Macromedia’s ever-expanding Internet vision. I think one of the reasons Dreamweaver was so successful from the beginning is that it grew out of a community. Before Dreamweaver, there was a growing community of professional Web developers that no one was listening to. Developers cried, “Leave my code alone!” but all of the available visual editors altered their code. Developers pleaded, “Help me create tables,” but no integrated tool could help. Developers demanded, “I need cutting-edge features,” only to get the previous year’s fading standards. Macromedia decided to listen. The Dreamweaver project relied on an advisory board of designers and developers to identify the most desirable features. The development effort, however, was far more than a committee voting on a wish list. An entire culture was evolving, and the Dreamweaver team came out of that culture and remains a part of it still. Throughout the year we listen to our customers— both current and potential—to gather their reactions to the present release as well as to better understand their requirements for the future. One of the key underpinnings of Dreamweaver is its extensibility layer. By con- stantly expanding the core customizability of Dreamweaver, we enable our customers to streamline their workflow. We think it’s better that the product adapt to the way you work rather than that you have to adapt to the product. The community of extension builders has taken Dreamweaver to unforeseen heights in creating a new set of power tools for its use. In fact, Macromedia itself has taken advantage of Dreamweaver’s extensibility to craft a new product, Dreamweaver UltraDev. What’s in the future for Dreamweaver? Macromedia is committed to making tools for every aspect of what we call the Web Content Life Cycle. The most effective Web sites are continually developing and changing in response to their visitors’ needs and reactions. We see Dreamweaver as a core element in Macromedia’s mission to empower developers and their companies to create entertaining, educational, and effective Web content—and to successfully use that content to communicate and refine their message. x Dreamweaver 4 Bible One person whose message needs no refining is Joseph Lowery. From the beginings of Dreamweaver, Joe has provided the Dreamweaver community with remarkable works of clarity and substance. Dreamweaver®4 Bibleis the definitive resource for the Web authoring professional, not only because it covers the product in exhaus- tive detail but also because the book provides a much-needed context for under- standing new technologies. We’re glad that Joe has shared his talents and energies with Macromedia and the Dreamweaver community, and we look forward to growing together. Kevin Lynch President Products and Office of the President, Macromedia Preface W eb designers are relentless explorers in the ever-expanding frontier that is the World Wide Web. Boundary-pushing is not only the norm, it’s practi- cally a job requirement—which is one of the reasons Dreamweaver is the leading Web design program today. Dreamweaver provides the tools you need to build any type of Web site you can imagine. Imagination, however, is not enough. A cutting- edge site requires cutting-edge resources—and that’s the reason Dreamweaver 4 Biblewas written. Among other accolades, Macromedia’s Dreamweaver has one of the most appropriate product names in recent memory. Web page design is a blend of art and craft; whether you’re a deadline-driven professional or a vision-filled amateur, Dreamweaver is the perfect tool for many Web designers. 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 JavaScript coding. To use this book, you need only two items: the Dreamweaver software and a desire to make cutting-edge Web pages. (Actually, you don’t even need Dreamweaver to begin; the CD-ROM that accompanies this book contains a fully functional trial version.) From quick design prototyping to ongoing Web site management, Dreamweaver automates and simplifies much of a Webmaster’s workload. Unfortunately, even Dynamic HTML, which Dreamweaver handles elegantly, cannot accomplish all the tasks of a modern Web page. As a result, this book contains step- by-step instructions on how to handle every Web design task—through Dreamweaver’s visual interface or its integrated HTML code editors. Underneath its simple, intuitive interface, Dreamweaver is a complex program that makes high-end Web concepts (Dynamic HTML, Cascading Style Sheets, and JavaScript behaviors) accessible for the first time. Dreamweaver 4 Bibleis designed to help you master every nuance of the program. 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. What’s New in Dreamweaver 4 Since its inception, Dreamweaver has strived to serve two masters: professional Web developers, savvy in technique and used to hand-coding, and beginning designers looking to overcome their lack of HTML and JavaScript expertise. xii Dreamweaver 4 Bible Dreamweaver 4 attempts to continue the balancing act of satisfying the two different markets—and, in large part, succeeds. Innovations in Dreamweaver 4 can be categorized into three areas: team development, code enhancements, and layout tools. In a major coup for enterprise Web developers, Dreamweaver 4 supports two source control systems: Visual SourceSafe and WebDAV. Connecting to a Visual SourceSafe server is well integrated into Dreamweaver; simply define the VSS server as your remote site and add the necessary connection information. WebDAV, although perhaps less well known than VSS, offers an equally powerful and more available content management solution. More important, Macromedia has devel- oped the source control solution as a system architecture enabling other third- party content management or version control developers to use Dreamweaver as their front end. You’ll find complete coverage of Visual SourceSafe and WebDAV integration—as well as the other team-oriented features—in Chapter 35, new to this edition. Advanced coders tied to their simple text editor will be mightily tempted by Dreamweaver 4’s new code editor. Rewritten from the ground up, the editor now features auto-indenting, punctuation balancing, and live syntax coloring for HTML as well as for JavaScript. Accessing the editor is also easier than ever as Dreamweaver adds two new modes to the current Design view. Now you can see both the code and the layout simultaneously in one window via the Split view or just the code in the Code view. All modes are immediately accessible—along with numerous key options—through the new Toolbar. You’ll discover how to make the most of the new coding tools in Chapter 8. Dreamweaver has always made it easy for designers new to the Web to build nice- looking, interactive Web pages without having to know HTML or JavaScript. The new version expands on that theme with two developments: Layout mode and Flash objects. Layout mode allows designers to draw tables and cells directly on the screen for positioning content. Once drawn, cells can be modified by dragging borders or moving the entire cell; nested tables may also be included. Chapter 13 explains how it all comes together. Just as Dreamweaver behaviors may add JavaScript interactivity to a page without the developer’s knowing JavaScript, the new Flash objects offer the potential for including highly attractive navigation elements without your having to master a vector-based animation program. Two different types of Flash objects are available: Flash buttons and Flash text. A Flash button is actually a Macromedia Generator template with full animation and sound capabilities. Because it’s a template, the layout artist may customize it with text and a link. Dreamweaver ships with numerous examples, but anyone with Flash 5 can create his or her own template. Flash text, on the other hand, does not handle any animation other than a simple color rollover. However, it provides an effective way to include a heading or other page element in a specific font—a far better solution, with more market penetration, than materializing from Dynamic HTML. Both types of Flash objects are detailed in Chapter 23. Preface xiii Dreamweaver appeals to both the expert and the novice Web designer. Although the program is extraordinarily powerful, it’s also fairly intuitive. Nonetheless, designers new to the Web often find the entire process overwhelming and under- standably so. To give folks a bird’s-eye view of the overall use of Dreamweaver in Web site design and production, this edition includes a Quick Start in Chapter 2. In this chapter, you’ll see how one designer—yours truly—works with Dreamweaver in every aspect of building Web pages and constructing a site. Special emphasis is given to Dreamweaver 4’s new Layout view feature. 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 compli- cated effects, beginning Web designers are interested in Dreamweaver’s power and performance. Dreamweaver 4 Bibleaddresses 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. What Hardware and Software Do You Need? Dreamweaver 4 Bibleincludes coverage of Dreamweaver 4. If you don’t own a copy of the program, you can use the trial version on this book’s CD-ROM. Written to be platform-independent, this book covers both Macintosh and Windows versions of Dreamweaver 4. Macintosh Macromedia recommends the following minimum requirements for running Dreamweaver on a Macintosh: ✦Power Macintosh PowerPC (G3 or higher recommended) ✦MacOS 8.6 or 9.x ✦32MB of available RAM ✦135MB of available disk space ✦Color monitor capable of 800 ×600 resolution ✦CD-ROM drive xiv Dreamweaver 4 Bible Windows Macromedia recommends the following minimum requirements for running Dreamweaver on a Windows system: ✦Intel Pentium processor, 166MHz or equivalent (Pentium II or higher recommended) ✦Windows 9x/ME, NT 4.0 (with Service Pack 3), or Windows 2000 ✦32MB of available RAM ✦110MB of available disk space ✦256-color monitor capable of 800 ×600 resolution ✦CD-ROM drive Note These are the minimum requirements. As with all graphics-based design tools, more capability is definitely better for using Dreamweaver, especially in terms of memory and processor speed. How This Book Is Organized Dreamweaver 4 Biblecan 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 4 Bibleis divided into eight major task-oriented parts. Once you’re familiar with Dreamweaver, feel free to skip around the book, using it as a reference guide as you build up 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 later chapters, you encounter sections labeled “Dreamweaver Techniques.” Dreamweaver Techniques are step-by-step instructions for accomplishing specific Web designer tasks—for example, building an image map that uses rollovers, or eliminating underlines from hyperlinks through Cascading Style Sheets. Naturally, you can also use the Dreamweaver Techniques as stepping stones for your own explorations into Web page creation. If you’re running Dreamweaver while reading this book, don’t forget to use the CD-ROM. An integral element of the book, the accompanying CD-ROM offers a vast number of additional Dreamweaver behaviors, objects, commands, browser pro- files, and other extensions in addition to relevant code from the book. Preface xv Part I: Getting Started with Dreamweaver Part I begins with an overview of Dreamweaver’s philosophy and design. To get the most out of the program, you need to understand the key advantages it offers over other authoring tools and the deficiencies in them that Dreamweaver addresses. Part I takes you all the way to setting up your first site. In Chapter 2, you’ll get an overview of the Web development process as a quick start to Dreamweaver. The other opening chapters give you a full reference to the Dreamweaver interfaceand all of its customizable features. You also learn how you can access Dreamweaver’s full-bodied online Help and find additional resources on the Web. Chapter 6 takes you from the consideration of various Web site design models to publishing your finished site on the Internet while Chapter 7 shows you how to make the most of Dreamweaver’s FTP Site window. Part II: Using Basic HTML in Dreamweaver 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. Chapter 8 covers HTML theory, describing how a Web page is constructed and alerting you to some potential pitfalls to look out for. The three fundamentals of Web pages are text, images, and links. You explore how to incorporate these elements to their fullest extent in Chapters 9, 10, and 11, respectively. Chapter 12 examines another fundamental HTML option: lists. You study the list in all of its forms: numbered lists, bulleted lists, definition lists, nested lists, and more. Part III: Incorporating Advanced HTML Part III begins to investigate some of the more advanced structural elements of HTML as implemented in Dreamweaver. Chapter 13 examines the various uses of tables—from a clear presentation of data to organizing entire Web pages. Here you learn how to use Dreamweaver 4’s greatly enhanced visual table editing capabilities to resize and reshape your HTML tables quickly. Chapter 14 is devoted to image maps and shows how to use Dreamweaver’s built-in Image Map tools to create client-side image maps. The chapter also explains how you can build server-side image maps and demonstrates a revised technique for creating image map rollovers. Forms are the focus of Chapter 15, where you find all you need to know about gathering information from your Web page visitors. Chapter 16 investi- gates the somewhat complex world of frames—and shows how Dreamweaver has greatly simplified the task of building and managing these multifile creations, particu- larly with the new Frame objects. You also learn how tohandle more advanced design tasks such as updating multiple frames with just one click. xvi Dreamweaver 4 Bible Part IV: Extending HTML Through Dreamweaver HTML is a language with extensive capabilities for expanding its own power. Part IV begins with Chapter 17, which introduces you to the world of CGI programs, exter- nal plug-ins, Java applets, ActiveX controls, and scripting with JavaScript and VBScript. You also find techniques for ensuring a secure middle ground of cross- browser compatibility in the ongoing browser wars. With its own set of objects and behaviors, Dreamweaver complements HTML’s extensibility. Chapter 18 shows you how you can use the built-in objects to accomplish most of your Web page–layout chores quickly and efficiently—and when you’re ready for increased automation, the chapter explains how to build your owncustom objects. Chapter 19 offers an in-depth look at the capabilities of Dreamweaver behaviors. Each standard behavior is covered in detail with step- by-step instructions. If you’re JavaScript-savvy, Chapter 20 gives you the material you need to construct your own behaviors and reduce your day-to-day workload. Finally, Chapter 21 explores the brave new world of Dreamweaver extensibility, with complete coverage of using and building commands as well as custom tags, transla- tors, floaters, and C-level Extensions. Part V: Adding 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 Macromedia’s Fireworks is a top-notch graphics generator. Chapter 22 delves into methods for incorporating Fireworks graphics—with all the requisite rollover and other code intact. Special focus is given to the Dreamweaver-to-Fireworks communication link and how your Web production efforts can benefit from it. In addition to Dreamweaver, Macromedia is perhaps best known for one other con- tribution to Web multimedia: Flash. Chapter 23 explores the possibilities offered by incorporating Flash and Shockwave 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 Generator objects Chapter 24 covers digital video in its many forms: downloadable AVI files, streaming RealVideo displays, and panoramic QuickTime movies. Chapter 25 focuses on digital audio, with coverage of standard WAV and MIDI sound files as well as the newer streaming audio formats, like MP3. A special section covers the exciting possibilities offered by Beatnik and the Rich Music Format, with full coverage of the Beatnik ActionSet.