Adobe Golive 5 Bible 9780764533471, 0764533479

Citation preview

---

®

Adobe ™ GoLive 5 Bible

Adobe GoLive 5 Bible ®

™

Deborah Shadovitz

IDG Bo o ks Wo rldwide, Inc . An Internatio nal Data Gro up Co mpany Fo ster City, CA ✦ Chic ago , IL ✦ Indianapo lis, IN ✦ New Yo rk, NY

Adobe ® GoLive ™ 5 Bible Published by

IDG Books Worldwide, Inc. An Internatio nal Data Gro up Co mpany 919 E. Hillsdale Blvd., Suite 300 Fo ster City, CA 94404 www.idgbooks.com (IDG Bo o ks Wo rldwide Web site) Co pyright © 2001 IDG Bo o ks Wo rldwide, Inc . All rights reserved. No part o f this bo o k, inc luding interio r design, c o ver design, and ic o ns, may be repro duc ed o r transmitted in any fo rm, by any means (elec tro nic , pho to c o pying, rec o rding, o r o therwise) witho ut the prio r written permissio n o f the publisher. ISBN: 0-7645-3347-9 Printed in the United States o f Americ a 10 9 8 7 6 5 4 3 2 1 1B/ RU/ RS/ QQ/ FC Distributed in the United States by IDG Bo o ks Wo rldwide, Inc . Distributed by CDG Bo o ks Canada Inc . fo r Canada; by Transwo rld Publishers Limited in the United Kingdo m; by IDG No rge Bo o ks fo r No rway; by IDG Sweden Bo o ks fo r Sweden; by IDG Bo o ks Australia Publishing Co rpo ratio n Pty. Ltd. fo r Australia and New Zealand; by TransQuest Publishers Pte Ltd. fo r Singapo re, Malaysia, Thailand, Indo nesia, and Ho ng Ko ng; by Go to p Info rmatio n Inc . fo r Taiwan; by ICG Muse, Inc . fo r Japan; by Interso ft fo r So uth Afric a; by Eyro lles fo r Franc e; by Internatio nal Tho mso n Publishing fo r Germany, Austria, and Switzerland; by Distribuido ra Cuspide fo r Argentina; by LR Internatio nal fo r Brazil; by Galileo Libro s fo r Chile; by Edic io nes ZETA S.C.R. Ltda. fo r Peru; by WS Co mputer Publishing Co rpo ratio n, Inc ., fo r the Philippines; by Co ntempo ranea de Edic io nes fo r Venezuela; by Express Co mputer Distributo rs fo r the Caribbean and West Indies; by Mic ro nesia Media Distributo r, Inc . fo r Mic ro nesia; by Chips Co mputado ras S.A. de C.V. fo r Mexic o ; by Edito rial No rma de Panama S.A. fo r Panama; by Americ an Bo o ksho ps fo r Finland.

Fo r general info rmatio n o n IDG Bo o ks Wo rldwide’s bo o ks in the U.S., please c all o ur Co nsumer Custo mer Servic e department at 800-762-2974. Fo r reseller info rmatio n, inc luding disc o unts and premium sales, please c all o ur Reseller Custo mer Servic e department at 800-434-3422. Fo r info rmatio n o n where to purc hase IDG Bo o ks Wo rldwide’s bo o ks o utside the U.S., please c o ntac t o ur Internatio nal Sales department at 317-572-3993 o r fax 317-572-4002. Fo r c o nsumer info rmatio n o n fo reign language translatio ns, please c o ntac t o ur Custo mer Servic e department at 800-434-3422, fax 317-572-4002, o r e-mail rights@idgbo o ks.c o m. Fo r info rmatio n o n lic ensing fo reign o r do mestic rights, please pho ne +1-650-653-7098. Fo r sales inquiries and spec ial pric es fo r bulk quantities, please c o ntac t o ur Order Servic es department at 800-434-3422 o r write to the address abo ve. Fo r info rmatio n o n using IDG Bo o ks Wo rldwide’s bo o ks in the c lassro o m o r fo r o rdering examinatio n c o pies, please c o ntac t o ur Educ atio nal Sales department at 800-434-2086 o r fax 317-572-4005. Fo r press review c o pies, autho r interviews, o r o ther public ity info rmatio n, please c o ntac t o ur Public Relatio ns department at 650-653-7000 o r fax 650-653-7500. Fo r autho rizatio n to pho to c o py items fo r c o rpo rate, perso nal, o r educ atio nal use, please c o ntac t Co pyright Clearanc e Center, 222 Ro sewo o d Drive, Danvers, MA 01923, o r fax 978-750-4470.

Library of Congress Cataloging-in-Publication Data Shado vitz, Debo rah. Ado be Go Live 5 bible / Debo rah Shado vitz. p. c m. ISBN 0-7645-3347-9 (alk. paper) 1. Ado be Go Live. 2. Web site --Design. I. Tapley, Rebec c a. II. Title. TK5105.8885.A34 S48 2000 005.7'2--dc 21 99-058463

LIMIT OF LIABILITY/DISCLAIMER OF WARRANTY: THE PUBLISHER AND AUTHOR HAVE USED THEIR BEST EFFORTS IN PREPARING THIS BOOK. THE PUBLISHER AND AUTHOR MAKE NO REPRESENTATIONS OR WARRANTIES WITH RESPECT TO THE ACCURACY OR COMPLETENESS OF THE CONTENTS OF THIS BOOK AND SPECIFICALLY DISCLAIM ANY IMPLIED WARRANTIES OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. THERE ARE NO WARRANTIES WHICH EXTEND BEYOND THE DESCRIPTIONS CONTAINED IN THIS PARAGRAPH. NO WARRANTY MAY BE CREATED OR EXTENDED BY SALES REPRESENTATIVES OR WRITTEN SALES MATERIALS. THE ACCURACY AND COMPLETENESS OF THE INFORMATION PROVIDED HEREIN AND THE OPINIONS STATED HEREIN ARE NOT GUARANTEED OR WARRANTED TO PRODUCE ANY PARTICULAR RESULTS, AND THE ADVICE AND STRATEGIES CONTAINED HEREIN MAY NOT BE SUITABLE FOR EVERY INDIVIDUAL. NEITHER THE PUBLISHER NOR AUTHOR SHALL BE LIABLE FOR ANY LOSS OF PROFIT OR ANY OTHER COMMERCIAL DAMAGES, INCLUDING BUT NOT LIMITED TO SPECIAL, INCIDENTAL, CONSEQUENTIAL, OR OTHER DAMAGES. FULFILLMENT OF EACH COUPON OFFER IS THE RESPONSIBILITY OF THE OFFEROR. Trademarks: All brand names and pro duc t names used in this bo o k are trade names, servic e marks, trademarks, o r registered trademarks o f their respec tive o wners. IDG Bo o ks Wo rldwide is no t asso c iated with any pro duc t o r vendo r mentio ned in this bo o k. is a registered trademark o r trademark under exc lusive lic ense to IDG Bo o ks Wo rldwide, Inc . fro m Internatio nal Data Gro up, Inc . in the United States and/ o r o ther c o untries.

Welcome to the world of IDG Books Worldwide. IDG Books Worldwide, Inc., is a subsidiary of International Data Group, the world’s largest publisher of computer-related information and the leading global provider of information services on information technology. IDG was founded more than 30 years ago by Patrick J. McGovern and now employs more than 9,000 people worldwide. IDG publishes more than 290 computer publications in over 75 countries. More than 90 million people read one or more IDG publications each month. Launched in 1990, IDG Books Worldwide is today the #1 publisher of best-selling computer books in the United States. We are proud to have received eight awards from the Computer Press Association in recognition of editorial excellence and three from Computer Currents’ First Annual Readers’ Choice Awards. Our bestselling ...For Dummies® series has more than 50 million copies in print with translations in 31 languages. IDG Books Worldwide, through a joint venture with IDG’s Hi-Tech Beijing, became the first U.S. publisher to publish a computer book in the People’s Republic of China. In record time, IDG Books Worldwide has become the first choice for millions of readers around the world who want to learn how to better manage their businesses. Our mission is simple: Every one of our books is designed to bring extra value and skill-building instructions to the reader. Our books are written by experts who understand and care about our readers. The knowledge base of our editorial staff comes from years of experience in publishing, education, and journalism — experience we use to produce books to carry us into the new millennium. In short, we care about books, so we attract the best people. We devote special attention to details such as audience, interior design, use of icons, and illustrations. And because we use an efficient process of authoring, editing, and desktop publishing our books electronically, we can spend more time ensuring superior content and less time on the technicalities of making books. You can count on our commitment to deliver high-quality books at competitive prices on topics you want to read about. At IDG Books Worldwide, we continue in the IDG tradition of delivering quality for more than 30 years. You’ll find no better book on a subject than one from IDG Books Worldwide.

John Kilcullen Chairman and CEO IDG Books Worldwide, Inc.

Eighth Annual Computer Press Awards 1992

Ninth Annual Computer Press Awards 1993

Tenth Annual Computer Press Awards 1994

Eleventh Annual Computer Press Awards 1995

IDG is the world’s leading IT media, research and exposition company. Founded in 1964, IDG had 1997 revenues of $2.05 billion and has more than 9,000 employees worldwide. IDG offers the widest range of media options that reach IT buyers in 75 countries representing 95% of worldwide IT spending. IDG’s diverse product and services portfolio spans six key areas including print publishing, online publishing, expositions and conferences, market research, education and training, and global marketing services. More than 90 million people read one or more of IDG’s 290 magazines and newspapers, including IDG’s leading global brands — Computerworld, PC World, Network World, Macworld and the Channel World family of publications. IDG Books Worldwide is one of the fastest-growing computer book publishers in the world, with more than 700 titles in 36 languages. The “...For Dummies® ” series alone has more than 50 million copies in print. IDG offers online users the largest network of technology-specific Web sites around the world through IDG.net (http://www.idg.net), which comprises more than 225 targeted Web sites in 55 countries worldwide. International Data Corporation (IDC) is the world’s largest provider of information technology data, analysis and consulting, with research centers in over 41 countries and more than 400 research analysts worldwide. IDG World Expo is a leading producer of more than 168 globally branded conferences and expositions in 35 countries including E3 (Electronic Entertainment Expo), Macworld Expo, ComNet, Windows World Expo, ICE (Internet Commerce Expo), Agenda, DEMO, and Spotlight. IDG’s training subsidiary, ExecuTrain, is the world’s largest computer training company, with more than 230 locations worldwide and 785 training courses. IDG Marketing Services helps industry-leading IT companies build international brand recognition by developing global integrated marketing programs via IDG’s print, online and exposition products worldwide. Further information about the company can be found at www.idg.com. 1/26/00

Credits Acquisitions Editor

Quality Control Technician

Mic hael Ro ney

Dina F Quan

Project Editors

Permissions Editor

Chris Jo hnso n Linda Turno wski

Laura Mo ss

Media Development Specialist Technical Editor

Jamie Hastings-Smith

Ric hard Gaskin

Media Development Coordinator Copy Editors Mic hael D. Welc h Dennis Weaver Laura Sto ne Cindy Lai Lane Barnho ltz Julie Campbell Mo ss

Proof Editor

Marisa Pearman

Book Designer Drew R. Mo o re

Illustrators Gabriele Mc Cann Mary Jo Weis Karl Brandt

Patsy Owens

Proofreading and Indexing Project Coordinator

Yo rk Pro duc tio n Servic es

Lo uigene A. Santo s

Cover Illustration Graphics and Production Specialists Bo b Bihlmayer Ro lly Delro sario Jude Levinso n Mic hael Lewis Vic to r Pérez-Varela Ramses Ramirez

Lawrenc e Huc k

About the Author Deborah Shadovitz’s first c areer was in televisio n, video , and audio -visual pro duc tio n and editing. (She also dabbled in radio and theater pro duc tio n.) Her affinity to ward Go Live is a result o f her design and c o mmunic atio ns bac kgro und. Like many o f us, she’s enamo ured by the Web fo r its unique c o mmunic atio n c apability. Bec ause o f this, she apprec iates Go Live’s visio n o f making this c o mmunic atio n easier fo r all, and lo ves sho wing o ff Go Live’s easy designer-o riented metho do lo gy and po wer. She enjo ys helping o thers use Go Live effec tively and wanted to write this bo o k sinc e using Go Live 2 (then c alled Go Live CyberStudio ). Debo rah is well kno wn in the Mac c o mmunity as an autho r, instruc to r, and speaker. She started o ut o n c o mputers using DOS and fo llo wed the path to Windo ws, so she’s also familiar with the Windo ws enviro nment. She’s do ne stints o n several Lo s Angeles–area Internet gro up adviso ry bo ards and is an ac tive partic ipant in the user gro up c o mmunity. Debo rah is also o n the Go Live Adviso ry Co mmittee (as yo u c an see if yo u watc h the Go Live splash sc reen lo ng eno ugh). Deb is kno wn internatio nally fo r her well-rec eived c o lumn, “Mac Effic ienc y 101,” at www.maccentral.com. She is c o autho r o f the award-winning Macwo rld Office 98 Bible , ClarisWo rks Office Fo r Dummie s, and Apple Wo rks 5 Fo r Dummie s, as well as a c o ntributo r to o ther bo o ks inc luding My iMac (all fro m IDG Bo o ks Wo rldwide). She’s a regular speaker/ instruc to r at Mac wo rld Expo , o ther trade sho ws and events, and at c o mputer user gro ups. And o f c o urse, she teac hes Go Live — yo u c an c atc h her at vario us user-gro up meetings, trade sho ws, o r private seminars.

About the Tech Editor Richard Gaskin is fo under and president o f Fo urth Wo rld Media Co rpo ratio n, a Lo s Angeles–based so ftware and Web develo pment firm. While Ric hard has been develo ping interac tive media sinc e befo re the Web was invented, to day muc h o f his c o mpany’s wo rk relies o n Ado be Go Live. Having c o ntributed so ftware engineering, testing, and do c umentatio n servic es to a variety o f bo th c o mmerc ial so ftware pro duc ts and internal pro c ess enhanc ement to o ls, Ric hard has a deep apprec iatio n fo r the c o ntributio ns Go Live makes fo r his c o mpany and tho se o f his c lients. Passio nate abo ut usability, Ric hard is ac ting c hair o f the Lo s Angeles c hapter o f the ACM Spec ial Interest Gro up fo r Co mputer–Human Interac tio n, and has given presentatio ns o n user-interfac e design and pro to typing at Mac wo rld Expo s in San Franc isc o and Bo sto n. When he’s no t develo ping so ftware o r editing bo o ks, Ric hard keeps himself sane by hiking in the Santa Mo nic a mo untains, c amping in the Mo jave desert, and taking his emplo yees to Disneyland.

To Cathy Scrivno r, o fficial Bo o k Mo m and fabulo us frie nd, fo r all o f yo ur lo ng nights te sting the o rie s and me tho ds, and discussing to pics with me until the right wo rds came thro ugh. ( Go o d thing it’s a lo cal pho ne call! To m can have his wife back no w.) He r name is no t in many place s in this bo o k, but he r wo rds, wisdo m, and spirit sure are . To Richard McLe an, Olive r Zaho rka, Ro b Ke nige r, and to all the o the r pe o ple who have adde d to my kno wle dge o f Go Live , so me o f who m I kno w in pe rso n and many I have ye t to me e t, but am pro ud to kno w no ne the le ss. In o the r wo rds, to all the pe o ple who have participate d o n the Go Live e -mail lists o ve r the ye ars — tho se who aske d gre at que stio ns and tho se who patie ntly answe re d the m. And to my family, fo r all o f yo ur suppo rt during this ve ry lo ng pro ce ss. Mo m, thanks fo r the te mpo rary laundry se rvice . Dad, thanks fo r the gro ce ry de live ry. David and Orly, thanks fo r the me al de live ry. ( I’m back to do ing my o wn laundry, sho pping, and co o king no w.) Do nna, thanks fo r the grammar che cks. Kiddie s, thanks fo r the play bre aks.

Foreword

O

n behalf o f everyo ne at Ado be Systems, Inc . and speaking fo r all tho se who are respo nsible fo r driving the suc c ess o f Ado be Go Live 5 in the pro fessio nal Web design c o mmunity, I wish to express my gratitude fo r the Herc ulean effo rt put fo rth by Debo rah Shado vitz, inc luding the suppo rtive c rew at IDG Bo o ks Wo rldwide, to make this impressive bo o k a reality fo r all to enjo y and learn fro m. I c an assure yo u that Debo rah’s writing effo rts required mo re than simply mastering all the features inc luded in Ado be Go Live 5 — itself a daunting task. Due to the nature o f the Web itself, writing abo ut Go Live requires a tho ro ugh understanding o f the c hallenges that Web designers c o nfro nt o n a daily basis, alo ng with bro wserc o mplianc e c o nsideratio ns, and c o ntemplating ho w Go Live 5’s many new and advanc ed features might be used to c reate engaging, dynamic Web sites. My thanks go to the many members o f the Go LiveTalk mail list as well as o ur Go Live Adviso ry Co unc il members and valued beta testers who shared their insights in helping us deliver this pro duc t. I enc o urage everyo ne to subsc ribe to the TalkList (see Chapter 4 fo r ho w to do this) and jo in the Ado be o nline Web c o mmunity at www.adobe.com, where yo u will find interesting Web design disc ussio n, inc luding many new tips and tec hniques in mastering the pro duc t. Here, yo u will also find Go Live Extensio ns and Ac tio ns to extend the po wer o f the applic atio n. At Ado be Systems, we are c o mmitted to develo ping a c o mprehensive set o f integrated pro fessio nal Web design to o ls. Our go al is to pro vide individuals and teams the greatest c reative freedo m and c o ntro l in mastering the Web design pro c ess. Ado be Go Live 5.0, amo ng its 100+ new features, inc ludes numero us inno vatio ns, inc luding an o nbo ard interac tive edito r fo r editing multimedia, “360Co de,” that pro vides c o mplete c o ntro l o ver any Web design so urc e c o de, superio r site planning and management, wo rkgro up c o llabo ratio n (inc luding “asset” sync hro nizatio n and c hec k-in and c hec k-o ut thro ugh WebDAV suppo rt), and “smart links” that pro vide drag-and-dro p o bjec t-sharing with o ther Ado be pro duc ts. What’s mo re, an integrated develo pment enviro nment that extends the Go Live feature set, plus advanc ed func tio nality suc h as Dynamic Link, to gether simplifies the inc o rpo ratio n o f dynamic database and e-c o mmerc e c apabilities. Go Live is best viewed as many-apps-in-o ne. Cases in po int are seven areas o f the pro duc t that I c o nsider standalo ne pro duc ts bec ause o f their feature set and level o f pro duc t integratio n: Pho to sho p’s Save Fo r Web image-o ptimizatio n engine, Quic kTime Edito r, JavaSc ript Edito r, JavaSc ript Debugger inc luded with the Go Live SDK, Site Design, Site Repo rting, and Go Live Dynamic Link fo r ASP. These are all extremely po werful applic atio ns built into the pro duc t. To gether, they help the serio us Web designer reac h new levels o f pro duc tivity.

x

Foreword

Mo ving fo rward as the Web evo lves, and thanks to the c o nstant feedbac k we rec eive fro m o ur c usto mers to enhanc e o ur pro duc ts, Ado be Systems will c o ntinue to address emerging tec hno lo gies and c hallenges that Web designers fac e, and translate these advanc es and c hallenges into c o mpelling new pro duc t features. I enc o urage yo u to submit yo ur feature wish-list requests to go livewishlist@ ado be.c o m; o ne o f my primary ro les in the o rganizatio n is to make sure yo ur wishes are ac ted upo n in future pro duc t releases. Witho ut the c o ntinuing suppo rt pro vided by o ur valued c usto mers, Ado be Systems wo uld be hard-pressed to deliver a c o mprehensive set o f integrated Web design to o ls that best meet yo ur needs. Thanks to feedbac k rec eived fo r Go Live and Ado be’s industry-standard Web design to o lset, whic h inc ludes Pho to sho p, Illustrato r, and LiveMo tio n, we are exc ited abo ut the future. Thanks fo r purc hasing this bo o k. With this bo o k’s expert guidanc e, I’m c o nfident yo ur wo rk using Ado be Go Live 5 will help pave the ro ad to suc c ess fo r yo ur pro fessio nal Web design effo rts.

John Kranz Senior Product Manager Adobe Systems, Inc.

Preface

W

hether yo u’re c o nsidering building o r taking o ver management o f yo ur first presenc e o n Wo rld Wide Web, o r whether yo u’re an o ld-timer who has been hand-c o ding Web pages sinc e the ric kety dawn o f the Internet, Go Live is written fo r yo u — and so is the Ado be Go Live 5 Bible . Like its namesake and to pic — Ado be Go Live — this bo o k is designed to be the ultimate to o l fo r c reating a Web site and go ing live with it o n the Web. Bo th c o uld also easily (if no t fo r c o pyright) go by the subtitle Staying Alive bec ause the key to suc c ess o n the Web is no t just getting yo ur site up there, but keeping it fresh. Go Live makes that easy, to o . Go Live is as easy to use after yo u publish yo ur site as it is to publish it in the first plac e. Built-in file transfer, c o mplete with inc remental uplo ad, enables yo u to enjo y the same easy-to -use visual design interfac e to update o r add to yo ur site. Yo u c an uplo ad any new o r c hanged pages with just two c lic ks (o r three by yo ur o wn preferenc e). Go Live was written with designers in mind so the interfac e is easy to use and is c o nsistent with Ado be’s o ther exc ellent design applic atio ns. At the same time, it ac c o mmo dates users who want to do serio us pro gramming within their page c o de. It was written fo r to day’s Web; with Go Live, adding all o f the po pular multimedia types is a c inc h, and it’s easy to make yo ur sites interesting and fun. There’s a lo t to Go Live, so there’s a lo t to this bo o k. This bo o k go es beyo nd just telling yo u ho w to use Go Live. It no t o nly explains what the vario us to o ls and c apabilities o f Go Live are, but sho ws yo u what eac h thing is fo r, and gives yo u an idea o f ho w yo u might use it. It even pro vides the materials yo u need to try vario us features o f Go Live and c apabilities o f the Web, so yo u do n’t have to sc ro unge aro und fo r sample files o r wo nder ho w so mething wo rks. Many o f these materials are waiting fo r yo u right o n the CD-ROM inc luded with this bo o k. Other materials are mo re appro priately available o n the Web so their addresses are no ted within the bo o k o r at www.golivebible.com, this bo o k’s c o mpanio n site — it is a c o nstantly gro wing reso urc e fo r yo u as yo u wo rk with Go Live and this bo o k. Welc o me to the wo rld o f Go Live, and to the Web if yo u’re new to that neighbo rho o d, to o .

xii

Preface

Is This Book for You? In sho rt, if yo u’re interested in c reating a Web site and like wo rking as effic iently as po ssible, this bo o k is fo r yo u. Are yo u a designer who ’s been asked by c lients to c reate Web sites? Go Live was c reated with designers in mind. I, and many o f the c o ntributo rs to this bo o k, share this bac kgro und with yo u. Yo u’ll find bo th Go Live and this bo o k are easy to identify with and use. Have yo u been hand-c o ding sites fo r years? If so , yo u deserve a break. Go Live’s site management puts an end to bro ken links and diffic ulty mo ving files. (If yo u use this bo o k and Go Live just fo r that o ne feature, yo u’ll free up ho urs in yo ur life. Then, while yo u’re at it, lo o k at the FTP features and win bac k so me mo re ho urs o f yo ur life.) Yo u do n’t have to alter yo ur existing sites o r pages to begin managing them in Go Live. Chapter 4 sho ws yo u ho w. In fac t, yo u c an c o ntinue to hand-c o de yo ur pages all the time, o r any time. Are yo u fairly new to the Web and wo ndering if a Web site is beyo nd yo u? It’s no t. Go Live is po werful and do es a lo t, but its palettes and windo ws are friendly and c o nsistent. I’ve been teac hing c o mputers to beginners fo r years and still remember my first years very well. I lo ve passing o n the po wer o f c o mputers and great so ftware, no t sho wing o ff my o wn kno wledge. My direc tio ns are simple and straightfo rward. I even tested them o n beginners. As lo ng as yo u c o mfo rtably kno w yo ur way aro und yo ur c o mputer (Windo ws o r Mac into sh), yo u’ll have no pro blem. The beauty o f a bo o k is that yo u c an read it and reread as yo u experiment. In additio n, this bo o k’s c o mpanio n Web site at www.golivebible.com has so me real-life pages yo u c an explo re and even lo o k at within Go Live to see ho w they are do ne.

GoLive’s System Requirements Written to be platfo rm-independent, this bo o k c o vers bo th Mac into sh and Windo ws 95/ 98/ NT versio ns o f Go Live 5. Ado be Systems has the fo llo wing system requirements fo r the so ftware:

M acintosh ✦ Po werPC-based Mac into sh c o mputer pro c esso r with CD-ROM drive ✦ OS Versio n 8.6 o r 9.0 ✦ 48MB o f available RAM (to enable all mo dules) ✦ 35MB o f available hard-disk spac e

Preface

Windows ✦ Intel Pentium 200 MHz (o r faster) o r c o mpatible pro c esso r with CD-ROM drive ✦ Mic ro so ft Windo ws 98, 2000, o r Windo ws NT 4.0 (o r later) with Servic e Pac k 4 ✦ 48MB o f available RAM fo r Windo ws 98, o r 64MB o f available RAM fo r Windo ws NT 4.0 (to enable all mo dules)

✦ 60MB o f available hard-disk spac e

How This Book Is Organized Mo re than 900 pages o f impo rtant info rmatio n c an be rather daunting to c o ntemplate, let alo ne digest, so I’ve divided the bo o k up into lo gic al parts. Co nsider this bo o k a Chinese restaurant menu fro m days o f o ld, where yo u c an c ho o se an item o r two fro m c o lumn A and ano ther fro m c o lumn B. Take what yo u need and pass o n the rest; it’ll still be there fo r yo u when yo u’re hungry fo r mo re later. Here’s what’s o n the menu.

Part I: Introducing GoLive 5 This part intro duc es yo u to the Go Live basic s. Here’s where I sho w yo u the fundamental to o ls yo u use to build yo ur presenc e o n the Web. Wo ndering what Go Live c an do fo r yo u? Wo ndering if it c an handle yo ur site? Here’s the answer. (Well, the answer is yes, but here are the details o f Go Live’s po werful site management and c reative design c apabilities.)

Part II: Starting to Build Your Site Ready to get started? This is the plac e to learn ho w. Whether yo u’re starting a new site fro m sc ratc h, c o nverting a site fro m ano ther applic atio n, o r bringing a handc o ded site into Go Live, this part c o vers the details o f ac tually starting yo ur site.

Part III: Adding Text, Graphics, and Links Whether yo u’ve go t pic tures to speak fo r yo u o r yo u’ve go t yo ur tho usands o f wo rds o n hand, this is the part that sho ws yo u ho w to deplo y them. As yo u c reate yo ur message, the linking tec hniques yo u learn here enable yo u to build yo ur site in earnest.

xiii

xiv

Preface

Part IV: Using GoLive’s Advanced Tools After yo u’ve go t the basic s do wn, yo u c an add a navigatio n bar, lo go , o r o ther mo re advanc ed feature to yo ur site using Go Live’s Co mpo nents, and jazz up yo ur interfac e with fanc y butto ns. Yo u c an also fo rmat yo ur pages with style sheets — a very go o d idea. Want to lay things o ut in tables o r use frames to present yo ur site? That’s here to o . This is the plac e to learn ho w to really take c o ntro l o f yo ur pages and get the fo rmatting just right.

Part V: Adding M ultimedia, M ovement, and Interactivity Here’s where the Web bec o mes fun. This part sho ws yo u ho w to add video , animatio n, o r so und files to yo ur site. It’s also where yo u learn abo ut using Dynamic HTML (DHTML) to add mo vement to yo ur site witho ut video files. Want to make o ne o f tho se c o o l effec ts where text o r images magic ally appear when the mo use ro lls o ver a sc reen element? That’s DHTML — and this is the plac e fo r learning ho w to do it. The basic s in Part III are a prerequisite to this part.

Part VI: Going Live —The Final Touches After yo ur pages are c o mplete, c o me here to learn ho w to add so me pro fessio nal to uc hes that’ll help yo ur site be fo und — and help visito rs find what they seek at yo ur site. Then learn abo ut o ptimizing yo ur site fo r delivery o n the Web. This part sho ws yo u ho w to po lish yo ur site in a variety o f ways. It’s also where yo u’ll learn ho w to get yo ur site o nto a server — to go live with it.

Part VII: Using GoLive’s Advanced Site-Planning Tools A site’s no t very lively if yo u c an’t easily make c hanges to it after it’s live. Go Live makes updating a c inc h. I sho w yo u ho w to do it right here. After yo u get all the basic s o f site design do wn, and kno w the po wer o f Go Live, yo u may want to bec o me part o f a design team — perhaps a team that presents design ideas to c lients, o r an internatio nal design team with c o designers all o ver the wo rld. Tho se po werful high-end pro fessio nal design features are the subjec t o f this part, to o .

Appendixes At the bac k o f this bo o k yo u’ll find Appendix A, whic h tells yo u abo ut everything that is o n the CD-ROM. In additio n, yo u’ll find fo ur additio nal appendixes o n the CD-ROM, all c o ntaining valuable bo nus material that I c o uldn’t squeeze into the bo o k. In tho se appendixes yo u c an intro duc e yo urself to the JavaSc ript language, read abo ut ho w fo rms c o mmunic ate, learn ho w to set up an e-c o mmerc e site, and disc o ver great info rmatio n abo ut extend sc ripts and the Go Live SDK.

Preface

Conventions This Book Uses I use the fo llo wing c o nventio ns thro ugho ut this bo o k.

Windows and M acintosh conventions The Ado be Go Live 5 Bible is a c ro ss-platfo rm bo o k. As a result, I give yo u instruc tio ns fo r bo th platfo rms whenever there’s a platfo rm differenc e. In the c ase o f the keybo ard, where the differenc e is a c o nstant, I’ve merged the c o mmands to make reading easier. Here’s what yo u c an expec t:

✦ On yo ur keybo ard, if yo u’re using Windo ws, o r perhaps a third-party Mac keybo ard, yo u’ll have the wo rd “Enter” o n the key that sends the c urso r to the next line. Ho wever, o n the Mac keybo ard, yo u’ll have “Return.” Wherever this key is mentio ned, it appears as “Enter/ Return.”

✦ The key that deletes text that c o mes befo re the c urso r is c alled Bac kspac e in Windo ws, but Delete o n the Mac . This key is sho wn as Bac kspac e/ Delete. Keybo ard sho rtc uts c an be great time savers so I want yo u to be able to identify the sho rtc ut yo u need quic kly. Fo llo wing the Mac and Windo ws interfac es yo u’re familiar with, I use a hyphen between Mac keys and a plus sign to sho w Windo ws keys. Fo r example, this is what the sho rtc ut to c reate a link lo o ks like: Ô-L (Mac ) and Alt+L (Windo ws).

M enu commands To sho w yo u where yo u c an selec t a c o mmand fro m a menu, I put the menu name first, fo llo wed by an arro w po inting to the spec ific c o mmand. Fo r example, to tell yo u to o pen Go Live’s Inspec to r windo w fro m the Windo w menu, I say to c ho o se Windo w ➪ Inspec to r. Where the c o mmand to be c ho sen is a submenu o f a main menu c o mmand, yo u’ll see eac h c o mmand separated by an arro w. Fo r example, to tell yo u to o pen a new site by c ho o sing Blank fro m the New Site submenu under the File menu, I say to c ho o se File ➪ New Site ➪ Blank.

M ouse instructions On bo th Windo ws and Mac , c lic king an item is a main way o f selec ting an o bjec t. To c lic k an item, mo ve the mo use until the tip o f the arro w po inter to uc hes the o bjec t, and then c lic k the mo use butto n o ne time. With the Windo ws mo use, yo u c lic k the left mo use butto n. When an o bjec t is selec ted, its c o lo r inverts, o r it bec o mes the c o lo r yo u’ve selec ted in yo ur o perating system’s Co ntro l Panel. To selec t mo re than o ne item, selec t the first, press the Shift key, and then c lic k the next o bjec t while yo u ho ld

xv

xvi

Preface

do wn the Shift key. To mo ve selec ted items, keep the mo use do wn after the item (o r last item) is selec ted, and then drag the mo use until the item is in the desired lo c atio n. Then release the mo use. Clic k in a blank area o f yo ur page o r windo w to deselec t the selec ted items so yo u do n’t inadvertently issue ano ther c o mmand to them. Go Live is replete with a full set o f c o ntextual menu c o mmands. A c o ntextual menu is o ne that c o nsists o nly o f c o mmands that are appro priate fo r the item yo u’re po inting at as yo u c all up the menu. Fo r example, when po inting to a c ell in a table, o ne available c o mmand is Selec t Cell. But if yo u po int to a file in the Site Windo w, there is no c ell to selec t so the Selec t Cell c o mmand is no t available. To c all up a c o ntextual menu in Windo ws, c lic k the right mo use butto n. Mac s use a o ne-butto n mo use, so yo u press the Co ntro l key as yo u c lic k the mo use butto n to pro duc e a c o ntextual menu. In this bo o k yo u’ll see the wo rds “Co ntro l-c lic k (Mac ) o r right-c lic k (Windo ws)” to desc ribe this pro c ess. (But just so it do esn’t get to o bo ring, so metimes I’ll simply tell yo u to c all up the c o ntextual menu.)

Typographical conventions I use italic type fo r new terms and fo r emphasis, and boldface type fo r text that yo u need to type direc tly fro m the c o mputer keybo ard.

Code A spec ial typefac e indic ates HTML o r o ther c o de, as demo nstrated by the fo llo wing example:

Welcome to Adobe GoLive 5

GoLive 5!

This bo o k also uses the same c o de fo nt within paragraphs to designate HTML tags (suc h as ), attributes, and values. All HTML tags are presented in lo werc ase, whic h is the c urrent standard fo r HTML c o ding and the way Go Live generates HTML.

Tools of the Trade I wro te this bo o k o n an Apple Mac into sh 7600, running as a 450 MHz G3, thanks to an XLR8 upgrade c ard, with an Inside Out Netwo rks USB c ard and hub and a Swann FireWire c ard. It was bac ked up to a VST FireWire hard drive using Dantz Retro spec t

Preface

so ftware. I ran Go Live o n a variety o f mac hines, predo minately a Windo ws PC running Windo ws 98, a G3 Mac running OS 8.6, my o wn 7600 (as a G3), and even using Virtual PC running Windo ws 98 o n the beige G3. EarthLink’s DSL servic e kept tho se many beta versio ns c o ming in and bo o k files flying ac ro ss the Internet. All mac hines had DSL Internet c o nnec tivity thanks to an Xsense XRo uter Pro . Bac kup dial-up ac c ess was via a Swann Mac 2k USB v.90 mo dem. Typing was do ne with the help o f TypeIt4Me and SpellCatc her. The Mac and VPC sc reen sho ts were taken using Snapz Pro while the Windo ws sho ts were do ne with Snag-It. Fo r mo re hardware and so ftware details, see www.golivebible.com.

Navigating Through This Book This bo o k is presented to yo u in sho rt paragraphs so they’re easy to fo llo w. In many c ases, numbered steps are o utlined to help yo u pro c eed. In additio n, the fo llo wing ic o ns guide yo u to so me extra spec ial fac ts: Tip

Expert Tip

Note

Tips provide the secrets of true pow er. This icon helps point these pow ers out to you.

In the spirit of the Internet, several experts share their tips w ith you. Look for this icon to learn from a variety of Web professionals.

Notes point out som ething extra of interest that you should, w ell, take note of.

CrossReference

This icon is the hyperlink of the Adobe GoLive 5 Bible; it lets you know w here you can find m ore inform ation about a topic (although clicking it w on’t do m ore than produce a pretty sound).

New Feature

If you’re already a GoLive user and you’re w ondering w here a m enu or capability w ent, w atch for these icons to save your sanity.

On the CD-ROM

The CD-ROM icon lets you know about som ething on the CD-ROM that com es w ith this book.

Caution

Once in a w hile there’s som ething you need to be careful about.

xvii

xviii

Preface

Where Should I Start? If yo u are new to Go Live, I rec o mmend yo u start at the very beginning with Chapters 1 and 2. These c hapters pro vide the fo undatio n fo r understanding Go Live’s interfac e. Fro m there, yo u c an mo ve to Chapter 4 so yo u c an start yo ur site. Then c o nsider fo llo wing the o rder o f the c hapters in Part III, as they build the basic kno wledge yo u’ll need to c reate yo ur site. Fro m there, jump to the c hapter in Part IV o r V that pro vides what yo u need. Finally, use Part VI to take yo ur site live. If yo u’re upgrading fro m a previo us versio n o f Go Live, Chapter 2 po ints o ut the Site Windo w, menu, and windo w c hanges, saving yo u a bit o f hunting. (And Chapter 1 may pro ve useful; yo u may disc o ver ano ther strength yo u didn’t even kno w Go Live had.) After tho se intro duc to ry c hapters, yo u c an skip direc tly to the c hapter that c o vers the task at hand.

Acknowledgments

F

irst, thanks to the fo lks at IDG Bo o ks Wo rldwide. This bo o k wo uld simply no t exist if no t fo r Mic hael Ro ney. It was Mike who rec o gnized the need fo r this bo o k in the Internet c o mmunity, pro po sed it to his IDG Bo o ks teammates, and then o versaw the entire pro c ess o f getting it into yo ur hands. I’ve had the ho no r o f wo rking with Mike befo re (o n the Macwo rld Office 98 Bible ) and am ho no red that he remembered my lo ve o f Go Live and pic ked me as the perso n to c o mplete his visio n o f this bo o k. Mike is always there to run an idea by, whic h enabled me to do so mething very different in this bo o k: bring in vario us Go Live, visual, and Internet experts to pro vide yo u with what we’ve dubbed “Expert Tips.” Thanks Mike, fo r seeing Go Live’s po wer and believing in me to c reate this bo o k. Thanks to Chris Jo hnso n fo r his patienc e, c reative appro ac hes to pro blem-so lving, and pro jec t c o o rdinatio n. My apprec iatio n go es to Mic hael Welc h, Dennis Weaver, Laura Sto ne, Cindy Lai, Lane Barnho ltz, and Julie Mo ss fo r their exc ellent c o pyediting wo rk. And thanks, to o , to the entire pro duc tio n staff at IDG Bo o ks fo r expert layo ut and design. Thanks also to Linda Turno wski and Mic hael Christo pher fo r their help alo ng the way. Thanks to Debbie Gates fo r her file transfer suppo rt and to Stephanie Ro driguez and Sandy Ro drigues. Thanks to the entire really c o o l Ado be Go Live team. They no t o nly c reated this amazing applic atio n, but also did their best to be available to answer questio ns, listen to (and implement!) feature requests, and wo rk thro ugh wo rk-flo w tho ughts. Spec ial thanks to Jens Neffe, Lanc e Lewis, Lars Peters, Vero nika Sc hlic k, Sebastian Dimpker, Jan Sto ec kmann, Ro bert Mc Daniels, and Sam Hui. A standing o vatio n fo r Irv Kano de and Matt Ridley. Bo y, did Irv and Matt ever answer the c all — no matter what I asked fo r. Also thanks to Kim Platt and Daniel Bro wn. And mo st o f all, thanks to Jo hn (jfk) Kranz, Go Live pro duc t manager, fo r, well, so o o muc h. Thanks also to my agent Christian Crumlish fo r making this pro jec t po ssible fo r me and fo r keeping me go ing when c o vering all o f Go Live’s po wer seemed endless. Thanks to LA Bridge, an exc ellent Lo s Angeles ISP, fo r ho sting www.golivebible.com during the bo o k’s c reatio n pro c ess. Thanks to Mo rdec hai Kamo rnic k and Jeff Klein, to Sheri and Mario Salinas, Mark Treitel, and to Cathy Sc rivno r fo r c o ming to my resc ue aro und the c lo c k whenever I needed equipment o r so meo ne to kic k a tho ught aro und with. To Mo e Wo dnic ki fo r the ho use c all to keep my HP 4M printing. Thanks to the helpful guys o f the Web405 list: Kynn Bartlett, Jo e Crawfo rd, and Mark Jaress.

xx

Acknowledgments

Thanks to the genero us c o ntributio ns o f the talented peo ple who have pro vided materials fo r yo u to wo rk with o n the CD-ROM. (Yo u c an learn mo re abo ut these materials in Appendix A.) This bo o k has o ne name o n the c o ver, but many great names inside, so a great big thanks to peo ple who went all o ut reviewing my c hapters, trying o ut servic es suc h as WebDAV with me, and writing up so me o f their Expert Tips o r verifying my o wn tips:

✦ Sheri and Mario Salinas and Cathy Sc rivno r fo r the o utline and flo w o f the bo o k, and fo r help testing WebDAV and learning its intric ac ies.

✦ Ric hard Mc Lean fo r writing half o f Chapter 2, and do ing the entire update o f Chapter 16 and the fo rms appendix. Yo u wo n’t see his name there o ften but his wo rds are sure there.

✦ Oliver Zaho rka fo r his many c o ntributio ns to Chapters 15 and 22 and the JavaSc ript appendix. Also fo r the WebDAV server. And fo r the bo nus OUTac tio ns!

✦ Ro b Keniger, first fo r writing all the SDK appendix. Next, fo r adding the new fo rms variables info rmatio n to Chapter 16. And also fo r his additio ns and verific atio ns in Chapters 11, 17, 18, 22, and 30.

✦ Steven Shmerler fo r fully updating Chapter 10 and adding his graphic expertise and fo r his many c o ntributio ns to Chapter 13.

✦ Pete Zimo wski fo r do ing so muc h in Chapters 11, 25, and 26. ✦ Ken Martin, GREP guru, fo r his c o ntributio ns to Chapters 3, 14, and 25. ✦ Do ug Fairc hild fo r making Appendix D shine. And to Mark Tiextera fo r his e-c o mmerc e help.

✦ Lynne LaMaster fo r her c o ntributio ns to Chapters 6 and 10. And to her so n, Do ug LaMaster, fo r his Flash and LiveMo tio n images.

✦ Jeep Hauser fo r the WebDAV server and testing. ✦ Bo b Stein fo r his c o lo r-o n-the-Web sidebars. ✦ Also to Beate de Nijs, Nini Tjäder, and Frederic o Russo , fo r misc ellaneo us Go Live details. And to David Shado vitz, my middleware guru.

✦ Mo re thanks to Cathy Sc rivno r fo r writing all o f Chapter 24, and her c o unseling and testing o n every o ther c hapter as well, partic ularly o n Chapter 19. Cathy adds: Thanks to Brian So o y, Sc o tt Myers, Frederic o Russo , and Paul Ferguso n fo r helping her o ut with the intric ac ies o f Dynamic Link, espec ially during tho se c razy beta days when o ne never knew whic h part o f the puzzle was missing fro m beta to beta. And to Bernard Questel fo r teac hing the finer details o f Ac c ess. And thanks to Ric hard Gaskin, fo r his ro le as o ffic ial tec hnic al reviewer.

Contents

Contents at a Glance Fo rewo rd . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ix Prefac e . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xi Ac kno wledgments . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xix

Part I: Introducing GoLive 5

. . . . . . . . . . . . . . . . . . . . . . . . . 1

Chapter 1: Intro duc ing Go Live’s Features . . . . . . . . . . . . . . . . . . . . . . . . 3 Chapter 2: Getting to Kno w Go Live’s Interfac e . . . . . . . . . . . . . . . . . . . . 19 Chapter 3: Viewing and Editing HTML . . . . . . . . . . . . . . . . . . . . . . . . . 65 Chapter 4: Getting Help . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87

Part II: Starting to Build Your Site . . . . . . . . . . . . . . . . . . . . 101 Chapter 5: Starting Yo ur Web Site . . . . . . . . . . . . . . . . . . . . . . . . . . . 103 Chapter 6: Setting Up Yo ur First Page . . . . . . . . . . . . . . . . . . . . . . . . . 127 Chapter 7: Using a Grid as a Layo ut To o l . . . . . . . . . . . . . . . . . . . . . . . 153

Part III: Adding Text, Graphics, and Links . . . . . . . . . . . . . . . . 189 Chapter 8: Entering and Fo rmatting Text . . . . . . . Chapter 9: Creating and Fo rmatting Lists . . . . . . Chapter 10: Putting Images o n Yo ur Pages . . . . . . Chapter 11: Adding Navigatio nal Links to Yo ur Page

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

191 237 251 299

Part IV: Using GoLive’s Advanced Tools . . . . . . . . . . . . . . . . . 343 Chapter 12: Making Image Maps and Using Advanc ed Links . Chapter 13: Creating and Laying Out Tables . . . . . . . . . . Chapter 14: Creating Reusable Co mpo nents, Items, and Text Chapter 15: Designing Yo ur Page with Frames . . . . . . . . . Chapter 16: Adding a Fo rm to Yo ur Site . . . . . . . . . . . . Chapter 17: Refining Yo ur Web Pages with Style Sheets . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

345 369 413 437 475 517

Part V: Adding M ultimedia, M ovement, and Interactivity . . . . . . 567 Chapter 18: Applying Go Live’s JavaSc ripts: Ac tio ns and Chapter 19: Adding Spec ial Effec ts and Animatio n . . . Chapter 20: Adding Audio and Video . . . . . . . . . . . Chapter 21: Creating Quic kTime Mo vies in Go Live . . .

Smart Objec ts . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . .

. . . .

. . . .

. . . .

. . . .

569 625 667 703

xxi

xxii

Contents

Chapter 22: Creating Yo ur Own JavaSc ripts . . . . . . . . . . . . . . . . . . . . . 749 Chapter 23: Adding Java Applets to Yo ur Page . . . . . . . . . . . . . . . . . . . 773 Chapter 24: Using Dynamic Link . . . . . . . . . . . . . . . . . . . . . . . . . . . . 785

Part VI: Going Live —The Final Touches . . . . . . . . . . . . . . . . . 809 Chapter 25: Optimizing and Pro blem-So lving . . . . . . . . . . . . . . . . . . . . 811 Chapter 26: Po lishing Yo ur Web Pages . . . . . . . . . . . . . . . . . . . . . . . . 865 Chapter 27: Publishing Yo ur Web Site . . . . . . . . . . . . . . . . . . . . . . . . . 887

Part VII: Using GoLive’s Advanced Site-Planning Tools . . . . . . . . 913 Chapter 28: Updating Yo ur Site . . . . . . . . . . . . . . . . . . . . . . . . . . . . 915 Chapter 29: Using the Site Designer . . . . . . . . . . . . . . . . . . . . . . . . . . 933 Chapter 30: Autho ring with WebDAV . . . . . . . . . . . . . . . . . . . . . . . . . 975 Appendix A: What’s o n the CD-ROM . . . . . . . . . . . . . . . . . . . . . . . . . 1019

Bonus Appendixes . . . . . . . . . . . . . . . . . . . . . . On the CD-ROM Appendix Appendix Appendix Appendix

B: Intro duc ing the JavaSc ript Language C: Ho w Fo rms Co mmunic ate D: Understanding the E-c o mmerc e Puzzle E: Extend Sc ript and the Go Live SDK

Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1029 End-User Lic ense Agreement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1058 CD-ROM Installatio n Instruc tio ns . . . . . . . . . . . . . . . . . . . . . . . . . . . 1062

Contents

Contents Forew ord . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ix Preface. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xi Acknow ledgm ents . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xix

Part I: Introducing GoLive 5

1

Chapter 1: Introducing GoLive’s Features . . . . . . . . . . . . . . . . . 3 Intro duc ing the Go Live Web Site Creatio n To o l . . . . . . . . . . . . . . . . . 4 Taking a Quic k To ur o f the Go Live Interfac e . . . . . . . . . . . . . . . . . . . 5 Using Go Live . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6 Go Live is fo r beginners . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 Go Live is fo r designers . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8 Go Live is fo r hand-c o ders . . . . . . . . . . . . . . . . . . . . . . . . . . 9 Go Live is fo r sc ripto rs and develo pers . . . . . . . . . . . . . . . . . . 10 Go Live is fo r pro jec t managers . . . . . . . . . . . . . . . . . . . . . . 11 Go Live is fo r large pro jec ts . . . . . . . . . . . . . . . . . . . . . . . . . 11 Rec yc ling with Go Live . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Creating Multimedia and Interac tive Pages . . . . . . . . . . . . . . . . . . . 13 Creating Fo rms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15 Trac king Yo ur Wo rk in Go Live . . . . . . . . . . . . . . . . . . . . . . . . . . 15 Taking Yo ur Site Live with Ease . . . . . . . . . . . . . . . . . . . . . . . . . . 17

Chapter 2: Getting to Know GoLive’s Interface . . . . . . . . . . . . . 19 Meeting the Go Live Visual Team . . . . . . . . . . . Disc o vering the Site Windo w . . . . . . . . . . . . . The main part o f the Site Windo w . . . . . . . Viewing the “hidden” part o f the Site Windo w Custo mizing the Site Windo w . . . . . . . . . Explo ring the Palettes . . . . . . . . . . . . . . . . . The Inspec to r . . . . . . . . . . . . . . . . . . The Objec ts palette . . . . . . . . . . . . . . . The Co lo r palette . . . . . . . . . . . . . . . . The Co lo r palette’s tabs . . . . . . . . . . . . Markup Tree palette . . . . . . . . . . . . . . . Table palette . . . . . . . . . . . . . . . . . . . Histo ry palette . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

. . . . . . . . . . . . .

19 23 26 32 35 36 36 38 40 41 45 46 46

xxiii

xxiv

Contents

So urc e Co de palette . . . . Transfo rm palette . . . . . Align palette . . . . . . . . The To o lbar . . . . . . . . . . . . The Page Windo w . . . . . . . . Layo ut view . . . . . . . . . So urc e view . . . . . . . . . The Outline Edito r . . . . . Preview view . . . . . . . . Organizing Files . . . . . . . . . . Mo ving files within the Site Intro duc ing Po int and Sho o t . . Organizing Yo ur Sc reen . . . . . Previewing Yo ur Page . . . . . . File Transfer . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Windo w . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

47 47 48 48 49 50 52 52 53 55 57 58 60 61 62

Chapter 3: Viewing and Editing HTM L . . . . . . . . . . . . . . . . . . . 65 Viewing and Wo rking in So urc e Co de Using the So urc e Co de windo w Using the HTML So urc e Edito r . Intro duc ing Outline View . . . . . . . Expanding and c o llapsing tags . Selec ting tags . . . . . . . . . . . Viewing images . . . . . . . . . . Editing yo ur page . . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

. . . . . . . .

65 66 69 75 77 79 80 81

Chapter 4: Getting Help . . . . . . . . . . . . . . . . . . . . . . . . . . . 87 Using Onsc reen Labels . . . . . . . . . . . . Finding Onsc reen Help . . . . . . . . . . . . Seeking help by c o ntent listing . . . . Seeking help using the Index . . . . . . Seeking help using Searc h . . . . . . . Printing a Help page . . . . . . . . . . . Bo o kmarking a Help page . . . . . . . . Co pying Help text . . . . . . . . . . . . Quitting Help . . . . . . . . . . . . . . . Lo o king fo r Other Ado be Help . . . . . . . . Suppo rt . . . . . . . . . . . . . . . . . . Do wnlo adables . . . . . . . . . . . . . . Registratio n . . . . . . . . . . . . . . . Ado be Links . . . . . . . . . . . . . . . Ado be Online . . . . . . . . . . . . . . . Searc hing fo r Helpful Reso urc es o n the Web Independent Go Live reso urc es . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

87 88 88 90 91 92 92 93 93 93 93 93 94 94 94 94 94

Contents

HTML help reso urc es . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95 General Web site develo pment help . . . . . . . . . . . . . . . . . . . . 96 Ac c essibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98 Legal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99 Marketing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100

Part II: Starting to Build Your Site

101

Chapter 5: Starting Your Web Site . . . . . . . . . . . . . . . . . . . . 103 Starting a New Site . . . . . . . . . . . . . . . . . . . Beginning a blank site . . . . . . . . . . . . . . Beginning a new site based o n a template . . Impo rting an Existing Site . . . . . . . . . . . . . . . Impo rting a site fro m a lo c al drive . . . . . . . Do wnlo ading a Web site fro m a remo te server Adding Pages to Yo ur Site . . . . . . . . . . . . . . . Adding pages in Navigatio n view . . . . . . . . Adding pages to the Files tab . . . . . . . . . . Saving Yo ur Site . . . . . . . . . . . . . . . . . . . . . Deleting Pages . . . . . . . . . . . . . . . . . . . . . . Resto ring Deleted Files . . . . . . . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

103 103 107 108 109 112 116 116 118 122 122 125

Chapter 6: Setting Up Your First Page . . . . . . . . . . . . . . . . . . 127 Opening a Page . . . . . . . . . . . . . . . . . . . . . Opening the Page Inspec to r . . . . . . . . . . . Naming yo ur page . . . . . . . . . . . . . . . . Adding Bac kgro und and Text Co lo rs . . . . . . . . . Setting a bac kgro und c o lo r . . . . . . . . . . . Using an image fo r yo ur bac kgro und . . . . . Cho o sing yo ur text and link c o lo rs . . . . . . Setting Page Margins . . . . . . . . . . . . . . . . . . Saving Yo ur Page . . . . . . . . . . . . . . . . . . . . Saving a page o pened fro m the Site Windo w . Saving a new page o pened fro m the file menu Setting the Publish status . . . . . . . . . . . . Reusing Yo ur Page . . . . . . . . . . . . . . . . . . . Making yo ur page the default new page . . . . Saving a page as Statio nery . . . . . . . . . . . Editing Statio nery . . . . . . . . . . . . . . . . Sharing Statio nery between sites . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . .

128 128 129 132 132 134 138 141 142 142 143 144 145 146 147 150 151

xxv

xxvi

Contents

Chapter 7: Using a Grid as a Layout Tool . . . . . . . . . . . . . . . . 153 Intro duc ing the Layo ut Grid . . . . . . . . . . . Why use a layo ut grid? . . . . . . . . . . Tips fo r plac ing a grid . . . . . . . . . . . Adding a layo ut grid to yo ur page . . . . Remo ving the default page margins . . . Resizing a Grid . . . . . . . . . . . . . . . . . . Resizing the layo ut grid visually . . . . . Resizing the layo ut grid numeric ally . . . Aligning a Layo ut Grid . . . . . . . . . . . . . . Setting a grid’s alignment . . . . . . . . . Aligning a grid o n a line . . . . . . . . . . Aligning a grid within a table . . . . . . . Aligning a grid o n ano ther grid . . . . . . Setting Up a Layo ut Grid’s Lines . . . . . . . . Adding a Bac kgro und Co lo r to a Layo ut Grid . Plac ing Text o n a Grid . . . . . . . . . . . . . . Adding a text bo x . . . . . . . . . . . . . . Resizing a text bo x . . . . . . . . . . . . . Repo sitio ning a text bo x . . . . . . . . . . Adding text to a text bo x . . . . . . . . . Adding a bac kgro und c o lo r to a text bo x Using Objec ts o n the Grid . . . . . . . . . . . . Plac ing o bjec ts o n the grid . . . . . . . . Resizing o bjec ts o n the grid . . . . . . . Aligning o bjec ts o n the grid . . . . . . . . Gro uping o bjec ts . . . . . . . . . . . . . . Optimizing a Layo ut Grid . . . . . . . . . . . . Tables to Grids and Bac k Again . . . . . . . . . Co nverting a table into a grid . . . . . . . Co nverting a grid into a table . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Part III: Adding Text, Graphics, and Links

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

153 154 155 157 158 159 159 163 163 164 166 167 167 168 169 171 171 172 173 174 175 176 177 179 181 185 186 186 186 187

189

Chapter 8: Entering and Formatting Text . . . . . . . . . . . . . . . . 191 Adding Text . . . . . . . . . . . . . . . Editing Text . . . . . . . . . . . . . . . Intro duc ing the Text to o lbar . . Selec ting text . . . . . . . . . . . Cutting and c o pying text . . . . Using different editing metho ds Clearing text . . . . . . . . . . . Duplic ating text bo xes . . . . . . Setting Up Headers . . . . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

192 194 194 195 196 197 198 198 198

Contents

Adjusting Fo nt Sizes . . . . . . . . . . . . . . . Fo rmatting Paragraphs . . . . . . . . . . . . . . Creating paragraphs . . . . . . . . . . . . Creating blo c k quo tes . . . . . . . . . . . Indenting paragraphs (o r o ther lines) . . Inserting spac e between paragraphs . . Co ntro lling Lines . . . . . . . . . . . . . . . . . Inserting line breaks . . . . . . . . . . . . Preventing line breaks . . . . . . . . . . . Aligning Text . . . . . . . . . . . . . . . . . . . . Adding Pizzazz to Wo rds with Fo nt Styles . . . Changing Fo nt Co lo rs . . . . . . . . . . . . . . . Using Fo nt Sets . . . . . . . . . . . . . . . . . . Creating fo nt sets . . . . . . . . . . . . . . Sto ring fo nt sets in the Site Windo w . . . Using a fo nt set . . . . . . . . . . . . . . . Sharing o r transferring a fo nt set . . . . . Editing fo nt sets . . . . . . . . . . . . . . Remo ving unused fo nt sets . . . . . . . . Using Spec ial Text Charac ters . . . . . . . . . . Chec king Yo ur Spelling . . . . . . . . . . . . . . Editing yo ur perso nal spelling dic tio nary

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . .

200 203 203 204 205 207 210 210 211 212 215 218 220 221 223 226 227 228 231 232 233 235

Chapter 9: Creating and Formatting Lists . . . . . . . . . . . . . . . . 237 Intro duc ing Ordered and Uno rdered Lists Creating Lists . . . . . . . . . . . . . . . . Creating a list as yo u type . . . . . . Creating a list fro m existing text . . Wo rking with pasted lists . . . . . . Turning a list bac k into plain text . Applying list styles . . . . . . . . . . Bulleted list styles . . . . . . . . . . Numbered list styles . . . . . . . . . Setting up Definitio n Lists . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

237 238 240 241 243 244 244 245 245 248

Chapter 10: Putting Images on Your Pages . . . . . . . . . . . . . . . 251 Understanding Images o n the Web . . . . . Graphic fo rmats — A quic k o verview Co llec ting Images in the Site Windo w . . . Co llec ting images . . . . . . . . . . . . Organizing yo ur images . . . . . . . . Previewing Images . . . . . . . . . . . . . . File Preview . . . . . . . . . . . . . . . Page Preview . . . . . . . . . . . . . . Previewing an image file . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

251 252 255 255 256 257 257 257 258

xxvii

xxviii

Contents

Plac ing an Image by Dragging . . . . . . . . . . . . . . . . . Dragging an image fro m the Files tab . . . . . . . . . Dragging a previewed image . . . . . . . . . . . . . . Adding an Image by Using a Plac eho lder . . . . . . . . . . Po inting and Sho o ting an image fro m a plac eho lder . Using the plac eho lder and Image Inspec to r . . . . . Dragging a file direc tly o nto a page . . . . . . . . . . Plac ing Slic ed Images . . . . . . . . . . . . . . . . . . . . . . Plac ing slic ed images manually . . . . . . . . . . . . . Adding a prefo rmatted slic ed image . . . . . . . . . . One mo re way to add a prefo rmatted slic ed image . Using Thumbnails . . . . . . . . . . . . . . . . . . . . . . . . Creating a Lo w-Reso lutio n Image . . . . . . . . . . . . . . . The built-in pro gressive effec t . . . . . . . . . . . . . The < lo wsrc > pro gressive effec t . . . . . . . . . . . . Arranging Images o n Yo ur Page . . . . . . . . . . . . . . . . Resizing an image . . . . . . . . . . . . . . . . . . . . Aligning an image . . . . . . . . . . . . . . . . . . . . . Wrapping text aro und an image . . . . . . . . . . . . Setting Yo ur Images Apart fro m Yo ur Page . . . . . . . . . Creating a bo rder . . . . . . . . . . . . . . . . . . . . . Adding spac e aro und an image . . . . . . . . . . . . . Editing o r Deleting an Image . . . . . . . . . . . . . . . . . . Editing existing o ptimized Images . . . . . . . . . . . Changing file mapping . . . . . . . . . . . . . . . . . . Using Smart Objec ts . . . . . . . . . . . . . . . . . . . . . . Wo rking with Smart Objec ts . . . . . . . . . . . . . . Using Smart Links . . . . . . . . . . . . . . . . . . . . Changing settings o f a Web-ready image . . . . . . . Sto ring yo ur Smart Objec t files . . . . . . . . . . . . . Trac ing Images . . . . . . . . . . . . . . . . . . . . . . . . . Impo rting Pho to sho p Layers as HTML . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

259 259 260 262 262 264 266 267 269 271 272 273 273 274 274 276 276 278 279 281 281 281 283 283 284 287 289 290 293 294 294 297

Chapter 11: Adding Navigational Links to Your Page . . . . . . . . . 299 The Fo ur Basic Links . . . . . . . . . . . . . . . . . . . . . . . . Linking fro m o ne page to ano ther page within yo ur site Linking to a page o utside o f yo ur site . . . . . . . . . . . Linking to ano ther po int within yo ur page . . . . . . . . Linking to a spec ific po int o n a separate page . . . . . . Creating Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . Abso lute and relative paths . . . . . . . . . . . . . . . . . Other ways to c reate links between pages . . . . . . . . Linking to Spec ific Parts o f a Page Using Anc ho rs . . . . . . . Creating an anc ho r o n the fly . . . . . . . . . . . . . . . . Linking to an anc ho r . . . . . . . . . . . . . . . . . . . . . Testing anc ho r links . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

. . . . . . . . . . . .

300 300 300 303 304 304 311 313 314 315 317 320

Contents

Using Externally Created Pages . . . . . . . . . . . . . . . . . Using LiveMo tio n o r ImageStyler . . . . . . . . . . . . . Using PDF files . . . . . . . . . . . . . . . . . . . . . . . Using SWF o r Direc to r pages . . . . . . . . . . . . . . . Quic kTime mo vies . . . . . . . . . . . . . . . . . . . . . Co llec ting URLs and E-mail Addresses . . . . . . . . . . . . . Gathering URLs and e-mail addresses fro m yo ur pages Manually adding a URL o r e-mail address . . . . . . . . Other ways to add addresses . . . . . . . . . . . . . . . Organizing URLs and addresses . . . . . . . . . . . . . Extending E-mail Links . . . . . . . . . . . . . . . . . . . . . . Adding to yo ur e-mail link using standard HTML . . . Adding to an e-mail link using a Go Live Ac tio n . . . . . Updating e-mail addresses . . . . . . . . . . . . . . . . Reviewing and Changing Links in the In & Out Links Palette Verifying and Repairing Links . . . . . . . . . . . . . . . . . . Changing a Link . . . . . . . . . . . . . . . . . . . . . . . . . . Using the In & Out Links palette . . . . . . . . . . . . . Changing all referenc es . . . . . . . . . . . . . . . . . . Creating a Do wnlo adable File . . . . . . . . . . . . . . . . . . Editing and Remo ving Links . . . . . . . . . . . . . . . . . . . Editing a Link . . . . . . . . . . . . . . . . . . . . . . . . Remo ving part o f a text link . . . . . . . . . . . . . . . . Remo ving a link c o mpletely . . . . . . . . . . . . . . . . Remo ving a graphic link . . . . . . . . . . . . . . . . . . Remo ving anc ho r links . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

Part IV: Using GoLive’s Advanced Tools

. . . . . . . . . . . . . . . . . . . . . . . . . .

320 320 320 321 323 323 323 324 326 328 328 329 331 332 333 334 337 337 338 339 340 340 341 342 342 342

343

Chapter 12: M aking Image M aps and Using Advanced Links . . . . 345 Intro duc ing Image Maps . . . . . . . . . . Starting an Image Map . . . . . . . . . . . Defining Regio ns . . . . . . . . . . . . . . Using the Rec tangle to o l . . . . . . . Using the Circ le to o l . . . . . . . . . Using the Po lygo n (Freehand) to o l . Editing Regio ns . . . . . . . . . . . . . . . Editing a c irc le o r rec tangle . . . . . Editing a po lygo n . . . . . . . . . . . Mo ving a Regio n . . . . . . . . . . . . . . Linking a Regio n . . . . . . . . . . . . . . . Seeing Yo ur Wo rk Clearly . . . . . . . . . Displaying URLs . . . . . . . . . . . Arranging o verlapping o bjec ts . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

. . . . . . . . . . . . . .

345 346 348 349 349 350 352 353 353 354 354 356 358 359

xxix

xxx

Contents

Adding Butto n Ro llo ver Effec ts Resizing an image . . . . Co nverting butto ns . . . Other Ac tio ns . . . . . . . Minimizing c o de . . . . . Adding URL Po p-up Menus . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

359 364 364 364 365 365

Chapter 13: Creating and Laying Out Tables . . . . . . . . . . . . . . 369 Adding Tables to Yo ur Web Page . . . . . . . . . . . . . . Plac ing a table o n yo ur page . . . . . . . . . . . . . Remo ving o r c hanging the page margins . . . . . . Co nverting o r Deleting a Table . . . . . . . . . . . . . . . Selec ting Tables and Cells . . . . . . . . . . . . . . . . . . Selec ting a table . . . . . . . . . . . . . . . . . . . . Selec ting a c ell o r c ells . . . . . . . . . . . . . . . . Selec ting a ro w o r c o lumn . . . . . . . . . . . . . . . Filling Yo ur Table with Co ntent . . . . . . . . . . . . . . . Adding text to yo ur table . . . . . . . . . . . . . . . Impo rting a text file into yo ur table . . . . . . . . . Wo rking with table text . . . . . . . . . . . . . . . . Adding graphic s o r o ther media to yo ur table . . . Adding and Deleting Ro ws and Co lumns . . . . . . . . . . Adding ro ws o r c o lumns to the end o f a table . . . Inserting a new ro w between existing ro ws . . . . . Inserting a new c o lumn between existing c o lumns Remo ving ro ws and c o lumns . . . . . . . . . . . . . Adjusting the Size o f Yo ur Table . . . . . . . . . . . . . . Understanding table measurements . . . . . . . . . Adjusting a table by dragging . . . . . . . . . . . . . Adjusting a table in the Table Inspec to r . . . . . . . Adjusting the size o f c ells . . . . . . . . . . . . . . . Merging Ro ws and Co lumns . . . . . . . . . . . . . . . . . Merging c ells in a ro w . . . . . . . . . . . . . . . . . Merging c ells do wn a c o lumn . . . . . . . . . . . . . Tweaking Yo ur Table’s Basic Appearanc e . . . . . . . . . Adding a table bo rder . . . . . . . . . . . . . . . . . Adjusting c ell padding . . . . . . . . . . . . . . . . . Adjusting c ell spac ing . . . . . . . . . . . . . . . . . Aligning tables and their c o ntents . . . . . . . . . . Adding c o lo r . . . . . . . . . . . . . . . . . . . . . . Creating a c aptio n fo r yo ur table . . . . . . . . . . . Applying Table Styles . . . . . . . . . . . . . . . . . . . . . Applying a style . . . . . . . . . . . . . . . . . . . . Creating a style . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

370 370 372 372 373 373 374 374 375 376 377 378 382 382 383 384 385 386 387 387 388 389 390 391 391 392 394 394 395 396 398 402 407 409 409 410

Contents

Do ing Page Fo rmatting Tric ks To getherness . . . . . . Be a c ut-up . . . . . . . Framing . . . . . . . . . Centering . . . . . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

410 410 411 411 412

Chapter 14: Creating Reusable Components, Items, and Text . . . . 413 Creating a Co mpo nent . . . . . . . . . . . . . . . . . . Co mpo nent c o nsideratio ns . . . . . . . . . . . . Creating a c o mpo nent fro m sc ratc h . . . . . . . Creating a c o mpo nent fro m an existing page . . Plac ing a Co mpo nent o n Yo ur Page . . . . . . . . . . Using Po int and Sho o t . . . . . . . . . . . . . . . Using drag and dro p . . . . . . . . . . . . . . . . Editing a Co mpo nent . . . . . . . . . . . . . . . . . . . Switc hing a Co mpo nent . . . . . . . . . . . . . . . . . Deleting a Co mpo nent . . . . . . . . . . . . . . . . . . Using Custo m Objec ts and Snippets . . . . . . . . . . Creating Custo m Objec ts . . . . . . . . . . . . . Using Custo m Objec ts in o ther sites . . . . . . . Creating Custo m Snippets . . . . . . . . . . . . . Deleting Custo m Objec ts and Custo m Snippets Using Text Mac ro s . . . . . . . . . . . . . . . . . . . . Intro duc ing text mac ro s . . . . . . . . . . . . . . Creating text mac ro s . . . . . . . . . . . . . . . . Using a text mac ro . . . . . . . . . . . . . . . . . Nesting text mac ro s . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

414 415 416 419 421 421 423 424 425 427 427 428 429 430 431 431 432 433 434 436

Chapter 15: Designing Your Page with Frames . . . . . . . . . . . . . 437 Intro duc ing Frames . . . . . . . . . . . . . . . . . . . Using Frames . . . . . . . . . . . . . . . . . . . . . . Lo ading spec ial effec ts . . . . . . . . . . . . . Hiding c o de within frames . . . . . . . . . . . Using frames to frame dynamic media . . . . Using a frame to c o ntain a navigatio n bar . . Frame Caveats and Issues . . . . . . . . . . . . . . . Frames and searc h engines . . . . . . . . . . . Frames and bo o kmarking . . . . . . . . . . . . Frames and printing . . . . . . . . . . . . . . . Ac c essibility . . . . . . . . . . . . . . . . . . . Designing a Frames Site . . . . . . . . . . . . . . . . Creating Frames and Framesets . . . . . . . . . . . . Plac ing a frameset o n a page . . . . . . . . . . Adding ano ther frame o r frameset to yo ur set

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

438 439 439 440 442 442 443 443 444 445 446 446 448 448 451

xxxi

xxxii

Contents

Deleting a frame o r frameset fro m yo ur set . . . . . . Mo ving frames aro und . . . . . . . . . . . . . . . . . . Changing a frame’s o rientatio n . . . . . . . . . . . . . Naming a frame . . . . . . . . . . . . . . . . . . . . . . Plac ing Co ntent into Frames . . . . . . . . . . . . . . . . . . Nesting framesets . . . . . . . . . . . . . . . . . . . . Editing the c o ntents o f a page . . . . . . . . . . . . . Previewing Yo ur Frames . . . . . . . . . . . . . . . . . . . . Bro wser preview . . . . . . . . . . . . . . . . . . . . . Go Live preview . . . . . . . . . . . . . . . . . . . . . . Semi-editable preview (Mac o nly) . . . . . . . . . . . Tweaking the Lo o k o f Yo ur Framed Page . . . . . . . . . . Adjusting a frame’s size . . . . . . . . . . . . . . . . . Turning sc ro llbars o n o r o ff . . . . . . . . . . . . . . . Making frames user-resizable . . . . . . . . . . . . . . Changing the width o f bo rders between frames . . . Changing the c o lo r o f bo rders between frames . . . Turning bo rders between frames o n o r o ff . . . . . . Setting Up Links Ac ro ss Frames . . . . . . . . . . . . . . . . Creating links that c hange the c o ntents o f o ne frame Using generic targets . . . . . . . . . . . . . . . . . . Testing yo ur links . . . . . . . . . . . . . . . . . . . . Changing two frames at o nc e . . . . . . . . . . . . . . Linking to a page o utside o f yo ur frameset . . . . . . Creating a Alternative . . . . . . . . . . . . . . So lving Frame Navigatio n Issues . . . . . . . . . . . . . . . Adding a manual link . . . . . . . . . . . . . . . . . . . Adding an auto matic c o rrec tio n . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

452 452 453 453 454 456 456 456 457 457 457 459 459 462 463 463 463 464 465 465 466 467 467 469 470 471 471 472

Chapter 16: Adding a Form to Your Site . . . . . . . . . . . . . . . . . 475 Understanding Ho w Fo rms Wo rk . . . . . . . . . Gathering data with the fo rm do c ument . Telling the fo rm what to do with the data . Starting a Fo rm . . . . . . . . . . . . . . . . . . . Naming yo ur fo rm . . . . . . . . . . . . . . Spec ifying an Ac tio n . . . . . . . . . . . . . Targeting fo rm results when using frames Enc rypting fo rm results . . . . . . . . . . . Cho o sing a metho d . . . . . . . . . . . . . Using hidden tags . . . . . . . . . . . . . . Adding Fo rm Fields . . . . . . . . . . . . . . . . . Text field and passwo rd field . . . . . . . . Adding labels to fo rm fields . . . . . . . . . Adding a text area field to yo ur fo rm . . . Adding c hec kbo xes to yo ur fo rm . . . . . Adding radio butto ns to yo ur fo rm . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

475 476 476 477 479 479 480 480 481 481 483 484 486 488 490 491

Contents

Creating a po p-up menu . . . . . . . . . . . . . . . . . Adding a list bo x to yo ur fo rm . . . . . . . . . . . . . Setting User Navigatio n Within a Fo rm . . . . . . . . . . . . Setting the tab o rder o f yo ur fields . . . . . . . . . . Assigning keybo ard keys . . . . . . . . . . . . . . . . Disabling fo rm elements . . . . . . . . . . . . . . . . . Setting a field to read-o nly . . . . . . . . . . . . . . . Plac ing fieldsets in a fo rm . . . . . . . . . . . . . . . . Adding Butto ns to a Fo rm . . . . . . . . . . . . . . . . . . . Submit butto ns . . . . . . . . . . . . . . . . . . . . . . No rmal butto ns . . . . . . . . . . . . . . . . . . . . . . Reset butto ns . . . . . . . . . . . . . . . . . . . . . . . Universal butto ns . . . . . . . . . . . . . . . . . . . . Image plac eho lders . . . . . . . . . . . . . . . . . . . Advanc ed Fo rm Fields . . . . . . . . . . . . . . . . . . . . . Plac ing a key generato r o n a fo rm . . . . . . . . . . . Plac ing a file bro wser o n a fo rm . . . . . . . . . . . . Validating Yo ur Fo rm Data . . . . . . . . . . . . . . . . . . . Field-level validatio n using the FieldValidato r Ac tio n Fo rm-level validatio n using the VerifyFo rm Ac tio n . Server-side validatio n . . . . . . . . . . . . . . . . . . Fo rm Tro ublesho o ting Issues . . . . . . . . . . . . . . . . . Migratio n to Go Live 5’s Fo rm Co ntainer . . . . . . . . . . . Using Go Live Ac tio ns with Fo rms . . . . . . . . . . . . . . . Dealing with No nstandard Tags . . . . . . . . . . . . . . . . The No edit tag . . . . . . . . . . . . . . . . . . . . . . Wo rking in So urc e view . . . . . . . . . . . . . . . . . Lo c king pages into So urc e o nly . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . .

493 495 496 496 498 498 499 499 500 500 501 502 502 503 504 504 505 506 506 508 509 510 511 512 514 514 515 516

Chapter 17: Refining Your Web Pages with Style Sheets . . . . . . . 517 Intro duc ing Style Sheets . . . . . . . . . . . . . . . . . . . . . . . . . The advantages o f using style sheets . . . . . . . . . . . . . . Style sheets in ac tio n . . . . . . . . . . . . . . . . . . . . . . . Identifying Types o f Style Sheets . . . . . . . . . . . . . . . . . . . . Understanding internal and external style sheets . . . . . . . Co nverting a internal style sheet to an external style sheet . Co nverting an external style sheet to an internal style sheet Understanding Selec to rs and Style Types . . . . . . . . . . . . . . . Using element selec to rs . . . . . . . . . . . . . . . . . . . . . . Defining and wo rking with c lasses . . . . . . . . . . . . . . . . Creating and wo rking with IDs . . . . . . . . . . . . . . . . . . Desc ribing Dec laratio n Pro perties . . . . . . . . . . . . . . . . . . . Intro duc ing pro perties . . . . . . . . . . . . . . . . . . . . . . Adding fo nt pro perties . . . . . . . . . . . . . . . . . . . . . . Adding text pro perties . . . . . . . . . . . . . . . . . . . . . . . Adding blo c k pro perties . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

517 518 520 521 523 534 534 535 535 540 543 545 546 546 548 550

xxxiii

xxxiv

Contents

Po sitio n pro perties . . . . . . . . . . . . . . . . . . Adding bo rder pro perties . . . . . . . . . . . . . . Adding bac kgro und pro perties . . . . . . . . . . . Adding a list and o ther pro perties . . . . . . . . . Previewing Style Sheets . . . . . . . . . . . . . . . . . . Editing Style Sheets . . . . . . . . . . . . . . . . . . . . . Editing an internal style sheet . . . . . . . . . . . Editing an external style sheet . . . . . . . . . . . Remo ving an external style sheet . . . . . . . . . Fixing the Netsc ape Casc ading Style Sheet glitc h Using a different style sheet fo r eac h platfo rm . . Setting Casc ading Style Sheet Preferenc es . . . . . . . Changing the default unit o f measure . . . . . . . Changing style sheet c o de appearanc e . . . . . . Creating a new preview style sheet . . . . . . . . Finding Mo re Casc ading Style Sheet Reso urc es . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

Part V: Adding M ultimedia, M ovement, and Interactivity

. . . . . . . . . . . . . . . .

552 554 555 556 557 558 558 559 561 561 562 562 562 563 564 564

567

Chapter 18: Applying GoLive’s JavaScripts: Actions and Smart Objects . . . . . . . . . . . . . . . . . 569 Understanding Ac tio ns . . . . . . . . . . . . . . . . . . . . . Triggering events . . . . . . . . . . . . . . . . . . . . . Creating User-Triggered Ac tio ns . . . . . . . . . . . . . . . Setting up a mo use-invo ked Ac tio n . . . . . . . . . . Setting up a key-related Ac tio n . . . . . . . . . . . . . Setting Up a Page-Triggered Ac tio n . . . . . . . . . . . . . . Adding head Ac tio ns . . . . . . . . . . . . . . . . . . . Adding inline (bo dy) Ac tio n items . . . . . . . . . . . Adding timeline-triggered Ac tio ns . . . . . . . . . . . Minimizing Co de and Enabling JavaSc ript in Co mpo nents Ensuring the integrity o f the JavaSc ript . . . . . . . . Flatten sc ript library . . . . . . . . . . . . . . . . . . . Implementing Go Live Ac tio ns . . . . . . . . . . . . . . . . . Getting a flo ating bo x po sitio n . . . . . . . . . . . . . Getting a value used in a fo rm — Fo rm Value . . . . . Prelo ading images used o n yo ur page . . . . . . . . . Displaying images at rando m fro m an image po o l . . Swapping images with the Set Image URL Ac tio n . . Using link Ac tio ns . . . . . . . . . . . . . . . . . . . . Emplo ying Message Ac tio ns . . . . . . . . . . . . . . Using multimedia Ac tio ns . . . . . . . . . . . . . . . . Exerc ising o ther Ac tio ns . . . . . . . . . . . . . . . . Mo nito ring and ac ting upo n c o nditio ns . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . .

570 570 572 572 575 577 577 579 580 581 582 582 583 584 585 585 586 588 589 593 597 608 612

Contents

Wo rking with Variables in Ac tio ns . . . Dec laring variables . . . . . . . . . Initializing variables . . . . . . . . Setting variables . . . . . . . . . . Testing variables . . . . . . . . . . Creating and Using Co o kies . . . . . . . Gro uping and Calling Ac tio ns To gether Gro uping to gether Ac tio ns . . . . Calling a previo usly set Ac tio n . . Adding a Bro wser Switc h Item . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

614 614 616 617 617 618 620 620 622 622

Chapter 19: Adding Special Effects and Animation . . . . . . . . . . 625 Intro duc ing Flo ating Bo xes . . . . . . . . . . . . . Plac ing a Flo ating Bo x o n Yo ur Page . . . . . . . . Repo sitio ning a flo ating bo x . . . . . . . . . Adding additio nal flo ating bo xes . . . . . . . Selec ting a flo ating bo x . . . . . . . . . . . . Preventing o verlapping . . . . . . . . . . . . Aligning flo ating bo xes . . . . . . . . . . . . Deleting a flo ating bo x . . . . . . . . . . . . . Adding a Bac kgro und to a Flo ating Bo x . . . . . . Adding a bac kgro und c o lo r . . . . . . . . . . Adding a bac kgro und image . . . . . . . . . Adding Co ntent to a Flo ating Bo x . . . . . . . . . . Adding text within a flo ating bo x . . . . . . . Adding an image to a flo ating bo x . . . . . . Adding Additio nal Fo rmatting to a Flo ating Bo x . Defining the lo o k o f yo ur text . . . . . . . . . Setting the lo o k o f yo ur flo ating bo x . . . . . Resizing a Flo ating Bo x . . . . . . . . . . . . . . . . Editing Inside the Bo x . . . . . . . . . . . . . . . . Co nverting a Flo ating Bo x to a Layo ut Text Bo x . Co ntro lling Visibility . . . . . . . . . . . . . . . . . Setting the initial visibility . . . . . . . . . . Visibility o n c all . . . . . . . . . . . . . . . . Wo rking with Invisible Flo ating Bo xes . . . . . . . The Flo ating Bo xes Palette . . . . . . . . . . . . . Animating Flo ating Bo xes with a Timeline . . . . . Rec o rding a flo ating bo x’s mo vement . . . . Viewing yo ur animatio n . . . . . . . . . . . . Naming yo ur animatio n . . . . . . . . . . . . Editing yo ur rec o rded path . . . . . . . . . . Creating additio nal sc enes within yo ur page Jazzing up yo ur animatio n sequenc e . . . . Setting up playbac k . . . . . . . . . . . . . . Creating Mo vement in Other Ways . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

626 627 630 632 633 633 634 635 636 636 637 637 638 639 640 641 642 642 643 643 644 645 645 648 649 651 653 654 657 658 660 661 663 665

xxxv

xxxvi

Contents

Chapter 20: Adding Audio and Video . . . . . . . . . . . . . . . . . . 667 Adding So und and Video o n the Web . . . . . . . . . . . Metho ds o f adding so und o r video to yo ur page . Understanding embedding and linking . . . . . . Adding Sho c kwave/ Flash to Yo ur Page . . . . . . . . . . Adding a Quic kTime Mo vie (o r So und) . . . . . . . . . Determining whic h Quic kTime files to uplo ad and Linking to a Quic kTime mo vie . . . . . . . . . . . Embedding a Quic kTime mo vie in yo ur page . . . Obtaining mo re info rmatio n . . . . . . . . . . . . Using RealMedia in Yo ur Site . . . . . . . . . . . . . . . Linking to c all up a RealMedia file . . . . . . . . . Embedding RealMedia in a page . . . . . . . . . . Building a c usto m c o ntro l panel . . . . . . . . . . Embedding Other Media File Types in Yo ur Page . . . . Adding audio attributes . . . . . . . . . . . . . . . Setting visibility . . . . . . . . . . . . . . . . . . . Setting c o ntro ls . . . . . . . . . . . . . . . . . . . . Timing . . . . . . . . . . . . . . . . . . . . . . . . . Using a Sc alable Vec to r Graphic . . . . . . . . . . . . . Cho o sing Plug-in Preferenc es . . . . . . . . . . . . . . . Changing a player . . . . . . . . . . . . . . . . . . Mapping a new extensio n o r Mime type . . . . . . Using the Objec t Plug-in . . . . . . . . . . . . . . . . . . User-Triggered So unds . . . . . . . . . . . . . . . . . . . Using Go Live Ac tio ns to Trigger So unds . . . . . Beatnik . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . link to . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . .

668 669 670 672 675 676 676 677 682 683 683 684 686 688 691 692 692 692 693 695 696 696 697 699 700 700

Chapter 21: Creating QuickTime M ovies in GoLive . . . . . . . . . . 703 Intro duc ing Quic kTime Mo vies . . . . . . . . . . . . . . Getting Started . . . . . . . . . . . . . . . . . . . . . . . Starting a new mo vie . . . . . . . . . . . . . . . . . Opening an existing mo vie . . . . . . . . . . . . . Saving yo ur mo vie . . . . . . . . . . . . . . . . . . Intro duc ing the TimeLine Windo w and Inspec to r . . . The Trac k list . . . . . . . . . . . . . . . . . . . . . The c o ntent area and TimeLine . . . . . . . . . . The playbac k c o ntro ls and c lo c k . . . . . . . . . . The Inspec to r . . . . . . . . . . . . . . . . . . . . . The Basic s o f Quic kTime Editing . . . . . . . . . . . . . Impo rting files . . . . . . . . . . . . . . . . . . . . Adding Go Live-generated elements . . . . . . . . Laying o ut yo ur mo vie . . . . . . . . . . . . . . . . Co pying Existing Trac ks fro m Other Quic kTime Mo vies

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

704 706 706 707 708 709 710 711 712 713 717 718 720 722 724

Contents

Adding Visual Trac ks . . . . . . . . . . . . . . . . . Adding So und and Music Trac ks . . . . . . . . . . Adding Video Effec ts and Transitio ns . . . . . . . Adding a generic filter trac k . . . . . . . . . Applying a o ne-so urc e filter trac k . . . . . . Applying a two -so urc e filter trac k . . . . . . Adding Sprite Trac ks . . . . . . . . . . . . . . . . . Creating sprite and sprite sample trac ks . . Po sitio ning and animating individual ac to rs Wiring sprites . . . . . . . . . . . . . . . . . . Adding Text Trac ks . . . . . . . . . . . . . . . . . . Fo rmatting yo ur text . . . . . . . . . . . . . . Resizing and po sitio ning yo ur text area . . . Making text interac tive . . . . . . . . . . . . Adding HREF Trac ks . . . . . . . . . . . . . . . . . Adding Chapter Trac ks . . . . . . . . . . . . . . . . Saving and Expo rting Yo ur Mo vie . . . . . . . . . . Using Yo ur Mo vie in Yo ur Site . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

725 726 729 730 732 732 733 734 736 738 739 740 741 741 742 744 746 748

Chapter 22: Creating Your Own JavaScripts . . . . . . . . . . . . . . . 749 Using JavaSc ript . . . . . . . . . . . . . . . . . . . . . . . . . . Plac ing JavaSc ript into Yo ur Page . . . . . . . . . . . . . . . Inserting JavaSc ript . . . . . . . . . . . . . . . . . . . . Plac ing JavaSc ript in a page’s bo dy . . . . . . . . . . . Setting up fo r the JavaSc ript . . . . . . . . . . . . . . . Inc o rpo rating a Pro vided JavaSc ript into Yo ur Page . . . . . Plac ing JavaSc ript c o de into an external JavaSc ript file Plac ing JavaSc ript c o de direc tly into yo ur page . . . . Intro duc ing the JavaSc ript Edito r . . . . . . . . . . . . . . . . The JavaSc ript Edito r to o lbar . . . . . . . . . . . . . . The Sc ript tab . . . . . . . . . . . . . . . . . . . . . . . . The Events tab . . . . . . . . . . . . . . . . . . . . . . . The Objec ts tab . . . . . . . . . . . . . . . . . . . . . . . Using the JavaSc ript Edito r . . . . . . . . . . . . . . . . . . . A sc ript tuto rial . . . . . . . . . . . . . . . . . . . . . . . Setting the JavaSc ript Edito r’s Preferenc es . . . . . . . . . . JavaSc ript fo nt preferenc es . . . . . . . . . . . . . . . . JavaSc ript c o lo r preferenc es . . . . . . . . . . . . . . . JavaSc ript printing preferenc es . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

749 750 750 752 752 754 754 754 755 756 758 759 761 762 762 769 770 771 771

Chapter 23: Adding Java Applets to Your Page . . . . . . . . . . . . . 773 Intro duc ing the Advantages o f Java . Adding a Java Applet to Yo ur Page . . Chec king yo ur results . . . . . . Editing and deleting parameters

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

773 775 779 780

xxxvii

xxxviii

Contents

Adding a Java Applet Using Cut and Paste Testing and Tro ublesho o ting an Applet . Adding a Lo gin Applet to Yo ur Page . . . Getting Mo re Java Applet Help . . . . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

780 781 781 783

Chapter 24: Using Dynamic Link . . . . . . . . . . . . . . . . . . . . . 785 Intro duc ing Dynamic Link . . . . . . . . . . . . . . . . . . . . . . The Hardware and So ftware Setup . . . . . . . . . . . . . . . . . Server Needs . . . . . . . . . . . . . . . . . . . . . . . . . . Using the Dynamic Link interfac e o n the Mac . . . . . . . Determining yo ur database needs . . . . . . . . . . . . . . Setting up the Web server . . . . . . . . . . . . . . . . . . . Installing yo ur database o n the server . . . . . . . . . . . Turning o n Dynamic Link . . . . . . . . . . . . . . . . . . . Creating Mo c k Pages . . . . . . . . . . . . . . . . . . . . . . . . . Making Yo ur Page Dynamic . . . . . . . . . . . . . . . . . . . . . Cho o sing Co ntent So urc es and Binding Fields . . . . . . . . . . Creating a c o ntent so urc e . . . . . . . . . . . . . . . . . . . Binding a c o ntent so urc e to a plac eho lder . . . . . . . . . Creating dynamic tables . . . . . . . . . . . . . . . . . . . . Creating Navigatio n Links . . . . . . . . . . . . . . . . . . . . . . Preparing to link to a new dynamic page . . . . . . . . . . Passing values between two dynamic pages . . . . . . . . Linking the dynamic pages using dynamic URL arguments Dynamic Link Preferenc es . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

Part VI: Going Live —The Final Touches

. . . . . . . . . . . . . . . . . . .

786 787 787 788 789 790 791 793 793 795 797 797 799 801 803 804 805 807 807

809

Chapter 25: Optimizing and Problem-Solving . . . . . . . . . . . . . 811 Finding and Replac ing Bo dy Text o r Co de . . . . . Finding and c hanging text . . . . . . . . . . . Find and replac e in multiple files . . . . . . . Wildc ard searc hes and regular expressio ns Finding HTML c o de elements . . . . . . . . . Setting Find preferenc es . . . . . . . . . . . . Finding Files within Yo ur Site . . . . . . . . . . . . Lo c ating items in yo ur site . . . . . . . . . . Perfo rming index searc hes (Mac o nly) . . . Identifying Bad Links . . . . . . . . . . . . . . . . . Green bugs . . . . . . . . . . . . . . . . . . . Link warnings . . . . . . . . . . . . . . . . . . In & Out Links palette . . . . . . . . . . . . . Previewing links . . . . . . . . . . . . . . . . Using HTML Outline Edito r mo de . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

811 812 815 818 827 830 832 833 834 836 837 838 839 840 840

Contents

Using the Erro rs tab . . . . . . . . . . . . . . . . . . . Chec king external links . . . . . . . . . . . . . . . . . Tro ublesho o ting via the Erro rs Tab . . . . . . . . . . . . . Orphan files . . . . . . . . . . . . . . . . . . . . . . . . Missing files . . . . . . . . . . . . . . . . . . . . . . . . Resc anning Yo ur Site and Updating Links . . . . . . . . . . Reviewing Links in the In & Out Links Palette . . . . . . . . Viewing a page’s links with the In & Out Links palette Changing the lo o k o f the In & Out Links palette . . . Printing an In & Out Links map . . . . . . . . . . . . . Cleaning Up Yo ur Site . . . . . . . . . . . . . . . . . . . . . Setting Clean Up Site Preferenc es . . . . . . . . . . . Using Clean Up Site . . . . . . . . . . . . . . . . . . . Flatten Sc ript Library . . . . . . . . . . . . . . . . . . . . . . Creating Site Repo rts . . . . . . . . . . . . . . . . . . . . . . Saving and reusing a query . . . . . . . . . . . . . . . Using do c ument statistic s . . . . . . . . . . . . . . . . Chec king Bro wser Co mpatibility . . . . . . . . . . . . . . . Test o n yo ur o wn c o mputer . . . . . . . . . . . . . . Test fro m a server . . . . . . . . . . . . . . . . . . . . Beta testing . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

841 841 843 843 846 849 851 851 853 854 854 855 857 859 859 861 862 863 863 863 864

Chapter 26: Polishing Your Web Pages . . . . . . . . . . . . . . . . . 865 Helping Visito rs Find Yo ur Site . . . . . . . . . . Finesse page titles . . . . . . . . . . . . . . Adding keywo rds to yo ur pages . . . . . . Adding a desc riptio n . . . . . . . . . . . . . Redirec ting yo ur visito rs to yo ur new URL Refreshing yo ur page . . . . . . . . . . . . Helping Visito rs Find Their Way Within Yo ur Site Adding a Table o f Co ntents . . . . . . . . . Simplifying URLs within yo ur site . . . . . Dating yo ur info rmatio n . . . . . . . . . . . Keeping Yo ur Data and Messages Fresh . . . . .

. . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

865 865 866 871 875 876 877 877 881 882 884

Chapter 27: Publishing Your Web Site . . . . . . . . . . . . . . . . . . 887 Befo re Yo u Get Started . . . . . . . . . . . . Setting Up Yo ur Server Spac e . . . . . . . . Sharing a spac e amo ng separate sites Setting up a sec ret test site . . . . . . Uplo ading yo ur Site Via the Site Windo w . Setting up ac c ess to the server . . . . Uplo ading yo ur site fo r the first time Viewing yo ur files in the FTP tab . . . Adding a new direc to ry . . . . . . . . Disc o nnec ting fro m the FTP server .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

887 888 888 889 889 890 894 897 898 898

xxxix

xl

Contents

Using the FTP Bro wser . . . . . . . . . . . . . . . . . . Entering yo ur FTP settings . . . . . . . . . . . . Co nnec ting to an FTP site via the FTP Bro wser Wo rking within the FTP Bro wser . . . . . . . . . Disc o nnec ting fro m the FTP Bro wser . . . . . . Setting FTP Preferenc es . . . . . . . . . . . . . . . . . Updating FTP server settings . . . . . . . . . . . Uplo ading o ptio ns . . . . . . . . . . . . . . . . . General netwo rk o ptio ns fo r FTP . . . . . . . . . Trac king Server Ac c ess Erro rs . . . . . . . . . . . . . Viewing server ac c ess messages . . . . . . . . . Saving yo ur server ac c ess lo g as a text file . . . Setting server ac c ess preferenc es . . . . . . . . Expo rting Yo ur Site . . . . . . . . . . . . . . . . . . . . Setting expo rt o ptio ns . . . . . . . . . . . . . . . Perfo rming the expo rt . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . .

Part VII: Using GoLive’s Advanced Site-Planning Tools

. . . . . . . . . . . . . . . .

899 899 900 900 902 903 903 904 905 906 907 908 909 909 910 911

913

Chapter 28: Updating Your Site . . . . . . . . . . . . . . . . . . . . . . 915 Editing Existing Pages . . . . . . . . . . . . . . . . . . . . . . . Avo iding ac c idental publishing . . . . . . . . . . . . . . . Keeping a safe c o py . . . . . . . . . . . . . . . . . . . . . Renaming items within yo ur published site . . . . . . . Editing a file direc tly o n the Web server . . . . . . . . . Adding New Pages to Yo ur Site . . . . . . . . . . . . . . . . . . Deleting Items fro m Yo ur Site . . . . . . . . . . . . . . . . . . . Co nsider referring files . . . . . . . . . . . . . . . . . . . Unnec essary strays . . . . . . . . . . . . . . . . . . . . . Sending Yo ur Changes to the Web . . . . . . . . . . . . . . . . Updating yo ur site via the Site Windo w . . . . . . . . . . Uplo ading all files . . . . . . . . . . . . . . . . . . . . . . Uplo ading selec ted files . . . . . . . . . . . . . . . . . . . Updating yo ur server’s files list . . . . . . . . . . . . . . Updating yo ur Web site if yo u used expo rt . . . . . . . . Renaming files o r fo lders o n the server . . . . . . . . . . Deleting items fro m yo ur server . . . . . . . . . . . . . . Do wnlo ading Files fro m Yo ur Server . . . . . . . . . . . . . . . Inc remental do wnlo ads . . . . . . . . . . . . . . . . . . . Do wnlo ading selec ted pages using the Site Windo w FTP Do wnlo ading pages using the FTP bro wser windo w . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . .

915 916 917 918 918 920 921 921 922 923 923 925 926 928 929 929 929 930 931 932 932

Contents

Chapter 29: Using the Site Designer . . . . . . . . . . . . . . . . . . . 933 Viewing Yo ur Site’s Struc ture . . . . . . . . . . . . . . . Intro duc ing Navigatio n view . . . . . . . . . . . . Understanding Links view . . . . . . . . . . . . . . Getting aro und in Site views . . . . . . . . . . . . Custo mizing page ic o ns and labels . . . . . . . . Filtering files viewed . . . . . . . . . . . . . . . . . Using spo tlights to fo c us in o n page relatio nships Displaying pages and files within filtering panes . Seeking and Co nnec ting Pending Links . . . . . . . . . Reviewing and Reo rganizing Yo ur Site’s Struc ture . . . Planning Yo ur Site in the Site Designer . . . . . . . . . . Preparing a site fo r a site design . . . . . . . . . . Creating a new site design . . . . . . . . . . . . . Adding subsec tio ns to a design . . . . . . . . . . Adding c o mments (anno tatio ns) to a design . . . Defining Links . . . . . . . . . . . . . . . . . . . . . . . . Organizing a Design . . . . . . . . . . . . . . . . . . . . . Mo ving pages . . . . . . . . . . . . . . . . . . . . . Aligning pages . . . . . . . . . . . . . . . . . . . . Arranging links . . . . . . . . . . . . . . . . . . . . Gro uping and ungro uping pages . . . . . . . . . . Chec king Yo ur Design . . . . . . . . . . . . . . . . . . . Presenting a Site Design . . . . . . . . . . . . . . . . . . Turning Yo ur Design into Real Pages . . . . . . . . . . . Rec alling a Design . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

933 934 935 937 938 942 943 945 947 950 951 953 955 962 963 965 966 966 967 968 969 971 972 972 973

Chapter 30: Authoring with WebDAV . . . . . . . . . . . . . . . . . . . 975 Intro duc ing WebDAV . . . . . . . . . . . . . . . . . . . . Beginning with WebDAV . . . . . . . . . . . . . . . Tasting the two WebDAV flavo rs . . . . . . . . . . Setting Up fo r WebDAV . . . . . . . . . . . . . . . . . . . Setting up preferenc es . . . . . . . . . . . . . . . . Uplo ading yo ur site to begin c o llabo rative wo rk . Giving ac c ess to fello w develo pers . . . . . . . . Setting up if yo u’re a c o develo per . . . . . . . . . Sync hro nizing Files . . . . . . . . . . . . . . . . . . . . . Wo rkflo w Using Wo rkgro up Suppo rt . . . . . . . . . . . Chec king files o ut . . . . . . . . . . . . . . . . . . Wo rking with a c hec ked-o ut file . . . . . . . . . . Adding files . . . . . . . . . . . . . . . . . . . . . . Co mpo nents and Statio nery . . . . . . . . . . . . Deleting files . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

. . . . . . . . . . . . . . .

975 976 977 978 978 982 984 985 986 988 989 991 994 994 997

xli

xlii

Contents

Renaming files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 998 Mo ving files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1002 Chec king files in . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1002 Editing a file so meo ne else has lo c ked . . . . . . . . . . . . . . . . . 1003 Keeping yo ur view o f the site up-to -date by refreshing . . . . . . . 1005 Disc o nnec ting and rec o nnec ting . . . . . . . . . . . . . . . . . . . . 1005 Wo rking when no t c o nnec ted . . . . . . . . . . . . . . . . . . . . . . 1006 Learning Abo ut a Site’s Files . . . . . . . . . . . . . . . . . . . . . . . . . . 1008 Mo nito ring Netwo rk Status . . . . . . . . . . . . . . . . . . . . . . . . . . . 1009 Turning Wo rkflo w Suppo rt On o r Off . . . . . . . . . . . . . . . . . . . . . 1010 Wo rking with Basic WebDAV . . . . . . . . . . . . . . . . . . . . . . . . . . 1011 Manually lo c king files . . . . . . . . . . . . . . . . . . . . . . . . . . 1011 Making sure yo u wo rk with c urrent files . . . . . . . . . . . . . . . . 1013 Managing files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1014 Uplo ading files after an edit . . . . . . . . . . . . . . . . . . . . . . . 1015 Using the WebDAV Bro wser . . . . . . . . . . . . . . . . . . . . . . . . . . 1016 Ho sting After Develo pment . . . . . . . . . . . . . . . . . . . . . . . . . . 1017

Appendix A: What’s on the CD-ROM . . . . . . . . . . . . . . . . . . 1019

Bonus Appendixes

On the CD-ROM

Appendix B: Introducing the JavaScript Language Appendix C: How Forms Communicate Appendix D: Understanding the E-commerce Puzzle Appendix E: Extend Script and the GoLive SDK

Index. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1029 End-User License Agreem ent . . . . . . . . . . . . . . . . . . . . . . . . 1058 CD-ROM Installation Instructions . . . . . . . . . . . . . . . . . . . . . . 1062

I

C H A P T E R

Introducing GoLive’s Features

D

o yo u remember the days (o h so lo ng ago ) when no rmal presenc e o n the Web was a single page? No wadays, full-fledged Web sites — multiple pages — are mo re c o mmo n. The Web has matured signific antly in its brief lifetime. Onc e upo n a time a pic ture o n a site was spec ial. An animated GIF was jaw-dro pping. No wadays yo u c an add still graphic s, animated graphic s, streaming so und, video s, and animatio ns. Web sites have c ertainly bec o me mo re intric ate to c reate and manage. Thankfully, there ’ s Ado be Go Live 5. This bo o k c an ac tually have a few different intro duc tio ns. I c an intro duc e it as a great to o l fo r beginners bec ause it enables yo u to easily c reate great pages and get them o n to the Web quic kly. I c an intro duc e it as a great to o l fo r designers bec ause it integrates well with Ado be ’s o ther amazing design to o ls. I c an intro duc e it as a great to o l fo r o ld-fashio ned c o ders bec ause it no t o nly pro vides all the to o ls yo u need fo r c o ding, but also allo ws yo u to simultaneo usly view yo ur results. I c an intro duc e it as a to o l fo r Quic kTime c o ntent c reato rs bec ause it c o ntains an entire Quic kTime Edito r that takes full advantage o f the Quic kTime API (applic atio n pro gram interfac e). I c an intro duc e it as a to o l fo r small-site designers bec ause it is easy to use fo r designing a small site, getting it do c umented and up and go ing, and perhaps mo re impo rtant, it c an remain yo ur to o l o f c ho ic e as yo ur site gro ws. I c an intro duc e it as a to o l fo r large-site designers bec ause Go Live handles large pro duc tio ns with its site arc hitec ture do c ument generatio n c apability. Go Live also effic iently handles site management and Web Distributed Autho ring Versio ning (WebDAV) features fo r team develo pment , and makes it easy to add, adapt, edit, and pro jec t manage yo ur site thro ugh all phases. The fo llo wing are so me further po ints to keep in mind:

✦

✦

✦

✦

In This Cha pter G etting to kno w the G o Live W eb autho ring to o l To uring the G o Live interface Identifying the G o Live audience W o rking with multimedia in G o Live G enerating fo rms and tracking yo ur wo rk G o ing live the easy way

✦

✦

✦

✦

4

Part I ✦ Introducing GoLive 5

✦ Go Live is no t just a to o l fo r designing a page; it’s a to o l fo r designing an entire site fro m site arc hitec ture to c reatio n.

✦ Go Live is no t o nly a to o l fo r designing an entire site, it’s a to o l fo r updating, expanding, and maintaining yo ur site.

✦ Go Live is a state-o f-the-art Web site c reatio n pro gram that suppo rts all widely ac c epted advanc ed Web c apabilities.

✦ Go Live is a pro jec t management to o l fo r an entire Web develo pment team. ✦ Go Live is a c o mplete FTP to o l fo r uplo ading yo ur site o r fo r inc remental uplo ads with full file trac king to ensure that all yo ur updates make it to the server.

✦ Go Live 5 is no w c o mpletely c ro ss platfo rm. ✦ Go Live 5 is no w a part o f the Ado be family o f c reative to o ls in every way; it , inc ludes the po pular Ado be interfac e and has the c apability to wo rk between o ther Ado be applic atio ns suc h as Pho to sho p, Illustrato r, and LiveMo tio n. (Go Live 4 users c an easily upgrade to Versio n 5.)

Introducing the GoLive Web Site Creation Tool Using Go Live is simple. Yo u c o llec t yo ur site’s asset files suc h as graphic s, video s, and so unds in a windo w. Yo u o pen a page, enter so me type, drag so me file ic o ns o r the Objec ts palette ic o ns o nto the page’s unique Po int and Sho o t feature to c o nnec t the files, make sure everything is po sitio ned right . . . and that’s abo ut all yo u need to do . Just so yo ur Web life isn’t a to tal drag, Go Live thro ws in an intuitive Inspec to r with a few easy-to -use po p-up menus o r a plac es to enter info rmatio n. As yo u wo rk, Go Live manages yo ur site and tells yo u when an erro r o c c urs. And to fix an erro r? Just c lic k a butto n o r drag to rec o nnec t the file. So what exac tly do es Go Live do ? In a nutshell, it pro vides ease o f use, ease o f site c o nc eptualizatio n, management, flexibility, erro r c hec king, bro wser c o mpatibility, HTML fo rmatting, page interac tivity, fo rms c reatio n, JavaSc ripting, Casc ading Style Sheets fo rmatting, DHTML c o ding, Quic kTime editing, site building and streamlining, database, e-c o mmerc e and XML suppo rt. Ho w do es it do this? Mo stly thro ugh the magic o f its Site Windo w where files are rec o rded and trac ked, with the help o f a palette full o f o bjec ts fo r yo ur pages, and with the aid o f its multifunc tio nal Inspec to r. Whether yo u’re new to Web page c reatio n and o nly plan o n building a small site fo r yo u and yo ur family, whether yo u’re a pro fessio nal graphic designer expanding

Chapter 1 ✦ Introducing GoLive’s Features

yo ur design skills to the Web, o r whether yo u’ re a Web-wise o ld-timer and want a break fro m hand-c o ding to take yo u to the next level o f design and management, Go Live is pac ked with useful and c o mmanding features that c an handle sites ranging fro m a few pages to hundreds o f pages.

Taking a Quick Tour of the GoLive Interface What sets Go Live apart fro m o ther Web site to o ls o n the market? Its po werful and tec hno lo gic ally advanc ed features. Here are the main o nes:

✦ Site Window. This is yo ur main site management interfac e, similar to yo ur c o mputer’ s deskto p list view (details) interfac e. Yo u plac e all o f the files that c o mprise yo ur site here so Go Live c an manage them. Instead o f having to keep trac k o f all o f yo ur site ’ s asse ts (piec es), yo u just drag eac h graphic , so und, mo vie, PDF (Po rtable Do c ument Fo rmat file), do wnlo adable file, and so o n into the Site Windo w. Fro m there, Go Live pro vides file management and when yo u FTP, it ensures all o f yo ur files are c o rrec tly uplo aded to the Web server. When yo u link to pages fro m within the Site Windo w, Go Live trac ks yo ur links — pro viding full link erro r c hec king. When yo u c o llec t external URLs fro m the Site Windo w, Go Live verifies tho se URLs. Go Live even trac ks the c o lo rs and fo nts yo u designate o n the pages o f yo ur site. There ’ s mo re, but in sho rt, Go Live trac ks all the elements that c o mprise yo ur site fro m within the easy-to -use but po werful Site Windo w.

✦ Point and Shoot. This is Go Live ’ s inc redibly simple and intuitive linking tec hnique. Ask experienc ed Go Live users ho w to sum up Go Live in very few wo rds and the c hanc es are that they will say Po int and Sho o t pretty quic kly. Po int and Sho o t is literally that. Yo u plac e the text o r graphic that yo u want to turn into a link. Yo u then press Optio n (Mac ) o r Alt (Windo ws) as yo u c lic k this wo uld-be link and yo u drag it o ver to the page o r to the marker that’ s yo ur link’ s destinatio n.

✦ Objects palette. This palette pro vides the page element ic o ns fo r yo u to drag and dro p into plac e o n yo ur page. Eac h ic o n has an Inspe cto r that sho ws yo u what yo u c an do to set up that o bjec t o nc e it’ s o n the page. Co nte xtual me nus c o mpliment the Inspec to r when yo u’ re po inting to an item, but also pro vide many o f the menu and to o lbar c o mmands.

✦ In & Out Links palette. This feature lets yo u see all o f yo ur links fo r pages and individual files at a glanc e. When yo u selec t a page in the Site Windo w, the In & Out Links palette sho ws yo u every file that links to the page and every file that is linked fro m that same page. When yo u selec t a file, suc h as a graphic o r video , yo u see all pages it is used o n, and any links that graphic may c o ntain as well. This palette do es mo re than repo rt links; it also enab les linking. Yo u c an use the Po int and Sho o t b utto n to swap any graphic , link, o r o ther destinatio n.

5

6

Part I ✦ Introducing GoLive 5

Go Live pro vides the prec eding easy-to -understand to o ls, in additio n to o thers. They inc lude the Frames edito r and the Frames tab o f the Objec ts palette that wo rk to gether to make building a frameset as easy as drag and dro p — and getting it set up right as easy as Po int and Sho o t, drag, and c lic k. Yo u c an drag the Table ic o n to yo ur page to build a table. The Co lo r palette enables yo u to c ho o se a c o lo r fro m any number o f c o lo r o ptio ns — and even pic k up any c o lo r o n yo ur mo nito r! Additio nally, c usto mizable keybo ard sho rtc uts make it easier fo r yo u to perfo rm any func tio n that’ s available within Go Live ’ s menus. Figure 1-1 sho ws Go Live ’ s interfac e, inc luding the Site Windo w and the Inspec to r.

Figure 1-1: The GoLive 5 interface

Using GoLive Go Live maintains a level o f ease that beginners are c o mfo rtable with, yet is pac ked with po wer that even the highest end designers and c o ders find appealing. It truly has a full range o f features fo r anyo ne who designs fo r the Web.

Chapter 1 ✦ Introducing GoLive’s Features

Go Live is a great to o l fo r any o f the fo llo wing types o f users:

✦ Beginners will find it easy to c reate great pages and get them o nto the Web fast. ✦ Designers will apprec iate its integratio n with Ado be ’ s o ther inno vative design to o ls.

✦ Old-fashioned coders will like it bec ause it no t o nly pro vides all the to o ls needed fo r c o ding, but also o ffers a parallel view o f the results.

✦ Scriptors and developers are pro vided the So ftware Develo pment Kit (SDK) that enables the extensio n and c usto mizatio n o f Go Live ’ s already c o mprehensive c apabilities.

✦ QuickTime content creators will benefit fro m using the Quic kTime Edito r that takes full advantage o f the Quic kTime API.

✦ Small-site designers will find it is easy to use fo r arc hitec ting, do c umenting, and setting up a small site. Perhaps mo re impo rtantly, it c an remain a to o l o f c ho ic e as the site gro ws.

✦ Large-site designers and pro jec t managers will like the way Go Live c o mpetently handles large pro duc tio ns with its site arc hitec ture do c ument generatio n fo r c lients. Its site management and WebDAV features fo r team develo pment make it easy to add, adapt, edit, and pro jec t manage yo ur site thro ugh all phases.

GoLive is for beginners Well, ac tually, it’ s fo r everyo ne who understands that yo u do n’ t have to wo rk hard to wo rk smart. Go Live ’ s entire interfac e is geared to ward simplic ity and ease. It’ s Site Windo w trac ks all the ac tio ns yo u do and lets yo u kno w when yo u’ re do ing well o r when yo u have an erro r — and it lets yo u kno w what and where that erro r is. Yo u do n’ t have to kno w HTML o r any o ther c o de, to c reate simple o r intric ate Web sites. With Go Live 5, yo u do n’ t even need to have a design in mind. Go Live ’ s templates enab le yo u to get a site up q uic kly even if yo u’ re no t a designer. Simply c ho o se File ➪ New Site ➪ Co py Fro m Template and b uild yo ur site b ased upo n o ne o f Ado b e ’ s starter sites. Go Live ’ s Windo w menu is ric h with palettes and windo ws that pro vide the to o ls yo u need to build an amazing site. Keep the Objec ts palette o pen to add elements to yo ur site. Keep the Inspec to r o pen as yo u wo rk and it enables yo u to c o nfigure and adjust yo ur pages o r the elements o n yo ur pages. Open extra palettes as yo u wo rk o n a spec ific element o r task that has a palette name asso c iated with it.

7

8

Part I ✦ Introducing GoLive 5

GoLive is for designers In additio n to being great fo r beginners, Ado be Go Live is a true designer’s to o l. It is visual (WYSIWYG), enabling yo u to c o nc entrate o n the lo o k and feel o f yo ur site, no t the hypertext markup language (HTML) c o de behind it. Ho wever, anytime yo u wish, it’s a c inc h to lo o k at, and wo rk in, the HTML. In fac t, using Go Live c an even help yo u learn and perfec t yo ur understanding and use o f HTML and emerging c o de tec hno lo gies. Go Live streamlines the entire Web design pro c ess fro m start to finish. When I say start I mean fro m co nce pt. Go Live pro vides to o ls to c o nc eive and sto rybo ard (graphic ally layo ut) the arc hitec ture o f a new site. This pro c ess is so easy that yo u c an c reate several site layo uts and do c ument them in print o r Ado be Ac ro bat PDF files fo r pro fessio nal graphic al c lient presentatio ns. As a designer, yo u c an c reate yo ur page mo ckups (c o mps) in Pho to sho p and add them to yo ur Web site as full-page trac ing guides and c ut individual o ptimized sec tio ns fro m them with amazing ease. So me o f Go Live’s designer-o riented features inc lude the fo llo wing:

✦ Smart Objects (new to Go Live 5) makes it easy to impo rt o riginal layered files yo u c reate with Pho to sho p, Illustrato r, o r LiveMo tio n — and edit the o riginals live as needed. A Smart Objec t fro m yo ur page links to bo th yo ur o riginal layered artwo rk (the so urc e file) and an o ptimized Web-ready versio n (GIF, JPEG) that is c reated fro m within Go Live during the Smart Objec t linking pro c ess using the Save Fo r We b feature first intro duc ed in Pho to sho p. Yo u sto re the o ptimized versio n in yo ur Site Windo w so it uplo ads to yo ur Web server when yo u publish yo ur site. Any time yo u want to resize o r edit yo ur artwo rk, do uble-c lic k the Smart Objec t o n yo ur page in the do c ument windo w to o pen the so urc e file in its o riginal applic atio n (suc h as Pho to sho p). Yo u edit the o riginal and when yo u save the o riginal, Go Live auto matic ally saves a new o ptimized versio n and o verwrites the previo us o ne o nto yo ur page.

✦ Image tracing ( new to Go Live 5) enables yo u to impo rt Pho to sho p graphic s fo r use as an underlying design and layo ut guide. Many designers and art direc to rs c reate the layo ut and lo o k o f a Web page in Pho to sho p, and then give this image to the Web develo per to c ut up and lay o ut o n the page as c lo se to the Pho to sho p image as po ssible. With Trac ing Images this pro c ess is muc h easier. Yo u impo rt the entire Pho to sho p image into yo ur page, whic h basic ally func tio ns as wo uld any page bac kgro und image, enabling yo u to plac e text and images o n to p o f it. Unlike a bac kgro und image ho wever, yo u c an reduc e the o pac ity to make it a guide so yo u c an plac e c o rrespo nding images and text o ver it. In additio n, yo u c an c ut o ut sec tio ns o f the Trac ing image itself, fro m within yo ur Go Live page and, using the Save fo r Web dialo g windo w, o ptimize and save the sec tio n. Eac h c uto ut appears as a flo ating bo x in yo ur Web page in

Chapter 1 ✦ Introducing GoLive’s Features

the exac t lo c atio n o f the underlying Trac ing image layo ut. Fro m here, yo u c an c hange the po sitio n o r apply animatio n to these flo ating bo xes o r drag the image o ut o f the flo ating bo x. When yo u are finished with yo ur page and all elements line up to yo ur liking, yo u c an then remo ve the underlying Trac ing Image.

✦ Import Photoshop as HTML (new to Go Live 5) enables yo u to impo rt a layered Pho to sho p file and have eac h layer impo rt as a separate image in its o wn Go Live flo ating bo x o n a Web page. Eac h impo rted Pho to sho p layer is presented to yo u with its o wn Save fo r Web dialo g bo x so yo u c an o ptimize eac h layer independently. Yo u c an use the flo ating bo xes fo r yo ur Dynamic HTML needs o r drag the graphic s o ut o f the flo ating bo xes, delete the bo xes, and use the images as standard HTML images o n yo ur page.

✦ The Layout grid enables yo u to design a page by mo ving its elements aro und anywhere yo u want them — just like yo u wo uld within a page-layo ut pro gram suc h as InDesign, PageMaker, o r Quark. The grid is Go Live ’ s o wn inventio n — really a jazzed up table. As yo u wo rk o n the grid, Go Live is writing the c o de fo r a plain o ld (albeit intric ate) standard HTML table. Yo u c an c o nvert yo ur grid to a regular table o r turn a plain table into a grid anytime.

GoLive is for hand-coders Hand-c o ding HTML takes time — lo t o f time. As the Web and Web design bec o me mo re c o mplic ated, sites with hundreds o f pages, and advanc es suc h as JavaSc ript, Casc ading Style Sheets, Dynamic HTML (DHTML), Ac tive Server Pages (ASP), and o thers take to o muc h time to hand-c o de. Furthermo re, c o nsider all tho se sec o nds to ggling between so urc e c o de and bro wser views. Wo uld it surprise yo u to learn that they add up to ho urs that a WYSIWYG autho ring enviro nment like Go Live eliminates? No t to mentio n all the site develo pment and management to o ls at yo ur dispo sal. If yo u are building large sites fo r fun o r fo r a living, simply to o many pages, to o many links, to o muc h c o de, and to o few ho urs exist no t to take advantage o f Go Live ’s c apabilities. Fo r example, using Go Live to c reate a navb ar with let’ s say half a do zen ro llo vers may take five to ten minutes, while hand-c o ding all the JavaSc ript and defining all the image links c an take ho urs! But Go Live is no t just ab o ut WYSIWYG display. Go Live is a full-featured pro fessio nal autho ring enviro nment with intuitive to o ls to c o nc eive, c reate, maintain, and manage any level site. Using Go Live do esn’ t mean saying go o d-bye to hand-c o ding. On the c o ntrary, Go Live realizes that c ertain advanc ed and pro prietary sites require “ getting under the ho o d.” Go Live suppo rts this with its Simultaneo us Views feature, whic h intro duc es a new visual dimensio n to yo ur wo rk. With Go Live, yo u c an wo rk in c o de — and se e the results o f yo ur wo rk as yo u wo rk. Yo u c an also see a view o f yo ur layo ut in o utline view by using the Markup Tree palette (disc ussed in the fo llo wing list).

9

10

Part I ✦ Introducing GoLive 5

Serio us c o ders (and o thers) c an take advantage o f the fo llo wing features:

✦ Source Code palette sho ws yo u the HTML o f a page as yo u wo rk in Layo ut mo de in the page windo w. Open yo ur page in Layo ut mo de to see it in a visual state, and then o pen the So urc e Co de palette to c o de within. Yo u c an po sitio n eac h windo w wherever it’ s mo st c o mfo rtable fo r yo u o n the sc reen. Type yo ur c o de into the so urc e c o de, and then c lic k anywhere in the page layo ut to see the results.

✦ Markup Tree palette pro vides yo u with an o utline o f the HTML tags that lead to any item within yo ur page. Clic k a tag in the Markup tree and it bec o mes selec ted in Layo ut mo de and in the So urc e Co de palette if it is o pen. In an intric ate layo ut this c apability c an help yo u selec t any element quic kly. (Elements suc h as invisible bo rders o n nested tables and invisible GIFs c an be diffic ult to selec t with the c urso r in layo ut but an HTML tag in the markup o utline is a fullsized target to c lic k.) Yo u c an also mo ve bac k and fo rth between yo ur selec tio ns to get bac k to any item.

✦ Layout Preview simulates ho w yo ur pages will display o n vario us platfo rms and bro wsers, whic h is an inc redible timesaving develo pment to o l. Fo r example, yo u c an view a simulated display o f Internet Explo rer 4.0 fo r Windo ws o r Mac into sh, o r Navigato r 3, 4.5, o r 5 fo r Mac o r Windo ws, all in the time it takes to c lic k a pull-do wn menu in Go Live.

✦ 360 Code ensures that what yo u c o de is what yo u get. Go Live 4 parsed yo ur HTML eac h time yo u switc hed fro m the So urc e mo de bac k to Layo ut mo de, whic h c reated so me pro blems fo r no nstandard HTML c o de. By po pular demand, Go Live 5 do es no t to uc h c o de it do esn’ t understand. This means yo u c an use no nstandard HTML c o de o r sc ripting in So urc e mo de and it remains intac t.

✦ Re write Source Code c o mplements 360 c o de, enabling yo u to have Go Live rewrite yo ur so urc e c o de ( based o n Go Live ’ s Web settings, whic h yo u c an c usto mize) .

✦ Find by Element is a unique find and replac e to o l c reated spec ific ally fo r wo rking within HTML. With it yo u c an easily edit yo ur c o de.

GoLive is for scriptors and developers Go Live may be drag-and-dro p simple, but that do esn’ t mean it do esn’ t have po werful c apabilities. So me o ther enhanc ed Go Live features inc lude the fo llo wing:

✦ JavaScript Editor enables yo u to write yo ur o wn internal o r external JavaSc ripts by typing it yo urself, by dragging prewritten snippets o f JavaSc ript c o de into plac e, o r by using a c o mbinatio n o f bo th metho ds. Yo u c an use presc ripted Go Live Actio ns o r write yo ur o wn.

✦ AppleScript enables Mac users to auto mate just abo ut any task using standard AppleSc ript pro c edures.

Chapter 1 ✦ Introducing GoLive’s Features

✦ The GoLive SDK (Software Development Kit) is inc luded with Go Live 5. Yo u c an use it to c usto mize the Go Live interfac e. Fo r example, yo u c an add yo ur o wn menus o r c o mmands to Go Live’s existing menus. Yo u c an add tabs to the Objec ts palette. Yo u c an add Dialo g bo xes. Yo u c an c reate yo ur o wn Inspec to rs, and mo re. Yo u do all these by using JavaSc ript (and the built-in JavaSc ript Debugger) and XML; yo u do n’t need to be a C o r C++ pro grammer, o r to use o utside pro gramming to o ls. Go Live is all yo u need, but yo u c an c all external C libraries o n Mac and Windo ws as well.

✦ XML. Onc e upo n a time there was standard generalized markup language (SGML). It wo rked well but it was c o nsidered c o mplic ated. So pro grammers c reated hypertext markup language (HTML), a subset o f SGML that was easier fo r peo ple to understand and use. So muc h so , that HTML literally c hanged the wo rld as the Web’s gro wth explo ded. As with any expansio n, the limitatio ns o f a language c reated in 1989 demanded so me new thinking. Enter XML (extensible markup language), ano ther subset o f SGML that defines c usto m tags c alled Do c ument Type Definitio ns (DTD). Go Live’s XML suppo rt enables yo u to read and edit XML do c uments as o bjec ts in the Outline Edito r o r as text in the So urc e Edito r. Go Live rec o gnizes XML c o de and reads and writes it witho ut any pro blems, leaving the c o de intac t.

GoLive is for project managers Go Live suppo rts Web DAV to help yo u manage a c o llab o rative develo pment enviro nment. Using a Web DAV server, yo ur site is b uilt in a stage d area with permissio ns and page c hec k-o ut and c hec k-in trac king so that a page c anno t b e updated b y mo re than o ne perso n at a time. Yo ur team c an edit, add, delete, duplic ate, rename, mo ve, uplo ad, o r do wnlo ad no differently than they wo uld lo c ally using the Web DAV b ro wser tab in the Site Windo w. When yo ur site is c o mpleted, yo u mo ve it fro m staging to live fo r pub lic atio n to the o nline wo rld. ( See the next sec tio n, “Go Live is fo r large pro jec ts,” fo r details.)

GoLive is for large projects No jo b’s to o big fo r Go Live 5. It’s designed to handle site s o f any siz e . A 10,000-page site sho uld respo nd as fast as o ne that’s 100 pages. It wo n’t c o st yo u 10,000 pages’ wo rth o f memo ry bec ause Go Live handles that fo r yo u by keeping o nly the pages yo u’re wo rking o n ac tive instead o f keeping all pages in memo ry at the same time. After all, even the best Web designers c an o nly do a c ertain number o f tasks at o nc e (no t 10, 000). A large site is muc h easier to build if yo u begin with a go o d struc tural design that enables yo u to plac e info rmatio n within easy reac h o f yo ur visito rs. Go Live has an entire menu, appro priately c alled the Design menu, to pro vide site diagramming and structural re vie w . (Yo u c an learn all abo ut it in Chapter 29.) It’ll even build yo u a

11

12

Part I ✦ Introducing GoLive 5

table o f c o ntents based o n yo ur page titles. Go Live pro vides superio r site develo pment with the fo llo wing to o ls:

✦ Site Designer (new to Go Live 5) enables yo u to c reate multiple plans fo r a site, run them by yo ur c lients o r mull them o ver in yo ur o wn head, and then submit a design to Go Live. When yo u submit the design, Go Live instantly c reates the pages fo r yo u; yo u just add c o ntent. Changing yo ur mind is no t a pro blem; yo u c an rec all any page later (exc ept c o ntent-c o ntaining pages) and c ho o se ano ther layo ut.

✦ Navigation View lets yo u view yo ur site in an o rganizatio nal c hart manner. Yo u c an use it to rearrange yo ur site ’ s struc ture, to c reate new pages, and rec o rd yo ur intentio ns to link pages (by sho o ting to them, o f c o urse). The Spo tlight feature lets yo u easily see whic h pages are related to any spec ific page. Yo u c an use Navigatio n View in many ways to help yo u c learly see the big pic ture.

✦ Links View sho ws yo u all the links in yo ur site, and I do mean all, in a hierarc hic al view o f yo ur site.

✦ WebDAV enables c o llabo rative autho ring and Go Live takes that several steps further by being o ne o f the first applic atio ns to suppo rt it. In the spirit o f the Web, whic h ac c elerates c o mmunic atio n and ac c essibility, Go Live enables yo u to use WebDAV (Web Distributed Autho ring and Versio ning), a pro to c o l fo r uplo ading and do wnlo ading yo ur site ’ s files to a c o mmo n area ac c essible by an entire wo rldwide design team. With WebDAV, yo u c an be designing a page, so meo ne else is adding text to ano ther page, and yet ano ther perso n is designing a different page o r adding graphic s to the site, all at the same time. Yo u have a c ho ic e o f two file pro tec tio n metho ds: simple lo c king and unlo c king o f files o r Go Live ’ s advanc ed c hec k-o ut and c hec k-in feature. With WebDAV the wo rld just go t smaller again — and ho pefully yo ur c o mmunic atio n c o sts will dec rease to o . Note

You need access to a WebDAV server to use this feature. Servers include Microsoft IIS 5 (included w ith Window s 2000), Apache (w ith the m od_dav m odule), Novell NetWare 5.1, and Mac OS x.

Recycling with GoLive Like the saying go es, why reinvent the wheel? After yo u c reate an element, yo u do n’ t need to re-c reate it. Instead, yo u c an use it o ver and o ver again. The fo llo wing Go Live features enable yo u to use elements repeatedly:

✦ Stationery enables yo u to c reate the basic s o f a page o nc e, and then use that page as a starting po int fo r c o untless o ther pages. All yo u do is c reate the page in the same way yo u c reate any o ther page, and then save o r mo ve it into a spec ial fo lder aptly c alled “ Statio nery.” After that it’s available fro m the Objec ts palette any time yo u want it.

Chapter 1 ✦ Introducing GoLive’s Features

✦ Components pro vide a unique level o f flexibility in yo ur pages. Co mpo nents enable yo u to c reate an element o nc e, and then inc o rpo rate it into multiple pages. Yo u design a Co mpo nent in the same way that yo u c reate a page. The o nly differenc e is the fo lder in whic h yo u save it. After yo u c reate the Co mpo nent it appears in yo ur Objec ts palette. Yo u then simply drag the Co mpo nent fro m the Objec ts palette into plac e o n any page. (That’s any plac e o n any page. Eac h page c an be to tally different, exc ept fo r the Co mpo nent, o f c o urse.) Later, when yo u need to c hange an item within the Co mpo nent, yo u get to see the true glo ry o f it. Just c hange the Co mpo nent and Go Live updates every page o f whic h it is a part. Co mpo nents are useful fo r navigatio n bars and mastheads.

✦ Custom tabs in the Objects palette and Site Window enable yo u to sto re HTML snippets and o bjec ts. After yo u c reate an o bjec t, yo u c an sto re it fo r future use. To use it in any site yo u c reate using yo ur c o py o f Go Live, plac e it in the Objec ts palette’s c usto m tab. To use it o nly within the site o n whic h yo u’re wo rking, drag it into the Custo m tab o f the Site Windo w. Later, yo u c an plac e that o bjec t o n any page by just dragging it into plac e.

✦ Cascading Style Sheets add a new level o f page c o ntro l to the Web while enabling yo u, as the designer, flexibility to c hange the lo o k o f yo ur pages easily. Yo u do n’t have to kno w style sheet syntax to c reate a style sheet. In Go Live yo u selec t yo ur styling o ptio ns fro m a dedic ated Style Sheet Inspec to r. Need c o lo r? Clic k the c o lo r swatc h and c ho se it fro m the Go Live-standard Co lo r palette. Need a fo nt o r entire fo nt set? Cho o se it fro m the po p-up menu. Want margins? Enter the number into the margin fields and c ho o se yo ur measurement unit. With an external style sheet, yo u c an make a c hange ac ro ss the entire site by making o ne small c hange in the style sheet instead o f having to c hange every page. Or yo u c an link an external style sheet to just so me o f yo ur pages and effec t just tho se pages. Yo u c an have multiple style sheets, and even use mo re than o ne o n any page. Prefer internal style sheets? No t a pro blem; the same easy-to -use interfac e is there fo r yo u. In fac t, Go Live c an even c o nvert an internal style sheet to external and vic e versa. There’s a lo t mo re to this style sheet ease. I c o ver Casc ading Style Sheets fully in Chapter 17.

Creating M ultimedia and Interactive Pages Embed, c reate, animate — yo u c an do it all in Go Live. Multimedia makes the Web fun and pro vides yo u with interesting ways to say mo re in less spac e. So me o f Go Live’s multimedia c apabilities are as fo llo ws:

✦ Customized plug-in icons (and a Generic plug-in) enable yo u to e mbe d a piec e o f multimedia within yo ur page. With Go Live yo u c an add multimedia files suc h as Quic kTime o r Quic kTime VR (mo vies), Flash, Sho c kwave, LiveMo tio n (SWF files), o r Sc alable Vec to r Graphic s (SWG files).

13

14

Part I ✦ Introducing GoLive 5

These types o f animatio ns need a plug-in in the user’s bro wser in o rder to wo rk o n the user’s end. That same bro wser plug-in wo rks within Go Live when yo u plac e it in Go Live ’s plug-ins fo lder. Yo u c an also easily add Java applic atio ns. Just drag the multimedia file into the Files tab o f the Site Windo w, drag the prewritten Plug-in ic o n fro m the Objec ts palette to yo ur page, and then Po int and Sho o t fro m the ic o n to the file. The Inspec to r is also there to help yo u, as always. Of c o urse, yo u c an c reate a regular link to o , instead o f embedding yo ur multimedia file into yo ur page. Chapter 20 gives yo u the lo wdo wn o n impo rting audio and video .

✦ QuickTime suppo rt abo unds in Go Live. Quic kTime is the mo st flexible and mature applic atio n fo r implementing video and so und o n the Web, and Go Live has it big time. The Go Live Quic kTime Edito r, with the help o f a dedic ated Quic kTime tab in the Objec ts palette, enables yo u to edit an existing mo vie o r begin an entirely new o ne by starting fresh with a blank new mo vie c o ntainer, and then adding yo ur piec es. Yo u c an add multiple trac ks o f video and so und, and then use filters o r transitio ns to c o mbine them in a smo o th flo w. Yo u c an also do muc h mo re: Do yo u have an SWF file to add to yo ur site? Yo u c an build upo n that animatio n by plac ing it into a Quic kTime c o ntainer, either alo ne o r with o ther elements. Do yo u want to add a te xt trac k, live links? Yo u c an. Ho w abo ut animate d sprite s? Yo u c an c reate tho se in Pho to sho p o r elsewhere and bring them in to add animatio n and interac tivity to yo ur site. If yo ur mo vie bec o mes to o lo ng yo u c an divide it into chapte rs to o . Want to stream just a par o f yo ur mo vie, fo r reliability o r fo r c o pyright reaso ns, perhaps? That’ s as easy as dragging in a trac k and linking to it, just like yo u wo uld add any o ther effec t to yo ur mo vie. The bo tto m line is that the Go Live Quic kTime Edito r enables yo u to perfo rm the same func tio ns as in Quic kTime.

✦ DHTML animatio n is easy to c reate using Go Live ’ s flo ating bo xe s and animatio n Time Line Edito r. Flo ating bo xes give yo u the same effec t as layers do in a drawing o r graphic s pro gram, but c an do far mo re than just stac k images o n o ne ano ther. They c an be used to do so me great animatio ns. Yo u c an put any text o r image within a flo ating bo x, and then animate it by rec o rding yo ur ac tio ns o r by using the TimeLine Edito r. Ano ther effec t is to have mo useo ver ac tio ns sho w and hide a flo ating bo x when the user runs his o r her mo use o ver the trigger item. Yo u c an add several flo ating bo xes to a page to aid in the effec t. To learn abo ut flo ating bo xes see Chapter 19.

✦ JavaScript is perhaps the mo st po pular way to add interac tivity o r ac tio n to yo ur site. Go Live ric hly suppo rts JavaSc ript and c o mes with many prepro grammed JavaSc ripts, c alled Go Live Ac tio ns, ready fo r yo u to c usto mize via the Inspec to r. Drag a JavaSc ript ic o n to yo ur page and set it up in the Inspec to r o r Ac tio ns palette.

✦ ActiveX c o ntro ls c an be set up by using the Objec t ic o n fro m the Basic tab o f the Objec ts palette alo ng with the Inspec to r. Ac tiveX is primarily a Windo wso nly to o l fo r interac tive features and c an o nly be set up (and func tio n fro m) a Windo ws mac hine.

Chapter 1 ✦ Introducing GoLive’s Features

GoLive’s Web Database The secret behind GoLive’s know ledge of HTML is its Web database. All of HTML’s code is stored here, enabling GoLive to create and m anage your pages. Just in case HTML changes in som e w ay before GoLive com es out w ith an update, you can edit w ithin the Web database to accom m odate these codes. How ever, if you are a novice page designer and don ’t possess a deep understanding of HTML, do not m ess around w ith this database.

Creating Forms Fo rms enable yo u to c o llec t data fro m and send it to yo ur visito rs, and gather info rmatio n fo r suppo rt func tio ns suc h as c usto mer servic e. So me fo rms, with the additio n o f a database o n the server, enable yo u to have yo ur user searc h fo r, add o r update info rmatio n, do e-c o mmerc e, ho st bulletin bo ards, and muc h mo re. Go Live pro vides an entire tab in the Objec ts palette just fo r fo rms c reatio n. (Chapter 16 disc usses fo rms tho ro ughly.) It’ s easy to c reate fo rms, thanks to the Fo rms tab o f the Ob jec ts palette. This tab enab les yo u to b uild entire fo rms with drag and dro p ease. Fo rms c o mmunic ate b y c alling upo n an intermediary c alled a Co mmo n Gateway Interfac e ( CGI) , whic h is a mini applic atio n that c o ntains instruc tio ns. Yo u c an sto re yo ur CGI sc ript direc tly within yo ur site ’ s fo lder o r yo u c an sto re it at a mo re c o mmo n level o n the Web server. ( Yo ur Web server administrato r may have rules ab o ut this.) Either way, yo u c an easily link it to Go Live within the Fo rm tags and Fo rm Inspec to r. Dynamic Link enables yo u to write the c o de needed to have yo ur page c o mmunic ate with middleware applic atio ns, suc h as ASP (the first Dynamic Link interfac e), witho ut kno wing pro gramming. With Dynamic Link, yo u c an design yo ur page visually. When the layo ut is appro ved, yo u c o nnec t to the server that ho sts the database, and use a dedic ated Inspec to r to asso ciate (bind) yo ur sample data o r empty fo rm fields to the fields within the database. So mewhere alo ng the line, so meo ne has to design the database and put it up o n a server, but that so meo ne do esn’ t have to be yo u and yo u do n’ t have to bec o me a database pro grammer.

Tracking Your Work in GoLive Yo u need to keep trac k o f a lo t o f items as yo u c reate a site. Go Live ’ s trac king and repo rting aides allo w yo u to c o nc entrate o n c reating a site and no t wo rry abo ut where everything is. These features inc lude the fo llo wing:

✦ Multiple undos enable yo u to c hange yo ur mind abo ut an ac tio n and undo it, go ing bac k up to 20 c hanges.

15

16

Part I ✦ Introducing GoLive 5

✦ History palette trac ks the additio ns yo u make to yo ur page and what yo u do to set the o bjec t up, writing a histo ry o f them in the Histo ry palette. (Spec ific ally, eac h histo ry is a page histo ry; that is, c hanges to any page are trac ked, no t applic atio n-wide ac tio ns suc h as Preferenc e settings.) Yo u c an mo ve bac k in this histo ry, to any state o f the page, up to 20 steps bac kwards. Eac h time yo u save yo ur page o r c lo se it, the histo ry begins anew. It also c lears and begins anew when yo u switc h layo ut views, suc h as mo ving fro m Layo ut to So urc e, o r to Outline o r Preview (but no t when yo u switc h between Layo ut view and the So urc e Co de windo w).

✦ Site Reports give yo u the details o f yo ur site’s health. Yo u c an view and even print a repo rt telling yo u whic h pages need a page title, whic h take mo re than any number o f c lic ks fo r users to reac h fro m the index page, whether a page is missing attributes, and muc h mo re. In Figure 1-2, yo u c an see a Site Repo rt set up to repo rt all pages mo re than three c lic ks away fro m the site’s ho me page.

✦ Find & Replace lets yo u lo c ate anything in yo ur site, o n a page, o r in yo ur c o de. After yo u set up even the mo st intric ate searc h, yo u c an save it fo r reuse. Yo u c an also Find and Replac e in Layo ut view, in the so urc e c o de o n o ne page o r o ne fo lder, o r o n every page o n the site.

✦ File naming restrictions alert yo u to any do c uments that do n’t adhere to the name restraints yo u set up fo r it to help yo u avo id uplo ading tho se files to a server that wo n’t be able to handle them. (Predefined c o nstraints may be all yo u need, but this o ptio n is here fo r yo u just in c ase.) This feedbac k is in the usual plac es: the Status c o lumn in the Files tab, the Erro rs tab, and the File Inspec to r. (If yo u have a file set to Never Publish, Go Live wo n’t waste time c hec king o n that file.)

✦ Network Status window c aptures a lo g o f c o mmunic atio ns that o c c ur between Go Live and the FTP o r WebDAV server with whic h yo u’re wo rking. Erro rs are always trac ked and are there fo r yo u to view anytime (File ➪ Netwo rk Status). Yo u c an c ho o se whether yo u also want to view warnings and status messages (whic h c an be very helpful).

Figure 1-2: Setting up a site report

Chapter 1 ✦ Introducing GoLive’s Features

Taking Your Site Live with Ease When it’ s all said and do ne, Web site c reatio n is abo ut go ing live o n the Web. Go Live makes it easy to . . . well, go live. In fac t, Go Live gives yo u three o ptio ns fo r getting yo ur site o nto the Web. One o f tho se lets yo u set yo ur site up to well, go anywhere. Go Live even enables yo u to edit yo ur site live o n the Web. The fo llo wing are Go Live ’ s three site-publishing interfac es:

✦ Site Window FTP enables yo u to uplo ad yo ur files with a c lic k o r a drag and see yo ur files o n the server in a side-by-side listing, next to yo ur files tab. The Inc remental Uplo ad and Uplo ad Mo dified Files Only features make it easy to keep yo ur site up-to -date as it evo lves.

✦ FTP Browser is a generic FTP c lient that yo u c an use at any time to get to any server. This adds c o nvenienc e when yo u’ re wo rking o n o ne site and need to ac c ess a site o n ano ther server. It’ s handy fo r uplo ading o ne-o ff items, suc h as files that go to a Streaming Server.

✦ Export enables yo u to c reate a Web-ready fo lder that yo u c an pass o n to c lients, arc hive, o r FTP to a Web server using the FTP Bro wser o r a third-party FTP pro gram. Go Live has Web site design features and c apabilities fo r beginners, designers, c o ders, sc ripto rs, develo pers, and pro jec t managers — and yo u c an take advantage o f it no w. Do n’ t wo rry abo ut learning all o f its features. In fac t, many peo ple who have suc c essfully c reated well-designed, po pular sites have do ne so witho ut kno wing muc h o f what is c o vered in this bo o k. Yo u c an start using Go Live with o nly a frac tio n o f what’ s in this bo o k — altho ugh, o f c o urse, I ho pe this bo o k o ffers a lo t mo re info rmatio n that yo u’ re no t likely to kno w intuitively. Yo u c an build yo ur site and take it live — and then start experimenting with o ther features o f Go Live o r o ther interesting effec ts yo u c an add to yo ur site. Go Live is great as an updating to o l so yo ur site c an c o ntinue to evo lve. If yo u’ re new to Go Live, I rec o mmend that yo u read Chapter 2, whic h intro duc es the way Go Live wo rks. Yo u’ re welc o me to read Chapters 3 and 4 o f c o urse, but to fo llo w the pro gressio n o f learning, read Chapters 5–14 and 17, whic h pro vide the best fo undatio n. If yo u’ re an o ld hat at Web design but new to Go Live, yo u definitely want to read Chapters 2 and 5 so yo u c an impo rt a site to wo rk o n and then get started. Fro m there, go o n to whatever strikes yo ur fanc y.

✦

✦

✦

17

2

C H A P T E R

Getting to Know GoLive’s Interface

A

s yo u use Go Live with the help o f this bo o k, yo u’ ll bec o me mo re familiar and c o mfo rtable with Go Live ’s interfac e. Thro ugho ut this bo o k, as yo u c all upo n any part o f its interfac e I give yo u the steps c learly and c o nc isely. Ho wever, it’s always best to have a go o d fo undatio n to build upo n. This c hapter is yo ur Go Live fo undatio n. As yo u add pages, graphic s, and o ther elements to yo ur Web site, yo u ac c umulate many individual files that must be sto red where they ’ re ac c essible, and then uplo aded to the Web server when it’s time fo r yo ur site to go live. Yo u need to remember to uplo ad all files in yo ur site, and yo ur pages need to be able to find these files — o r yo u’ ll end up with bro ken images and bro ken links. Go Live so lves this pro blem, trac king and managing yo ur files fo r yo u in o ne easy-to -use plac e. Yo u do n’ t have to keep remembering where yo u sto red all the files yo u use, and c o ntinually switc h fro m Go Live bac k to the Windo ws deskto p o r the Mac into sh Finder to mo ve them aro und. Yo u do n’ t have to wo rry abo ut remembering to get them to the server. And yo u do n’ t have to wo rry abo ut bro ken links.

M eeting the GoLive Visual Team When yo u c reate a new site, Go Live c reates a file c alled the site do c ument, alo ng with two fo lders where it sto res all o f the site ’s files. Eac h time yo u want to wo rk o n a site, yo u just o pen its site do c ument. This file keeps trac k o f everything yo u do ; as yo u build and design the site, it no tes what yo u’ re do ing. The site do c ument isn’ t like a typic al do c ument, tho ugh; yo u do n’ t see it as a page, but as so mething c alled the Site Windo w

✦

✦

✦

✦

In This Cha pter Disco vering the Site W indo w Explo ring the palettes N avig ating the pag e windo w O rg anizing files Intro ducing Po int and Sho o t O rg anizing yo ur screen Previewing yo ur pag es G o ing live

✦

✦

✦

✦

20

Part I ✦ Introducing GoLive 5

instead. In Figure 2-1, yo u c an see a site do c ument and its c o rrespo nding Site Windo w. No tic e that everything within the Site Windo w is also within the site ’s ac tual fo lder, alo ng with the site do c ument.

Figure 2-1: A site docum ent (left) and the Site Window it becom es (right). Everything created or organized in the Site Window happens in the site’s actual folder.

The Site Windo w is yo ur main site management interfac e. It c o ntains all the elements b elo nging to yo ur site. The Site Windo w is also ho me to external URLs ( fo r easy ac c ess) , c usto m c lippings yo u c reate fo r reuse, erro r c hec king, and mo re. On to p o f that, it enab les FTP ac c ess so yo u c an get yo ur site o nto the Web server, and Web DAV ac c ess fo r c o llab o ratio n with o ther Web site designers. Using the Site Windo w, yo u c an even c o nnec t to yo ur server and edit a page o n the spo t, even tho ugh yo u’ ve already po sted it. ( The Site Windo w is disc ussed in mo re detail later in this c hapter.) Yo ur next main interfac e is the Inspe cto r — Go Live ’ s Swiss Army knife. Rather than sending yo u o n a menu hunt, Go Live fo c uses its main c o ntro ls within this single palette. This c o uld c ertainly b e a very b usy, c luttered windo w, b ut it’ s no t. It’ s ac tually very c lean, simple, and elegant. Why? Bec ause the Inspec to r is co nte xt se nsitive — it o nly displays the c o ntro ls relevant to the selec ted page element. Fo r example, Figure 2-2 sho ws the Inspec to r palette transfo rmed into the Tab le Inspec to r b ec ause a tab le is selec ted. Go Live simplifies the pro c ess o f setting and c hanging o b jec t attrib utes b y b ringing them to gether in this single palette. Of c o urse, at the heart o f a Web site is its pages. Go Live ’ s page-c reatio n windo w is also c lean and effic ient. In o ne simple-lo o king tabbed windo w Go Live gives yo u a page o n whic h to design visually, a full HTML pro grammer’ s view, and a unique o utline view o f HTML that pro vides the po wer o f wo rking direc tly in HTML witho ut reading thro ugh a maze o f tags, attributes, text, and c o mments. Also in the page windo w is a Preview mo de that, alo ng with so me c ho ic es in the Inspec to r, enables

Chapter 2 ✦ Getting to Know GoLive’s Interface

yo u to get an ac c urate idea o f ho w yo ur page will lo o k in a bro wser. To pping the page windo w is the c o ntext-sensitive to o lbar, whic h o nly displays c o ntro ls that fit the view yo u’ re wo rking in. (Yo u c an see a page and to o lbar abo ve, in Figure 2-2; to o lbars are disc ussed later in this c hapter.)

Figure 2-2: The Inspector changes to show the controls for the attributes of a selected table. (Also show n is the page and the full toolbar in Window s.)

Aiding yo u further in yo ur quest fo r the perfec t Web page is the Objec ts palette, fro m whic h yo u c an drag the nec essary items o nto the page. Its windo w-mate, the Co lo r palette, enables yo u to plac e virtually any c o lo r o n yo ur page, and even pic k up c o lo rs fro m anywhere o n yo ur sc reen. Fo r linking and site planning, yo u have the In & Out Links palette (see Figure 2-3), whic h sho ws yo u all pages that link to a selec ted page as well as all files used o n that page — and enables yo u to c hange any o f tho se linked items o r pages. It c an also sho w yo u every page o n whic h a URL, c o lo r, fo nt set, o r partic ular graphic /media file is used — and let yo u c hange that item ac ro ss all o f tho se pages at o nc e. The In & Out Links palette is so c alled bec ause it sho ws all links in and o ut o f the selec ted element. When yo u selec t a page, it sho ws yo u the elements o n that page as well as any pages in yo ur site to whic h the selec ted page is linked to . When yo u selec t ano ther o bjec t (suc h as a graphic o r external link) the In & Out Links palette displays the pages that inc lude o r link to that o bjec t.

21

22

Part I ✦ Introducing GoLive 5

Figure 2-3: The In & Out Links palette

As yo u build yo ur site, the Design menu pro vides yo u with vario us interac tive maps o f yo ur site. In the Navigatio n windo w, yo u c an see all existing pages and their relatio nships to o ne ano ther (bo th ac tual and pending). In its partner, the Links view, yo u c an see all pages within yo ur site, and the way every page links to o ne ano ther. Then there ’ s the Site Designer, whic h pro vides yo u with endless blank design c anvases o n whic h yo u c an plan yo ur entire site, o r new sec tio ns fo r it. Designs yo u make o n the design c anvas c an be submitted to yo ur site and used as real pages, o r they c an remain as visualizatio ns. The Windo w menu c o ntains several mo re palettes, as well. Eac h is dedic ated to o ne Go Live ability and presents just what yo u need in a c lear, unc luttered way. Palettes are gro uped into six windo ws, lo gic ally gro uped so yo u o nly need to be using o ne palette within a gro up at any time. To make life even easier, yo u c an te ar o ff any palette and let it stand alo ne o r mo ve it to ano ther windo w. (Mo re o n that later under “ Explo ring the Palettes.” ) Altho ugh yo u wo n’ t need to travel to them o ften, Go Live ’ s menus pro vide so me helpful features. Fo r example, yo u c an view do c ument statistic s to get an idea o f the time it will take fo r visito rs to do wnlo ad (and therefo re see) yo ur page. Yo u c an also view do c ument statistic s fo r an individual file. This c an help yo u dec ide whether a partic ular graphic is wo rth using. The menus are also the ho me to a spell c hec ker that c an c hec k a single page o r yo ur entire site. And then there ’ s the amazing, fullfeatured site repo rt. Amo ng o ther things, it c an tell yo u ho w many pages are mo re than, say, three links always fro m yo ur ho me page! Or, it c an tell yo u if yo u’ ve fo rgo tten to give yo ur page a title — whic h yo u also definitely want to kno w if yo u want an effec tive, impressive site. Note

There’s m ore stuff, too; things that let you dig into HTML, JavaScript code, Cascading Style Sheets, GREPs, and m ore. But I’ll get to that all later in the book. For now, I’ll concentrate on the basic page/ site design interfaces.

Chapter 2 ✦ Getting to Know GoLive’s Interface

Discovering the Site Window The Site Windo w is where it all starts. It’ s the hearth o f the Go Live ho me. Eac h time yo u c reate a new blank site, o r impo rt a site, Go Live c reates a site do c ument and o pens it, whic h in turn o pens up a new Site Windo w fo r yo u. This Site Windo w is yo ur main interfac e to yo ur Web site. It’ s where yo u sto re the files that are part o f yo ur site, c o llec t and see external links (links to o ther Web addresses, e-mails, and so o n), and find c o lo rs and fo nt sets yo u use o r want to use. It’ s where yo u c an see and plan the layo ut o f yo ur site. Befo re yo u plac e any element o n yo ur page, yo u add it to the Site Windo w by dragging the item fro m the hard drive (o r CD-ROM o r o ther mo unted drive) into the Files tab o f the Site Windo w. If dragging is no t yo ur style, yo u c an use the Add Files windo w. Sho uld yo u dec ide yo u do n’ t want to use so mething yo u added to the Site Windo w, just selec t its ic o n in the Site Windo w and delete it. Yo ur pages live here, to o — easily added whether pre-existing o r new. To o pen a page fo r editing and develo pment, yo u do uble-c lic k that page ’ s ic o n here in the Files tab. If erro rs o c c ur in yo ur site, they are repo rted here. A bad link within a page is depic ted by a green bug in the Files tab, as is a bad external URL in the External tab. All referenc ed o r po tential c o lo rs and fo nt sets c an also be sto red within the Site Windo w fo r easy ac c ess and sharing between sites. There ’s also a Custo m tab here, waiting to c o llec t yo ur o wn c reatio ns so yo u do n’ t have to reinvent the wheel. When yo u are ready to send yo ur site to yo ur Web server, yo u c an also do it fro m here. Figure 2-4 sho ws the Site Windo w fo r a new site, c alled MySite. No extra pages, graphic s, media files, and so o n have been added to the site yet. Therefo re, o nly the first, auto matic ally c reated page, c alled index.html by default, is in the Site Windo w. (It c o uld also have been c reated as default o r with .htm instead o f .html; there ’ s a preferenc e to c o ntro l that.)

Figure 2-4: A new Mac Site Window for a site nam ed MySite

The Site Windo w wo rks in c o njunc tio n with yo ur c o mputer’ s o perating system. Whenever yo u add a file to this windo w, it is auto matic ally c o pied into a parallel fo lder o n yo ur c o mputer, so the o riginal file is no t mo ved fro m its plac e o n yo ur

23

24

Part I ✦ Introducing GoLive 5

hard disk. Instead o f dragging things in and o ut o f the fo lders o n yo ur hard drive, yo u mo ve them aro und in the Site Windo w. When yo u add a new fo lder to the Site Windo w and name it, Go Live makes and names a new fo lder o n yo ur hard drive. By plac ing things in the Site Windo w, yo u are sto ring them in o ne c entral plac e, enabling yo urself to use that element o ver and o ver again. But mo re than that, yo u enable Go Live to keep trac k o f that item ’ s usage, and in the c ase o f linked page elements, to swap o ne fo r ano ther. Note

Because the Site Window is the key to your Web site, it should be open w henever you ’re w orking on the site. Should you close it w hile you are w orking, reopen it to continue. You can double-click the site docum ent again, or choose it from File ➪ Open Recent Files. Recent site docum ents appear at the top. Individual pages appear at the bottom of this list. You w ant to be sure to open a site docum ent w hen you w ish to w ork on a site.

The Site Windo w c o ntains the same c o ntro ls yo u’ d expec t fo r any windo w yo u o pen o n yo ur c o mputer:

✦ In Windo ws, the upper-right c o rner c o ntains the usual butto ns to minimize, maximize, and c lo se yo ur windo w, respec tively fro m left to right.

✦ On the Mac , the title bar has a Clo se bo x at the to p left and Resize and Co llapse bo xes at the right. in additio n, it bec o mes a tabbed po p-up windo w when dragged to the bo tto m o f yo ur sc reen. Tip

While you are concentrating on your page’s design, you m ay find the Site Window intrusive, but as I said, you don ’t w ant to close it. On each platform there’s a platform -ish solution. In Window s, you can m inim ize the Site Window. On the Mac, you have som ething sim ilar to tabbed folders: drag it to the bottom of your screen until it tabs. Click its tab to restore it. Yet another feature to help you is the Select Window button. See the “ Organizing Your Screen ” section later in this chapter.

Focus on Your Site By Lynne LaM aster, Specialized Publishing (www.specialpublish.com) Certified Expert in Photoshop As you design your site, rem em ber that it ’s im portant that your site be focused. In other w ords, you need to know w hy you are going to have an Internet site in the first place. When I m eet w ith clients, I have a questionnaire that w e fill out together. Here are som e of the things w e consider:

1. What is the purpose of the site?

• •

To sell To educate & inform

Chapter 2 ✦ Getting to Know GoLive’s Interface

• •

To com m unicate Combination of some or all of the above? Which is primary?

2. Who do I w ant to reach?

• • •

Potential clients? Other professionals in m y field Friends and fam ily

3. What do I need to present in order to achieve m y purpose?

• • • • •

Graphics & im ages: logos, illustrations, textual graphics, color Photographs: exam ples, visual rest, people Factual inform ation: statistics, straight inform ation, graphs and charts Opinionated Inform ation: regular articles, pull quotes Nonchanging elem ents: logo, header, navigation elem ents, background

4. How do I reach m y potential audience?

• • • •

Find them Attract them Give them w hat they desire Sell them m y stuff

5. How do I present m y inform ation in order to attract and keep m y audience interested?

• • • • • • • • • •

Fast dow nload Well-planned pages Strong use of color Optim ized visual graphics A site w ith “focus” Well-presented, relevant inform ation Something for them to “keep” Easy to navigate A w elcom e feeling Easy-to-find contact inform ation Continued

25

26

Part I ✦ Introducing GoLive 5

Continued

If you can ’t answ er questions 1 and 2, you ’re not ready to create a site. Here’s the trick: m ake sure that everything on the page relates to the first point above: What is the purpose of m y site? For exam ple:

✦ Perhaps for a fabric or clothing site, you have a background that looks like a w onderfully textured piece of fabric (keep it subtle, though.)

✦ A m usic clip w ould not be appropriate at a pharm aceutical site. It w ould probably need a plug-in for the brow ser and take a long tim e to dow nload. This w ill be irritating and people w ill leave.

✦ If it ’s a realty site, m ake sure it has pictures of property —nice, clear pictures. Step out of the role of the designer and think about potential visitors. Then go ahead and design your site —w ith them in m ind.

The main part of the Site Window The Site Windo w has six tabs:

✦ Files tab ✦ External tab ✦ Designs tab ✦ Co lo rs tab ✦ Fo nt Sets tab ✦ Custo m tab To gether, these tabs c o ntain and manage all o f the different kinds o f elements in yo ur site.

The Files tab The File s tab ho lds all o f the files that are physic ally part o f yo ur site. Yo ur pages, the .html do c uments, are the main piec es sto red there. All o f the graphic s yo u plac e o n yo ur pages are also sto red there. So are so unds, Quic kTime mo vies, o r o ther animatio ns, suc h as LiveMo tio n o r Flash. If yo u pro vide files fo r yo ur visito rs to do wnlo ad, tho se are plac ed here to o . External Casc ading Style Sheets and JavaSc ripts share the spac e, as do CGIs. If yo u inc lude o ther types o f pages, suc h as Ac ro bat PDFs o r Web pages made in o ther pro grams, they are also sto red here. To plac e an

Chapter 2 ✦ Getting to Know GoLive’s Interface

item into the Files tab, yo u simply drag it fro m yo ur hard drive, disk, CD-ROM, and so o n. (Or c ho o se Add Files to c o llec t them.) No matter where yo u drag a file fro m, Go Live c o pies the file, leaving the o riginal intac t. If yo u drag an entire fo lder into the Files tab, the entire fo lder and all o f its c o ntents are c o pied. When yo u c reate a page and put a graphic o n that page, the lo c atio ns o f eac h — bec ause they ’ re in this tab — are trac ked. If yo u mo ve either the page o r graphic later o n, and it c o ntains links o f any so rt, Go Live no tic es and asks yo u fo r permissio n to update the links (a.k.a. paths) to the mo ved file. This enables yo u to o rganize and reo rganize yo ur site as yo u wo rk. The Files tab also repo rts the integrity o f the pages in yo ur site. If any page c o ntains an inc o mplete o r inac c urate link, a green bug alerts yo u. Widen the c o lumn and yo u see a mo re detailed text message, stating the nature o f the erro rs and number o f erro rs. Missing pages o r pages no t yet wo rked o n are also repo rted. If yo ur pages are within a fo lder, yo u’ ll see a smaller versio n o f the Erro r ic o n beside a fo lder-type arro w. When a page ’ s links are all intac t, a c hec kmark info rms yo u. This tab also displays file types and sho ws the URL fo r eac h file in relatio n to yo ur site. As this tab is used to ho ld so muc h, its use is c o vered in several c hapters thro ugho ut this bo o k. In Figure 2-5, yo u c an see a Site Windo w and so me erro rs repo rted.

Figure 2-5: A Site Window (Window s) as a site is in progress

Within the Files tab , fo lders c an b e sto red in sub fo lders, just like files always c an b e. To reveal the c o ntents o f a fo lder o n the Mac , the arro w b eside the fo lder reveals the fo lder’ s c o ntents. In Windo ws, yo u c lic k the plus sign ( same func tio n, different system-like ic o ns) . Yo u c an also do ub le-c lic k a fo lder to make it the main fo c us o f the Site Windo w ’ s view. Then, to get b ac k to the main fo lder, c lic k the b lue arro w ( Mac ) o r upward-po inting fo lder ( Windo ws) ab o ve the Files list and b elo w the Files tab . Beside that Fo lder Navigatio n ic o n is the path to the fo lder yo u’ re c urrently within. Yo u’ ll read plenty ab o ut using the Files tab thro ugho ut this b o o k as its use c o mes up o ften.

27

28

Part I ✦ Introducing GoLive 5

The External tab The Exte rnal tab c an (and sho uld) be used to ho ld all o f the referenc es to elements that yo u c all fo r within yo ur site but really reside o utside o f yo ur site. Unlike the Files tab, whic h ho lds ac tual files, this tab ho lds markers that no te the addresses o f the pages, files, o r e-mail addresses to whic h yo ur page links. By c reating an address element in this tab, yo u enable yo urself to c all upo n that address multiple times witho ut having to enter the address o ver and o ver. Mo re impo rtantly, if yo u take advantage o f this tab, yo u c an c hange an address here just o nc e (via the Inspec to r) and Go Live will update the address thro ugho ut yo ur site. (Go Live asks first, o f c o urse. Yo u c an tell it no t to c hange spec ific links, o r any links, if yo u want.) Yo u have many ways to plac e addresses in this tab, as yo u c an learn in Chapter 11. This tab also displays eac h address and no tes whether yo u’ ve used it yet by plac ing a bullet in the Used c o lumn, as yo u c an see in Figure 2-6. When yo u’ re c o nnec ted to the Internet, a Green Bug ic o n in the Status c o lumn c an even alert yo u when a partic ular URL is no t valid by selec ting Site ➪ Chec k External Links.

Figure 2-6: The External tab w ith an address selected. The Inspector, also show n, enables its editing of the selected address w hile the In & Out Links palette, also show n, inform s you of pages that use this address.

While in the External tab, the Inspec to r enables yo u to enter o r edit the external addresses while its c o mpanio n, the View Co ntro ller, lets yo u determine whic h c o lumns are visible. The In & Out Links palette plays its usual two ro les here: yo u c an view all pages that use an address, and yo u c an substitute any address with ano ther address within yo ur External tab. Yo u c an learn mo re abo ut the External tab and all o f these features in Chapter 11, whic h c o vers links in detail.

Chapter 2 ✦ Getting to Know GoLive’s Interface

The Designs tab The De signs tab is ho me to any site designs yo u experiment with as yo u design yo ur site. The Design tab sho wn in Figure 2-7 o nly pro vides a list o f eac h design yo u c reate using the Design menu. Ho wever, do uble-c lic king any design listed here o pens a windo w dedic ated to that partic ular design. (Yo u c an have several design windo ws o pen at o nc e to c o mpare designs.)

Figure 2-7: The Designs tab reports all site designs you ’ve experim ented w ith.

CrossReference

The Site Design w indow is explained fully in Chapter 29, w hich is all about using the GoLive Site Designer to plan your site.

The Colors tab Co lo rs can po p up all o ver yo ur pages. Text, table o r grid backgro unds, page backgro unds. . . . The Co lo rs tab enables yo u to reco rd o f all co lo rs yo u may use o r do use in yo ur site. Co lo rs saved here also appear in a dedicated tab o f the Co lo r palette, pro viding easy access. Yo u can place a co lo r in the Site Windo w befo re yo u use it — making it handy when yo u’ re ready fo r it. In fact, it awaits yo u in yo ur o wn special tab (called the Site tab) in the Co lo r palette. Or, yo u can use it first, and then have Go Live gather it fo r yo u. Either way, sto ring a co lo r in the Site Windo w o ffers several benefits. When a c o lo r’ s in this tab, yo u have feedbac k that it’ s o ne o f the 216 Web-safe c o lo rs o r no t. Here, yo u c an also see whether yo u’ ve used the c o lo r yet. Ano ther benefit o f sto ring a c o lo r in the Site Windo w is that yo u c an easily c o py that c o lo r into any o ther site ’ s Site Windo w fo r use in that o ther site. To use a c o lo r in ano ther site, just o pen that site ’ s Site Windo w and drag the c o lo r fro m yo ur c urrent Co lo r tab to the o ther site ’ s Co lo r tab. By c lic king a c o lo r within the Co lo rs tab and c hec king the In & Out Links palette, yo u c an see exac tly whic h pages yo u’ ve used the c o lo r in so far, as sho wn in Figure 2-8. (All pages that use this c o lo r appear to its left, leading into it.) Ho wever, unlike files and external addresses, c o lo rs c an’ t be swapped within pages by using any o f these windo ws. (That’ s bec ause the c o lo r info rmatio n isn’ t linked, but is embedded within the page ’ s HTML c o de. No tic e that no Po int and Sho o t butto n exists there.) Changing a c o llec ted c o lo r within the c o lo r’ s Inspec to r c hanges the c o lo r listed in the Co lo r tab fo r future use, but do esn’ t c hange instanc es where the prio r c o lo r was already used.

29

30

Part I ✦ Introducing GoLive 5

Figure 2-8: The Colors tab of the Site Window and the In & Out Links palette, w hich reports use of colors

Note

Because colors are used all over your site, and you ’ll need to know how to use them right aw ay, color is covered in detail later in this chapter. The other tabs of the Site Window are m ore targeted to one specific purpose, so they’re each covered later in the book, w here they’re m ore pertinent.

Collecting colors in the Site Window To auto matic ally c o llec t c o lo rs into the Co lo rs tab after it’ s used in yo ur page, fo llo w these steps:

1. Clo se all o pen pages, bec ause c o lo rs c anno t be c o llec ted fro m an o pen page. 2. Bring the Site Windo w fo rward and c lic k the Co lo rs tab to make it ac tive. 3. Then c ho o se Site ➪ Get Co lo rs Used. (Yo u c an also c lic k the Update butto n o n the to o lbar, but it will o nly get c o lo rs when yo u’ re in the Co lo rs tab.) The c o lo rs auto matic ally appear in a fo lder named New Co lo rs. • Yo u c an rename this fo lder by selec ting the name and typing a new o ne in either the Co lo rs tab o r in the Inspec to r. • Yo u c an mo ve the c o lo rs o ut o f it by dragging the c o lo r’ s ic o n. • Eac h c o lo r is named “ untitled c o lo r,” “ untitled c o lo r 1,” and so o n. To rename a c o lo r, selec t its name in the list and type the new name. (Or selec t the c o lo r and then rename it in the Inspec to r.)

Even if yo u mo ve o r rename a c o lo r, Go Live still kno ws yo u c o llec ted that c o lo r already and wo n’ t gather it again. Tip

The Update button alw ays perform s w hichever update or scan option is appropriate for the tab that ’s active in the Site Window. Therefore, in the case of colors, because the Colors tab of the Site Window is active, the Update button does the sam e thing as Site ➪ Get Colors Used.

Yo u c an also manually add a c o lo r to yo ur Site Windo w. I’ ll sho w yo u the Co lo r palette a little later in this c hapter. Fro m the Co lo r palette, yo u c an drag a c o lo r

Chapter 2 ✦ Getting to Know GoLive’s Interface

into the Site Windo w ’ s Co lo rs tab. ( By the way, if yo u do , the Co lo rs tab may no t be ac tive when yo u get to the Site Windo w, but rest o ver the Co lo rs tab and it jumps fo rward fo r yo u.) The c o lo r c o mes in with its name, “ untitled c o lo r,” auto matic ally selec ted so yo u c an type a desc riptive name fo r it. That name assigned here also appears in yo ur Co lo r palette ’ s site tab, but is o nly fo r yo ur o wn benefit.

Removing colors from the Site Window To remo ve a single c o lo r fro m the list, selec t that c o lo r and c lic k the Trash butto n o n the to o lbar. To remo ve all unused c o lo rs fro m the Site Windo w ’ s Co lo r list, selec t the Co lo r tab again and c ho o se Site ➪ Remo ve Unused Co lo rs.

The Font Sets tab A fo nt se t is a list o f fo nts that yo u c an assign to text blo c ks. The fo nt set lists, in o rder, the fo nts yo u prefer fo r the display o f yo ur text. When a user’ s bro wser reads the set, it c ho o ses the first fo nt it rec o gnizes as ac tive o n the user’ s c o mputer to render that text. Fo nt sets c an be applied to any o c c urrenc e o f text o n yo ur page, o r they c an be used in a style sheet, whic h is far mo re flexible and generates far less c o de in yo ur page. The Fo nt Sets tab is muc h like the Co lo rs tab. Yo u c an c o llec t yo ur fo nt sets here, see whether yo u’ ve used a set, and selec t it to have the In & Out Links palette sho w yo u exac tly where yo u’ ve used it, but yo u c an’ t substitute o ne fo nt set fo r ano ther within pages where a fo nt set is already used. Chapter 8 fully c o vers fo nt sets and this tab.

The Custom tab The Custo m tab enables yo u to c o llec t snippets o f text and HTML c o de so yo u c an use them again and again at any time within Layo ut mo de o r So urc e mo de as yo u c reate yo ur site. To take advantage o f it, just drag selec ted text into this tab, and then drag the snippet o ver to any page later o n. Yo u c an also reuse graphic s and even c o mpilatio ns o f items, suc h as entire tables o r a page fo o ter with yo ur c o pyright info rmatio n. Yo u c an also drag entire o bjec ts into this tab. Yo u see the same Untitled Snippet ic o n and the c o ntent lists the c o de, but when yo u drag this snippet bac k o nto a page, its c o de desc ribes the o bjec t and yo u have a c o py o f yo u dragged-o ver o bjec t to enjo y. Unlike the o ther tabs o f the Site Windo w, items in this tab are no t displayed within the In & Out Links palette. Yo u c an learn mo re abo ut the Custo m tab and its use in Chapter 14, whic h c o vers all reusable items. Note

Item s that you place in the Custom tab of the Site Window are available only w hen you have the Site Window open. If you w ould like a custom item to be available to you in all your sites, place it in the Custom tab of the Objects palette.

31

32

Part I ✦ Introducing GoLive 5

Color Designing Your Web Site By Bob Stein, VisiBone (www.visibone.com), maker of several printed and online color resources for Web designers How do you find great color? How do you im plem ent it on a Web site? Color on the Web is a collision of intuition and logic. The artiste in you know s great color w hen you see it. The curious cat in you tinkers the technology into delivering it. Color can decorate and m ake m ood, like the blush of m orning on a bedroom w all, the lurid grow th after a spring rain or the dream -catching distance of a clear horizon. Color can inform and em pow er w hen it resonates w ith the structure of a site. Use color schem es for recognition, like the sections of Am azon.com , or use it to m ark off com plexity like the headings on IMDB.com . This pow er is lost w ithout superhum an stability and consistency. Finding great color is an essential art. I distrust form ulas for com patible colors about as m uch as I distrust com puter m atchm aking. They’re blind to the enorm ous talent you have to bring to the task. Besides m illions of generations of chrom atic sight entw ining em otions w ith colors, you ’ve had a lifetim e of observation. It all counts tow ard a set of colors appealing or not, im pressing or not, annoying or not. I suggest the best m achine w e have for predicting these effects is reading these w ords right now. You ’re designed to recognize in less than one breath: friend, foe, beauty, nourishm ent, danger, opportunity. When you color a lip or a car or a Web site, you ’re exploiting this legacy to attract attention, to com pel, to seduce. So I m ade a free online tool w ith w hich to feed your intuition hundreds of color com binations in a few m inutes: the Webm aster’s Color Lab. All the colors are sym m etrically arrayed. Every click chooses or rem oves one, changing the schem e. It ’s your 21st-century version of an artist ’s paint box. Use the force, Luke, and you w ill take our breath aw ay. You can find the Webm aster’s Color Lab at www.visibone.com/colorlab or on the CD-ROM at the back of this book. As technology m atures, that second part of the colorsm ith ’s challenge w ill dim inish. It now loom s large. Because of the lim itations of m onitors, netw orks, and the coding of content and presentation, the Web artist is forced to becom e a Web technician. This is w hy there’s a profession for the fusion of these talents: Web designer. Web designers m ust m aster the num bing intricacy of Web m achinery, and they m ust divine and express vision. When com bined seam lessly, w hen a site w orks and looks great, w hen form m akes love w ith function, it is true brilliance. For m ore on color lim itations, see the sidebar, “ Web-Safe Color at the Century’s Daw n,” later in this chapter.

Viewing the “hidden” part of the Site Window The Site Windo w also c o ntains a sec o nd sec tio n, hidden by default. To reveal and ac c ess this sec tio n, c lic k the do uble-headed arro w at the bo tto m right o f the Site

Chapter 2 ✦ Getting to Know GoLive’s Interface

Windo w. Do ing so o pens a new sec tio n at the right. This sec tio n c o ntains fo ur mo re tabs:

✦ Erro rs tab ✦ Extras tab ✦ FTP tab ✦ WebDAV tab File ac c ess within this “ hidden” part o f the Site Windo w wo rks just like ac c ess within the main part. Yo u c an resize the pro po rtio n o f the left and right sec tio ns by mo ving the mo use o ver the sec tio n dividing line in the c enter and dragging when the po inter bec o mes a hand.

The Errors tab The Erro rs tab sho ws yo u any missing o r o rphaned files. Orphans are files that need to be c o pied into yo ur Site Windo w. To fix them, yo u just drag the o rphan o ver to the desired fo lder in the Files tab. Missing files are tho se Go Live c an’ t lo c ate o n yo ur hard drive. They need to be fo und and then dragged to the Files tab. CrossReference

Chapter 25 provides the com plete story of the Errors tab.

The Extras tab The Extras tab, sho wn in Figure 2-9, c o ntains the fo llo wing fo ur fo lders:

✦ The Components fo lder ho lds any c o mpo nents yo u c reate to use within yo ur site. Co mpo nents are an easy-to -use way o f enabling yo u to c reate so mething o nc e and use it multiple times, and update it ac ro ss all pages at o nc e. After yo u c reate a Co mpo nent, yo u add it to yo ur pages via the Site Extras tab o f the Objec ts palette, no t direc tly fro m this fo lder. Fo r mo re info rmatio n abo ut Co mpo nents, see Chapter 14.

✦ The Designs fo lder c o ntains all o f the pages-to -be that yo u c reate within eac h site design yo u experiment with to plan yo ur site. The Site Designer is explained fully in Chapter 29.

✦ The Site Trash fo lder ho lds all files yo u delete unless yo u c hange the preferenc es to send yo ur deletio ns to yo ur c o mputer’ s ac tual trash. Dragging a page o r file into this fo lder keeps yo ur files safe and maintains its links in c ase yo u dec ide yo u want to use it after all. Clic king the Trash Can ic o n to send a page o r file here keeps the file safe within yo ur site ’ s files but do es no t trac k the file ’ s link. To use a file, drag it bac k into the Files tab. To permanently delete it, selec t it in the Site Trash fo lder and use the Delete/ Bac kspac e key.

33

34

Part I ✦ Introducing GoLive 5

✦ The Stationeries fo lder ho lds pages yo u c reate as starting po ints fo r mo re pages later o n. As with Co mpo nents, yo u add yo ur Statio nery to yo ur site via the Site Extras tab o f the Objec ts palette, no t fro m within this fo lder. Fo r mo re info rmatio n o n Statio nery, see Chapter 5.

Figure 2-9: The Extras tab of the Site Window holds your Com ponents, designs, files you send to the site trash, and finally, it holds Stationery.

The FTP tab The FTP tab enables yo u to uplo ad yo ur site to the Web with the c lic k o f the Uplo ad to Server butto n, the c ho ic e o f the Uplo ad Mo dified Items c o mmand, o r by dragging the files fro m the Files tab o ver to the FTP tab. FTP is disc ussed fully in Chapter 27.

The WebDAV tab Go Live 5 ushers in a new era o f c o llabo rative design as o ne o f the very first applic atio ns to suppo rt and build upo n WebDAV. WebDAV, whic h is sho rt fo r Web Distributed Autho ring and Versio ning, enables multiple users to ac c ess a server (the WebDAV server) simultaneo usly o r separately in o rder to build the pages o f a site. Users c an preview and edit pages witho ut the fear that so meo ne else is also wo rking o n c hanges to the same page and c ausing wo rk to be lo st, bec ause it enables yo u to lo c k a page while yo u need to make c hanges to that page. Go Live builds upo n WebDAV by adding its o wn Wo rkgro up Suppo rt features, suc h as file c hec k-o ut. Ado be Go Live lets yo u manage files and fo lders o n a WebDAV server in the same way that yo u manage them o n yo ur deskto p, inc luding c o pying, deleting, renaming, and mo ving Web pages. Available WebDAV servers inc lude Mic ro so ft IIS 5 (inc luded with Windo ws 2000), Apac he (with the mo d_dav mo dule), No vell NetWare 5.1, and Mac OS X Server. Ado be Go Live pro vides a func tio n that lets yo u sync hro nize bo th the site o n yo ur lo c al platfo rm and the site o n the WebDAV server, and it do es so in either direc tio n. Files that are missing o n o ne site but exist o n the o ther are dimmed in the

Chapter 2 ✦ Getting to Know GoLive’s Interface

Sync hro nize dialo g bo x. If a sync hro nizatio n c o nflic t o c c urs, suc h as the same file having been c hanged o n the lo c al site and o n the remo te site, yo u c an dec ide whic h sync hro nizatio n ac tio n yo u want to take to reso lve the c o nflic t. The system has built-in sync hro nizatio n ac tio ns fo r eac h file: uplo ad, do wnlo ad, skip, and delete. Ic o ns are displayed with eac h ac tio n in the dialo g bo x. Yo u c an sync hro nize the entire site o r just selec ted files.

Customizing the Site Window Yo u c an c usto mize the lo o k o f the Site Windo w to make it easier to see its c o ntents. Yo u c an determine whic h c o lumns yo u see, and therefo re what info rmatio n the tab presents. While yo u are in any tab within the Site Windo w, the View Co ntro ller, whic h sits beside the Inspec to r by default, enables yo u to c o ntro l the c o lumns o f info rmatio n yo u view. Simply c lic k the Sho w Co lumns po p-up in the View Co ntro ller, and then selec t a listed c o lumn to turn it o ff o r o n. (All c o lumns are o n by default, exc ept the Name c o lumn in the Files tab, whic h lists the file ’ s name.) A c hec kmark beside eac h c o lumn heading tells yo u the c o lumn is already o n. Yo u c an make any c o lumn wider so yo u c an read lo nger names o r mo re info rmatio n, o r yo u c an sho rten a c o lumn so yo u c an fit mo re c o lumns o n yo ur sc reen. To resize the c o lumns, mo ve yo ur mo use o ver the bo rder o f the c o lumn and drag when the mo use bec o mes a two -headed arro w. This wo rks fo r any c o lumns that have a c o mmo n bo rder. Yo u c an also c hange the o rder o f the c o lumns. To do so , press Ô ( Mac ) o r Ctrl ( Windo ws) and drag the c o lumn’ s heading right o r left to the new heading po sitio n. Yo u c an so rt b y any o f the c o lumn headings b y c lic king a heading. Yo u c an also reverse the so rt o rder o f the c o lumn yo u are so rting b y c lic king the c o lumn heading. On the Mac , the triangle to the right o f the c o lumn headings reflec ts the so rt o rder; c lic king this triangle also reverses the so rt. In Windo ws, just lo o k at the result. Yo u c an also tear o ff any tab fro m the Site Windo w ( exc ept the Files tab) to view it within its o wn windo w. To tear o ff any tab, c lic k that tab ’ s do tted area at the left, and then drag away fro m the Site Windo w until the new windo w ’ s o utline appears in additio n to just the tab ’ s o utline. ( Mo re info rmatio n abo ut this c an be fo und in the sec tio n “ Explo ring the Palettes,” next.) To put a tab bac k into the Site Windo w, c lic k that tab ’ s do tted area at the left and then drag it bac k into the desired po sitio n, o r c ho o se Site ➪ View ➪ Default Co nfiguratio n. At any time as yo u wo rk, yo u c an return the Site Windo w to its initial state again by selec ting Site ➪ View ➪ Default Co nfiguratio n. This resets all Site Windo w tabs and c o lumns. (This do es no t affec t any o f the palettes — just the Site Windo w.)

35

36

Part I ✦ Introducing GoLive 5

Exploring the Palettes Go Live 5 inc ludes to o ls fo r wo rking with all o f the elements o f yo ur pages. Mo st o f these to o ls are gro uped into palettes that wo rk with a partic ular area o f Go Live. Fo r instanc e, the Objec ts palette c o ntains all o f the different types o f elements yo u c an add to yo ur pages, the Co lo r palette fo r wo rking with c o lo r, and the Table palette fo r wo rking with tables. table ro ws, and c ells. All o f Go Live ’s palettes c an be gro uped in different c o mbinatio ns to save valuable sc reen real estate and c an be dragged and dro pped o nto eac h o ther to easily c o mbine o r separate different palettes (sho wn in Figure 2-10).

Figure 2-10: Palettes can be separated and com bined into custom ized groupings to suit your w orkflow : (1) show s the Objects and Color palettes com bined, and (2) show s the separated palettes after dragging the Color palette to a position outside the palette group.

Tip

If you are looking for a w ay to reclaim that little bit of precise screen space, try this. Tear off the Color palette and close it. The Color palette opens autom atically w hen you click any of the color sw atches in GoLive. Next, add the Objects palette to the Inspector. You m ight be thinking “ they are the tw o m ost used palettes!” and you ’d be right, but you never use them both at the same time. After placing an object, double-click it or use the keyboard shortcut to bring up the Inspector. (This tip probably isn ’t applicable to pow er users w ith lots of screen space to w ork w ith, as it does need the extra click to bring up the Inspector, but if you are on a sm all screen or a Pow erBook, you m ay find it extrem ely handy.)

The Inspector While the Site Windo w is yo ur o rganizatio nal interfac e, the Inspec to r is the master c o ntro l fo r every file and element within yo ur Site Windo w, whether used o r unused. No matter what yo u’ re do ing, the Inspec to r pro vides the c o ntro ls yo u need to finetune yo ur wo rk. Yo u’ ve already seen that there ’s an Inspec to r to go alo ng with every tab o f the Site Windo w. Fo r example:

✦ When yo u selec t a page in the Files tab o f the Site Windo w ( o r in the Navigatio n view o r Links view) , the Inspec to r turns into the File Inspec to r, and then pro vides five tabs in whic h it tells yo u all abo ut the file. ( Its Co ntents tab even pro vides a preview.)

Chapter 2 ✦ Getting to Know GoLive’s Interface

✦ If yo u selec t a graphic in the Files tab o f the Site Windo w, as in Figure 2-11, the Inspec to r, as the File Inspec to r, enables yo u to preview the image — even sho wing yo u animatio ns, video s, o r Quic kTime VR — as well as name yo ur graphic and set publishing c o ntro ls.

Figure 2-11: The three tabs of the File Inspector for a graphic file w ithin the Files tab

✦ After yo u plac e a graphic o n yo ur page and selec t it, the Inspec to r, bec o mes an Image Inspec to r (see Figure 2-12) enabling yo u to selec t o r enter spec ific attributes fo r that partic ular instanc e o f that graphic . Yo u c an add an alternate text label, size the graphic , turn the graphic into a butto n o r image map, set ac tio ns that c an happen when yo ur visito r uses po int o r c lic k with the mo use, and mo re.

Figure 2-12: Three of the tabs of the File Inspector for the sam e graphic as in Figure 2-11 after placem ent on a page

37

38

Part I ✦ Introducing GoLive 5

✦ After yo u plac e any text o n a page and then selec t it, the Inspec to r turns into the Text Inspec to r and enab les yo u to assign a URL and ac tio ns to the text. ( It do esn’t do the text fo rmatting — the to o lb ar pro vides fo r that.)

✦ When yo u selec t o ther o bjec ts suc h as Butto n Image o r URL Po p-up o n a page, the Inspec to r c hanges to o ffer whatever spec ific s are needed fo r that o bjec t. Fo r example, eac h Smart Objec t has its o wn Inspec to r.

✦ When yo u’re previewing a page, the Inspec to r enables yo u to see the page appro ximately the way it will lo o k in different o perating systems (Windo ws and the Mac OS) and bro wsers (Internet Explo rer and Netsc ape Navigato r). There’s ac tually mo re the Inspec to r do es. It’ll always be there to pro vide the appro priate o ptio ns fo r any element that yo u selec t, either o n yo ur page o r in the Site Windo w. In eac h c hapter, as I sho w yo u ho w to set up an element, I sho w yo u the Inspec to r and ho w to wo rk within it. To o pen the Inspec to r c ho o se Windo w ➪ Inspec to r ( Mac ) o r View ➪ Inspec to r ( Windo ws) . On the Mac , the exac t name that appears in this menu depends o n what o bjec t o r file is c urrently selec ted, but yo u’ll still rec o gnize it as the Inspec to r.

The Objects palette Like an artist’s palette supplies the pigments fo r a painting, Go Live’s Objec ts palette pro vides the elements fo r yo ur c reatio n. When yo u want to add text to yo ur page, yo u drag a Text ic o n to yo ur page fro m the Objec ts palette, whic h is sho wn in Figure 2-13. To add fo rm fields where users enter info rmatio n, yo u drag fo rm items to yo ur page. To add a JavaSc ript, yo u drag a JavaSc ript ic o n. Thro ugho ut this bo o k, I intro duc e eac h item in the palette as it c o mes into play in yo ur site’s design.

Basic Smart Forms Head

Site extras

Frames Site

QuickTime

Custom

Figure 2-13: The Objects palette, w ith the QuickTim e tab active

Chapter 2 ✦ Getting to Know GoLive’s Interface

The default installatio n o f Go Live installs nine tabs within the Objec ts palette, sho wn belo w. Eac h pro vides a c atego ry o f to o ls fo r yo u to build yo ur page with. A tenth tab bec o mes ac tive when yo u turn o n the WebObjec ts Mo dule in the Preferenc es sec tio n. Here ’ s a list o f all the tabs:

✦ The Basic tab c o ntains elements that are available fo r use o n the bo dy o f yo ur page (o r any element yo u design visually — but no t the head, fo r example). Basic tags c o me up in several c hapters.

✦ The Smart tab inc ludes a c o llec tio n o f prewritten elements that pro vide ac tio n o r interac tio n o n yo ur page. New to Go Live 5 are the Smart Objec ts fo r Pho to sho p, Illustrato r, and LiveMo tio n. These o bjec ts allo w fo r c lo se integratio n with Go Live by enabling yo u to c reate images direc tly fro m the so urc e files, witho ut having to expo rt them to GIF o r JPEG first (fo r mo re info rmatio n, see Chapter 10. The Mo dified Date ic o n adds a repo rt o f the last time yo u saved the page. Fo r easy-to -build fanc y links, there ’s the a prebuilt three-stage butto n ro llo ver and the URL po p-up. The Co mpo nent ic o n is here, to o , to help yo u plac e ac ro ss-the-bo ard c o ntent o n multiple pages. Two JavaSc ript Ac tio n sets are also here: o ne fo r the head and o ne fo r the bo dy o f yo ur page and a bro wser switc h JavaSc ript that enables yo u to no te yo ur visito r’s bro wser/ platfo rm and switc h to an alternative page.

✦ The Forms tab is dedic ated to the things yo u need to build a fo rm o n yo ur page. It pro vides the HTML tag to tell the page it’ ll ac t as a fo rm, and pro vides all the building blo c ks fo r the data-c o ntaining elements suc h as text fields, butto ns and c hec kbo xes, and po p-up menus. Chapter 15 c o vers fo rms in detail.

✦ The Head tab pro vides the HTML tags that go into the head o f a page. These tags affec t the way the page behaves. Fo r example, the Refresh tag enables yo u to have visito rs auto matic ally taken to ano ther page after a spec ified amo unt o f time. Head tags are mentio ned as they c o me into play.

✦ When yo u design a site based o n frames, yo u begin with the Frames tab. This tab pro vides several different frame layo uts fo r yo u to c ho o se fro m. To put o ne into ac tio n, all yo u do is drag the ic o n fo r the lo o k yo u want o nto yo ur page. (In the page windo w is a tab yo u switc h to in o rder to use frames.) After yo u c ho o se a frame layo ut, yo u c an c usto mize the lo o k any way yo u want (within the rules o f HTML, o f c o urse). Chapter 15 go es into frames in detail.

✦ The Site tab pro vides o bjec ts fo r adding a new generic page to the Files tab o r the Site Windo w, address markers to the External tab o f yo ur Site Windo w, c o lo rs to the Site Windo w ’ s Co lo rs tab, and fo nt sets to the Fo nt Sets tab. It also pro vides fo lders fo r o rganizing yo ur site. Yo u c an drag into the Site Windo w ’ s tab in o rder to c atego rize yo ur files, media, c o lo rs, and so o n. Eac h item within this tab is no ted again in its respec tive c hapter.

39

40

Part I ✦ Introducing GoLive 5

✦ The Site Extras tab inc ludes Statio nery pages and Co mpo nents that yo u c reate. When yo u use the Inspec to r to turn a page into Statio nery o r a Co mpo nent, it appears in the Statio nery o r Co mpo nents fo lder in the sec o nd part o f the Site Windo w and also in this tab o f the palette. A po p-up menu in the b o tto m right switc hes b etween Statio nery pads, Co mpo nents, and items fro m the Site Windo w’s Custo m tab . ( Fo r mo re o n Statio nery, see Chapter 4; Co mpo nents and the Custo m tab are c o vered in Chapter 14.)

✦ On the QuickTime tab, yo u’ll find everything yo u need to build a fully featured Quic kTime masterpiec e. (See Chapter 21 fo r mo re.)

✦ The Custom tab is yo ur very o wn sto rage area. Anything yo u c reate o n yo ur page c an be selec ted and dragged here. Onc e it’s here, yo u c an drag yo ur c reatio n to any page. This’ll save yo u to ns o f redundant fo rmatting, suc h as setting up tables o r grids to yo ur liking. (Fo r instruc tio ns, see Chapter 14.)

✦ The WebObjects tab do es no t appear with the standard Go Live installatio n. If yo u’ve added WebObjec ts c apability by turning o n the WebObjec ts Mo dule under yo ur preferenc es, it appears in the Objec ts palette. The WebObjec ts tab c o ntains everything yo u need to use WebObjec ts o n yo ur page. WebObjec ts is a pro gramming to o l beyo nd the sc o pe o f this bo o k, but if yo u’re familiar with WebObjec ts, the Objec ts palette items will be familiar to yo u. Note

You can collapse the Objects palette to the side of your m onitor by Control-clicking the title bar. To reopen it, just click the header of the collapsed palette.

The Color palette The alter ego o f the Objec ts palette is the Co lo r palette, whic h is sho wn in Figure 2-14. Yo u have many ways to add a c o lo r to yo ur page. Yo u c an add a c o lo r to the entire bac kgro und, o r to the bac kgro und o f a table, grid, o r flo ating bo x, o r to the c ells o f a table, o r to text. Whenever yo u c an add c o lo r, I sho w yo u ho w. Go Live enables yo u to use virtually any c o lo r, no t just Web-safe c o lo rs, so in this sec tio n I sho w yo u all the po ssible c o lo rs yo u c an c reate o r c ho o se.

Figure 2-14: The Color palette. You can use the color space buttons, or you can choose the color space from the fly-out m enu at the top-right corner of the Color palette. You can also choose to show or hide the buttons from w ithin the m enu.

Chapter 2 ✦ Getting to Know GoLive’s Interface

Whenever yo u’ re wo rking with text, the to o lbar pro vides a Co lo r butto n fo r yo u. Just abo ut any o ther time yo u have the o ptio n to add c o lo r, the Inspec to r pro vides a small square c o lo r swatc h area beside the wo rd co lo r. Yo u have two ways to selec t a c o lo r, as fo llo ws:

✦ If it’ s o ne o f the 216 Web-safe c o lo rs yo u want fo r sure, Co ntro l-c lic k (Mac ) o r right-c lic k (Windo ws) o n any c o lo r butto n. Then mo ve to , and c lic k, the desired c o lo r.

✦ To c ho o se fro m any c o lo r, c lic k o nc e within any o f these c o lo r swatc hes to o pen the Co lo r palette to the c o lo r and Co lo r tab yo u last used. Unlike the o ther palettes, whic h just bec o me ac tive when a butto n fo r them is c lic ked, the Co lo r palette literally jumps o pen. Yo u c an also o pen the Co lo r palette thro ugh the menus using Windo w ➪ Co lo r, explo re the vario us c o lo r tabs as desired, and then c lic k, o r mix, the desired c o lo r. As yo u c lic k any c o lo r, it bec o mes the c ho sen c o lo r and appears in the c o lo r swatc h. Yo u c an keep c lic king/ mixing c o lo rs until yo u hit the o ne yo u want. After yo u mix o r c ho o se the desired c o lo r in the Co lo r palette, yo u c an also drag the c o lo r fro m the preview area into plac e in yo ur Inspec to r, to o lbar, Outline mo de, o r so urc e c o de. Tip

Each of the Color tabs is connected to the other. When you select a color in one palette, the sam e (or closest) color is reported in the other palettes. This m eans that, for exam ple, som eone can give you the CMYK color they w ant and w hen you enter it, you can see the nearest color w ithin the other Color tabs.

The Color palette’s tabs Nine c o lo r subtabs exist in the Co lo r palette (see Figure 2-15), eac h pro viding a different gro uping o f c o lo rs, kno wn in the designer’s wo rld as a “ c o lo r spac e,” enabling yo u to view o r c ho o se any c o lo r yo u c an think o f. When yo u selec t a c o lo r in any o f the o ther slider-based tabs, yo u see the equivalent c o lo r in eac h o f the o ther tabs (exc ept the Palettes tab). If yo u selec t a c o lo r that’ s within either the Web Co lo r list o r the Web Name list, it will be selec ted when yo u switc h to that tab. If it’ s a Web List c o lo r, it’ ll be selec ted within that tab. If no t, the Co lo r list jumps to the nearest c o lo r matc h. This c an help yo u matc h c o lo rs. Fo r example, yo u c an matc h a CMYK c o lo r to a Web list c o lo r fo r use o n yo ur page.

✦ The Grayscale tab is fo r wo rking in graysc ale. It enables yo u to c ho o se a shade o f gray o r, wo rking in reverse, c ho o se a c o lo r in ano ther c o lo r spac e and disc o ver its gray value.

✦ The RGB tab wo rks with the red, green, and blue c o lo rs that c o mprise a c o lo r in terms o f a TV o r c o mputer mo nito r. In this tab, yo u c an use the red, green, and blue sliders to “ mix” a c o lo r and see the result in the preview area.

41

42

Part I ✦ Introducing GoLive 5

Color palettes Grayscale

RGB

CM YK

HSB

HSV

Web color Web name Site color

Figure 2-15: The nine subtabs of the Color palette enable you to pick colors w ithin alm ost any color space you choose.

✦ The CMYK tab wo rks with the c yan, magenta, yello w, and blac k c o lo rs that c o mprise a c o lo r in terms o f printed ink. In this tab yo u c an use the respec tive sliders to “mix” a c o lo r, o r enter tho se values, to see the end result.

✦ The HSB and HSV tabs enable yo u to c ho o se any c o lo r available in yo ur partic ular c o mputer. This is dependent o n yo ur video c ard, and therefo re varies fro m c o mputer to c o mputer. In the HSB tab, yo u c an c ho o se a brightness. In the HSV tab, yo u c an selec t a hue fro m the c irc le and see the available c o lo rs within the square inside it. Then yo u c an slide aro und within the square to pic k up the desired c o lo r, mo ving ho rizo ntally to inc rease o r dec rease saturatio n, o r vertic ally to lo c ate a c o lo r value.

Chapter 2 ✦ Getting to Know GoLive’s Interface

✦ The Palettes tab enables yo u to pic k a c o lo r using yo ur system’s c o lo r spac e. Use the po p-up menu to c ho o se the number o f c o lo rs yo u c an view. This limits yo ur c ho ic e o f c o lo rs. Yo u c an also set up a palette c o mprised o f yo u o wn deskto p c o lo rs. Additio nally, yo u c an c reate yo ur o wn Co lo r palette here by c o pying c o lo rs.

✦ The We b Color List tab displays o nly the 216 b ro wser-safe o ptio ns. ( See the “Web -Safe Co lo r at the Century’s Dawn” sideb ar, c o ming up sho rtly, fo r mo re info rmatio n.) This is the o nly c o lo r spac e that’s 100 perc ent safe to use o n the Web . Clic k in the c o lo r patc h to jump to a c o lo r. This selec ts the c o lo r in the sc ro lling list to its right. Use the sc ro lling list o f all available c o lo rs, whic h are gro uped with o ther similar shades, to lo c ate a spec ific c o lo r, o r just explo re yo ur o ptio ns. Eac h c o lo r is displayed in the list with bo th a “c hip” and its c o rrespo nding six-digit hex value. (The hex value, is ho w HTML identifies yo ur c o lo r c ho ic es, so this c o mbinatio n o f letters and numbers is what appears in yo ur page’s so urc e c o de.) To selec t any c o lo r in this list, c lic k it. Yo u c an tell a c o lo r is selec ted by a blac k rec tangle aro und it. The selec ted c o lo r appears in the larger preview area o f the tab. The Value field, abo ve the sc ro lling list, c an be used to seek o ut a spec ific c o lo r by hex value. Enter a value in this field and the c o rrespo nding c o lo r appears in the sc ro lling list. This c an be useful when yo u’re c o llabo rating with ano ther perso n. Yo u c an tell eac h o ther the values o f the c o lo r yo u’re disc ussing and eac h o f yo u c an see it to c o nsider it. Yo u c an also c o py a value fro m the Value field in o rder to paste it elsewhere.

✦ The Web Named List tab displays the extended set o f c o lo rs c urrent bro wsers are c apable o f c alling up. Many c o mputers to day use tho usands o r millio ns o f c o lo rs and c an display these c o lo rs, but they are no t guaranteed to lo o k the same ac ro ss all platfo rms o r vario us versio ns o f any platfo rm. This tab wo rks the same as the Web Co lo r List tab but do esn’t pro vide the c o lo r to o l.

✦ The Site Color tab is where yo ur o wn c o lo rs appear after yo u c o llec t them into the Co lo r tab o f the Site Windo w. (See “Co llec ting c o lo rs in the Site Windo w,” earlier in this c hapter.) Yo u c an c o llapse the Co lo r palette to the side o f yo ur mo nito r by Co ntro l-c lic king (Mac ) o r right-c lic king (Windo ws) o n the title bar. To reo pen it, just c lic k it. Note

Not all colors w ork on the Web, because different brow sers and platform s have different color lim itations. On the Web, the only fully safe color space is the 216 colors w ithin the Web Color List tab, w ith the Web nam e colors com ing in safe for m ost m odern com puters. The other tabs m ay be handy, how ever, in helping you recognize colors from other venues. See the “ Web-Safe Color at the Century’s Daw n ” sidebar below for m ore inform ation.

43

44

Part I ✦ Introducing GoLive 5

Web-Safe Color at the Century’s Dawn By Bob Stein ([email protected]), VisiBone (www.visibone.com), maker of several printed and online color resources for Web designers In 1994, Netscape initiated a brilliant solution to a perennial problem w ith graphics operating system s that Web brow sers had just m ade m uch w orse. Most com puters at that tim e could only display 256 colors at a tim e. The choice of those colors w as at the w him of application developers, and then, Web site designers. When m ore than one program or Web page w as visible at a tim e, and the colors they clam ored to display totaled m ore than 256, there w as pandem onium . Users w ould see ridiculously distorted color. Netscape defined a set of 216 colors that w ould have priority; six levels each of red, green, and blue, evenly spaced throughout the RGB color space. Web pages that used those colors exclusively w ould have a m uch better chance of looking right. Som e consequences of using colors outside the Web-safe palette on 256-color com puters are: no effect at all, a speckled com prom ise called “ dithering,” radical color replacem ent (for exam ple, gray); or color thrash w hen sw itching applications. In 2000, the advantages to Web designers, and those they serve, of avoiding non-Web-safe colors are not nearly as strong as they once w ere. The avoidance only benefits users lim ited to 256 colors, and m ost com puters can now theoretically display m illions of colors at a tim e. There have alw ays been distinct disadvantages. Pastels and earth tones are especially sparse in this set. Many designers have cast off the Web-safe yoke for convenience or to m ore precisely realize the colors they envision. In a statistical sam pling of Web pages in Novem ber 1999, I found that 27 percent of the colors for text and background, other than black and w hite, w ere not Web-safe. The num ber of users lim ited to 256 colors for w hatever reason is in gradual steady decline, from 20 percent in May 1998, to 8 percent at the turn of the century, according to the volum inous data at www.thecounter.com (thanks to Morten Wang for pointing this out). The figures are unclear on a full 20 percent of the users, perhaps due to older brow sers or disabled JavaScript, but even 8 percent is probably a larger portion of your users than you w ant to vex unnecessarily. Antique com puters that only display 256 colors at a tim e rem ain in service. But not all 256color users are on old com puters. A Web designer ran into 256-color m ode on a client ’s laptop w hile trying to show off his w ork. Som e gam e program s insist on reconfiguring to 256-color mode to anim ate faster. A developer sw itches to 256-color m ode to trade off for higher resolution and faster operation. Thanks to a discussion on the w ebdesign-L m ailing list, I’ve com e up w ith a sim ple w ay to m easure the color depth of users for any Web site through the statistics logs, www.visibone. com/palettesurvey.html. Figures (as of this w riting) indicate 5 to 14 percent of the people w ho visit the VisiBone hom e page have com puters lim ited to 256-color m ode.

Chapter 2 ✦ Getting to Know GoLive’s Interface

The large rec tangle at the left o f the Co lo r palette is the preview area. In this area, yo u c an see the selec ted c o lo r separate fro m the gro up so yo u c an see its true appearanc e. Yo u c an resize the Co lo r palette by dragging the lo wer-right c o rner. As the palette gro ws, so do the c o lo rs in the c o lo r patc h and in the sc ro lling list. And, o f c o urse, the lo nger yo u make the palette, the mo re c o lo rs yo u c an see in the sc ro lling list. Tip

The color patch of the Web Color List tab contains a secret pow er —a color picker that enables you to pick up any color that ’s anyw here on your screen (even outside of GoLive). To pick up a color, click in the color patch, and then keep the m ouse button dow n as you m ove across the screen. As you drag the m ouse, you ’ll see the color in the preview area and see its hex value appear in the Value field. Of course, not all colors on your screen are Web-safe. Here’s the trick to seeing w hether the color you ’re considering is Web-safe: if the color you ’re resting over happens to be Web-safe, it appears and is selected in the scrolling list. Due to the w ay colors are rendered onscreen, if your screen is set to thousands of colors, the color picker m ay not pick up a color as one of the 216 color-safe colors even if the color really is Web-safe. You ’ll do better to set your m onitor to m illions of colors, or back to 256 if you don ’t have m illions.

As yo u’ re perusing c o lo rs, feel free to drag any c o lo r into the Co lo rs tab o f the Site Windo w fo r future use. It then bec o mes available in the final Co lo r tab — yo ur site ’ s Co lo r list.

M arkup Tree palette In additio n to the HTML Outline Edito r tab in the do c ument windo w, Go Live o ffers the Markup Tree palette, an HTML navigatio nal to o l that sho ws the hierarc hic al po sitio n o f a selec ted o bjec t within the HTML element tree struc ture. Fo r example, the Markup Tree palette might sho w that a selec ted image is c o ntained inside a paragraph element, the bo dy element, and the HTML element, as in Figure 2-16. Clic king any o f these elements in the palette sho ws a new hierarc hy based o n the element yo u c lic k and selec ts every o bjec t (inc luding text) o n the page within that element. To return to the o riginal hierarc hy fo r the image, c lic k the Selec t Previo us Item butto n in the palette. Use the Markup Tree palette as yo u wo rk in Layo ut view, alo ng with the new So urc e Co de palette, to quic kly and prec isely selec t the elements yo u want. Expert Tip

If you are having trouble selecting a sm all object on your page, using the Markup Tree palette m akes it very easy. For instance, if you have a sm all im age inside a floating box and, w hen trying to select the im age, you alw ays end up selecting the floating box, open the Markup Tree palette. Select the tag that represents the floating box, and then select the tag to select the im age on your page. —Richard McLean, Web developer, www.designeffect.com

45

46

Part I ✦ Introducing GoLive 5

Figure 2-16: The Markup Tree palette gives you an easy w ay to select nested or sm all elem ents on your page.

Table palette Tables are easier than ever to design and edit. Yo u c an wo rk direc tly in the table in yo ur do c ument, use the Table Inspec to r, and use the new Table palette, sho wn in Figure 2-17. The Table palette c o ntains two tabs — With the Selec t tab, yo u c an Shift-c lic k to selec t multiple table c ells, and c ut, c o py, and paste entire blo c ks o f c o ntiguo us c ells. It also enables yo u to mo re easily selec t individual table c ells, ro ws, and c o lumns, and so rt yo ur table’s c o ntent. Yo ur table c o ntent c an be easily so rted numeric ally o r alphabetic ally, in desc ending o r asc ending o rder, and by ro ws o r c o lumns. The Style tab, whic h c o ntains a set o f predefined table styles, enables yo u to c hange the appearanc e o f yo ur table instantly by applying a preset table design. Yo u c an even c reate yo ur o wn table styles and add them to the Table palette’s Style tab fo r multiple use.

Figure 2-17: The Table palette enables you to easily select and change form atting for sections of your table and sort colum ns and row s (m iddle), and apply preset or custom table styles (right).

History palette As yo u add o bjec ts to yo ur page, Go Live trac ks yo ur additio ns and ac tio ns, writing a “histo ry” o f them in the Histo ry palette. (Spec ific ally, eac h histo ry is a page histo ry; that is, c hanges to any page are trac ked, no t applic atio n-wide ac tio ns suc h as preferenc e settings.) Yo u c an mo ve bac k in this histo ry to any state o f the page by c lic king that state, as in Figure 2-18, up to 20 steps bac kwards. When yo u go bac kward, the later steps gray o ut and the page reverts to that po int in histo ry. Yo u c an

Chapter 2 ✦ Getting to Know GoLive’s Interface

then c lic k a gray step to go fo rward again. Eac h time yo u save yo ur page o r c lo se it, the histo ry begins anew. Unfo rtunately, tho ugh, it also c lears and begins anew when yo u switc h layo ut views, suc h as mo ving fro m Layo ut to So urc e, o r to Outline o r Preview, so bear this in mind befo re yo u switc h views if yo u’ re experimenting with so mething.

Figure 2-18: Go back in tim e w ith the History palette if you m ake a m istake or w ant to do som ething differently.

When yo u switc h between the vario us pages yo u’ re wo rking o n, the histo ry fo r eac h page is retained; yo u simply see the histo ry fo r the page in whic h yo u are c urrently wo rking, while the o ther page ’ s histo ries remain in Go Live ’ s memo ry. Note

The History palette tracks actions on pages, not in the Site Window. For exam ple, it doesn ’t track the addition of files to your site, creation of folders, m oving files w ithin the Files tab, or deletion of item s in the Site Window. The palette also clears w hen you change from one m ode in the page w indow to another (For instance, from Layout to Source m ode, or vice versa.)

Source Code palette Use the So urc e palette to view c hanges in yo ur layo ut and c o de simultaneo usly. Yo u c an c o de in HTML and see ho w it lo o ks in layo ut, o r watc h ho w c hanging yo ur layo ut c hanges yo ur so urc e c o de. The So urc e Co de palette o nly “ fires up ” its c hanges when it lo ses the fo cus. In o ther wo rds, when yo u wo rk in the So urc e palette, its c o de takes effec t in yo ur page when yo u c lic k the page to make the layo ut view ac tive again.

Transform palette The Transfo rm palette pro vides o ptio ns fo r po sitio ning an o bject o r a gro up o f o bjects, resizing o bjects pro po rtio nally, gro uping and ungro uping o bjects, and changing their layering. Multiple selected o bjects are mo ved as a gro up witho ut changing their po sitio n relative to each o ther. When yo u use the Size o ptio n to set width and height values, yo u can then resize an o bject o r a gro up o f o bjects pro po rtio nally. Often, if no t always, whenever this palette is an o ptio n, the to o lbar pro vides the same input so yo u have a cho ice o f places to wo rk.

47

48

Part I ✦ Introducing GoLive 5

When yo u wo rk with o bjec ts that have a stac king o rder (Z-Order) o r o verlap eac h o ther, yo u want to be able to c o ntro l ho w they o verlap and in what o rder they appear. The Z-Order o ptio n no w lets yo u put o bjec ts in fro nt o f o r behind o ther o bjec ts. This is espec ially useful fo r map shapes (ho tspo ts) in image maps.

Align palette In additio n to the alignment features o n the to o lbar, Go Live pro vides the Align palette. The Align palette aligns o bjec ts o n a layo ut grid, regio ns o n images (image maps), flo ating bo xes, trac ks in the Layo ut view o f the Quic kTime Mo vie Viewer, and page o bjec ts in the site design windo w. When yo u selec t o ne o r mo re o f these items, yo u c an use the alignment o ptio ns pro vided by the Align palette, whic h inc lude aligning an o bjec t o r gro up o f o bjec ts relative to a parent o bjec t o r relative to eac h o ther. Yo u c an align o bjec ts left o r right, to p o r bo tto m, o r c enter. Other o ptio ns exist that equally spac e o r distribute o bjec ts relative to their vertic al o r ho rizo ntal axes.

The Toolbar Just belo w the menu bar when yo u start Go Live, yo u will see a to o lbar, as sho wn in Figure 2-19.

Decrease List Level Remove Link

Teletype (monospaced) HTM L Heading size Bold

Text Color

Alignment Italic Font size

Bullet List

Link Warnings Link

Show in Brow ser

Increase List Level Adobe Online Numbered List Select W indow Figure 2-19: GoLive’s default toolbar

The o ptio ns and butto ns in the to o lbar will c hange depending o n the o bjec ts yo u have c urrently selec ted in the wo rk area (whether it be an image o n a page, o r a fo lder in the Site Windo w, o r a style sheet). Figure 2-20 sho ws yo u the vario us to o lbars. This makes the to o lbar a very po werful part o f the Go Live interfac e, whic h yo u c an use to perfo rm a lo t o f the tasks invo lved in c reating and maintaining yo ur Web site. Whatever task yo u take o n, whenever yo u selec t a new o bjec t, take a lo o k at the to o lbar and see what it c an do fo r yo u.

Chapter 2 ✦ Getting to Know GoLive’s Interface

Figure 2-20: The context-sensitive toolbar changes to reflect the options of the current object selected, or the current m ode you are in.

The Page Window Of c o urse, yo u c an’ t design a Web site until yo u have a page to start with. When yo u c reate a new blank site, Go Live auto matic ally c reates yo ur ho me page fo r yo u. All yo u have to do to begin wo rking o n it is do uble-c lic k its ic o n in the Files tab o f the Site Windo w. In Chapter 4, I sho w yo u the vario us ways to c reate mo re pages fo r yo ur site. The Go Live page windo w has tabs fo r every o c c asio n. The first tab to the left is c alled Layo ut and is fo r designing yo ur page visually, in what is kno wn as WYSIWYG (What Yo u See Is What Yo u Get) mo de. Layo ut mo de is where yo u get to drag and dro p the elements o f yo ur design and wo rk as if in any page layo ut pro gram. Then c o mes the Frames tab, in whic h yo u set up yo ur frameset (if yo u are using frames o n a page) and c ho o se the page that will appear in eac h sec tio n o f the frame. Next c o me two tabs fo r wo rking in HTML c o de. In the So urc e tab, yo u c an view and wo rk within raw HTML as well as gain very valuable feedbac k abo ut bro wser c o mpatibility. In the Outline tab, yo u c an view HTML in an unique o utline, whereby eac h o f the page ’ s elements appears like a heading and all relative attributes fo r it appear belo w its heading. (It’ s c o o l bec ause yo u do n’ t have to kno w HTML to wo rk here.) The last tab (o r two if o n a Mac ) enables yo u to preview yo ur page witho ut launc hing a bro wser. (If yo u’ re using a Mac , yo u’ ll find o ne Preview tab fo r regular pages and a separate o ne fo r previewing a page that uses frames. Windo ws users will see all previews within their o ne Preview tab.) The next sec tio ns desc ribe eac h page view in mo re detail.

49

50

Part I ✦ Introducing GoLive 5

As yo u wo rk, yo u c an switc h between any view by c lic king the view ’ s tab. Yo u c an wo rk in any view, visiting ano ther to make c hanges o r c hec k in o n the affec t o f yo ur additio n. Tip

When you select an object or text w hile in Layout view and then sw itch view s, the code for that object or text is selected in the other view. This is a great w ay to learn HTML because you can see the code for the selected object and see how the object fits in to the code around it.

Abo ve the page windo w is the to o lbar. Ac tually it’ s several to o lbars in o ne bec ause eac h time yo u c hange the mo de yo u’ re wo rking in, the to o lbar c hanges to pro vide the to o ls yo u may need. With Go Live, yo u do n’ t have to give the to o lbar a sec o nd tho ught o ther than to remember to c all upo n the to o ls it pro vides when yo u need them. Yo u have no extra to o lbars to turn o n o r o ff and no c usto mizing to do . It’ s all do ne fo r yo u auto matic ally, and in very little spac e.

Layout view Layo ut view is where yo u’ ll spend yo ur mo st time if yo u’ re a designer o r like wo rking visually, seeing yo ur results as yo u c reate. If yo u are used to wo rking in Illustrato r, FreeHand, Pho to sho p, o r even AppleWo rks, yo u’ ll b e c o mfo rtab le here. Here yo u c an wo rk “ inline ” like within a wo rd pro c essing pro gram and as is c o mmo n in Web design, o r with a layo ut grid as is c o mmo n in page layo ut pro grams. Here, yo u c an display rulers at the b o rders o f yo ur page fo r easy alignment, o r align o b jec ts relative to o ne ano ther. Two layo ut views ac tually exist. The first is the Layo ut Edito r tab where yo u c reate yo ur page, as sho wn in Figure 2-21. The next is the Frame Edito r where yo u plac e and arrange frames, if yo u c ho o se to use them. (Yo u do n’ t ac tually c reate pages in this tab. Instead, yo u link the frame sec tio n to a page yo u design using the first tab. But the Frame tab is where yo u set the size o f yo ur frames, therefo re determining what size to make the design area o f eac h o f yo ur pages. Mo re abo ut frames in Chapter 15.) This bo o k fo c uses o n designing a site with Layo ut view bec ause that’ s part o f what sets Go Live apart fo r the o ther Web design pro grams. The to o lbar has two inc arnatio ns that ac c o mpany the Layo ut view. One is the Layo ut to o lbar, available whenever yo u are wo rking o n a text line. The o ther is the Grid to o lbar. The Layo ut to o lbar turns into the Grid to o lbar whenever yo u plac e a layo ut grid o n a page and then wo rk within the grid. The Inspec to r also has several inc arnatio ns that yo u wo rk with in Layo ut view. There ’ s a general Page Inspec to r fo r setting up the basic s o f the page. Then there ’ s an Inspec to r fo r eac h item yo u plac e o n the page. As yo u selec t any item o n yo ur page, yo u’ ll see the Inspec to r do its mo rphing thing.

Chapter 2 ✦ Getting to Know GoLive’s Interface

Figure 2-21: Magic Bob ’s com pleted page as it appears in Layout view

In additio n to the view tabs within the page windo w, a few butto ns hang o ut there — all at the to p right. The func tio ns o f eac h o f these butto ns are disc ussed later in their respec tive c hapters. Alo ng the to p yo u’ ll find:

✦ The Java Bean ic o n o pens the JavaSc ript Edito r. In this edito r, yo u c an write yo ur o wn JavaSc ripts. As yo u do , the c o de yo u enter is entered direc tly into yo ur page. Whenever yo u’ re in the JavaSc ript Edito r, the Inspec to r bec o mes the JavaSc ript Inspec to r and pro vides a wide asso rtment o f JavaSc ript func tio ns and c o nstruc ts that yo u c an drag into plac e within the JavaSc ript Edito r. It do esn’ t make yo ur JavaSc ript c reatio n fully drag and dro p, but it takes yo u as far as po ssible.

✦ The Filmstrip ic o n o pens the TimeLine Edito r. Using the TimeLine Edito r in c o njunc tio n with flo ating bo xes, yo u c an c reate yo ur o wn c usto m animatio ns. As with any standard TimeLine Edito r, yo u plac e ke yframe s alo ng the timeline at any desired interval, and then set the po sitio n o f the flo ating bo x that c o rrespo nds to that keyframe. And, o f c o urse, yo u c an c reate multiple tracks. Yo u c an learn all abo ut this feature in Chapter 19.

✦ The Stair-step ic o n symbo lizes c asc ading and o pens the Style Sheet Edito r fo r c reating a Casc ading Style Sheet (CSS).

51

52

Part I ✦ Introducing GoLive 5

CrossReference

To learn about Cascading Style Sheets, see Chapter 17.

Abo ve the right sc ro ll bar, yo u’ ll find the Rule butto n that po ps a ruler into plac e. At the bo tto m right o f the page windo w is the Page Size po p-up menu, disc ussed in the sidebar, “ Sizing Yo ur Page Windo ws,” c o ming up sho rtly.

Source view So urc e view is where yo u see the pure, unadulterated HTML that desc ribes yo ur page — where yo u really dig into the nitty-gritty o f HTML and c an tweak c o de like a pro grammer. To make it easier to identify the c o de that c reates an o bjec t, selec t the o bjec t in Page Layo ut view and then switc h views. When yo u switc h to So urc e view, the c o de that c o rrespo nds to yo ur selec ted o bjec ts will be selec ted. This c an be a helpful tric k if yo u want to bec o me so mewhat familiar with HTML. The So urc e view is c o vered in detail in Chapter 3.

The Outline Editor The Outline view is Go Live ’ s very o wn inventio n. This uniq ue view enab les yo u to see eac h o f yo ur c o de c ho ic es under c o llapsib le/ expandab le headers, enab ling yo u to see what yo u have c o de-wise, witho ut training yo urself to read thro ugh HTML tags. CrossReference

The Outline view is covered in detail in Chapter 3.

In this view, yo u see all o f the page ’ s elements c learly displayed in bo ld text within c o llapsible lines. By c lic king the arro w to the left o f the tag, yo u c an see the details o f the o bjec t, as in Figure 2-22. When yo u’ re designing in Layo ut view mo st o f this time, this o ptio n is an exc ellent way to see the HTML c o de behind yo ur page witho ut having to read between all the HTML c o de.

Figure 2-22: A page show n in Outline view w ith a few elem ents expanded

Chapter 2 ✦ Getting to Know GoLive’s Interface

Preview view Switc h to the Preview tab any time to get an idea o f ho w yo ur page will lo o k in a bro wser o n the Web. In Preview mo de, yo u are able to see ho w yo ur mo vies and animatio ns will play: animated GIFs play, and, if yo u have the c o rrec t plug-in, so do Quic kTime mo vies and o ther multimedia. (In so me c ases yo u may see the first frame rather than the full animatio n.) As the Preview tab depends o n the Preview mo dule, yo u c an turn it o n o r o ff using the Mo dules Manager in Go Live’s Preferenc es windo w. In Preview mo de, yo u c an test yo ur links. Links to pages o n yo ur site are served fro m yo ur hard drive. Links to pages o n the Web will ac tually c o nnec t yo u to the Web and c all up the page, pro viding yo ur c o mputer is set to dial up o r o therwise c o nnec t auto matic ally. Ho wever, instead o f having the linked pages replac e the first page yo u are previewing, eac h page o pens in a new windo w. Note

If you are w orking on a Mac and preview ing pages that contain fram es, use the Fram e Preview tab. When you are not using fram es, the fram es preview just says No Fram es.

On the Mac , Preview tab gives yo u c an appro ximatio n o f ho w yo ur page will lo o k in Netsc ape Navigato r and Internet Explo rer 3, 4 and 5 o n b o th Mac and Windo ws. To use this ab ility, yo u c ho o se the Preview tab in the page windo w and then o pen the View Co ntro ller palette. When yo u c ho o se any b ro wser, the page redraws. Unfo rtunately, in the Windo ws versio n the Preview tab uses Internet Explo rer o nly due to the integratio n o f Internet Explo rer into Windo ws. Layo ut mo de, whic h is sho wn in Figure 2-23, also presents an o ppo rtunity to see ho w yo ur page will lo o k in IE o r Netsc ape o n Mac o r Windo ws — and this preview ability is available o n bo th Windo ws and Mac . At any time as yo u wo rk within Layo ut mo de, yo u c an o pen the View Co ntro ller and c ho o se fro m the available bro wsers and platfo rms. View a page that uses a style sheet and yo u’ll see ho w Versio n 3 bro wsers will render it. View a page as a Versio n 3 o r 4 Mac bro wser and then the c o rrespo nding Windo ws bro wser and yo u’ll see the platfo rm fo nt size issue. This preview is new to Windo ws — and very handy. Yo u c an also preview yo ur pages in any Web bro wser that yo u have available o n yo ur c o mputer. See “Previewing Yo ur Page,” later in this c hapter.

53

54

Part I ✦ Introducing GoLive 5

Figure 2-23: A page as view ed on a Mac in GoLive’s Layout m ode; sim ulating IE4 in Window s.

Sizing Your Page Windows With so m any m onitor sizes in the w orld, the question of w hat size w indow to design for is an often-discussed issue. While GoLive can ’t solve the problem , it does m ake it easier to see how m uch fits on your page at various w idths. The page size, noted in the low er-right corner of the page w indow, is actually a pop-up m enu like the one you see here, w hich provides several preset page w idths —the tw o m ost helpful are presets for a 14" and 17" m onitor: The Window Settings pop-up enables you to quickly resize your w indow.

When you choose a size from this pop-up m enu, the page w indow snaps to that size. This does not lock the page w idth —you can still resize it. As you add elem ents to your page, the w indow w ill not grow, but the elem ents m ay extend past the desired w indow size. You ’ll need to w iden the w indow to w ork w ith these objects. You can do this by dragging the bottom corner of the page, just like w ith m ost program s. After you do, the ability to return quickly to one of these preset sizes com es in very handy. After you set a w indow to your desired size, you can m ake that size your default. All of your new and new ly im ported HTML pages w ill open at that size. (After you open an HTML docum ent in GoLive and resize it, it w ill open to the last-used size, not the default.)

Chapter 2 ✦ Getting to Know GoLive’s Interface

To set a default page size, follow these steps:

1. First set the desired size. You can size the length by dragging the bottom -right corner, as is com m on w ith any docum ent in any program . You can also set the w idth by dragging. Or, to accurately set the w idth to a preset size, click the Page Size pop-up and choose a w idth.

2. Click the page size pop-up m enu again and choose Window Settings. 3. In the Window Settings dialog box, show n below, m ake sure there’s a check next to HTML Window s. Then click OK. The Window Settings pop-up enables you to quickly resize your w indow.

Rem em ber that this page size does not actually affect the size of your page. It sim ply acts as a guide so you can see w hat w ill fit w ithin your page area. And, of course, it provides your w orking area. When you consider page w idth, consider m ore than the num ber of pixels on the user’s m onitor. Don ’t forget to take into consideration the w idth of the brow ser’s scroll bars, and any other space-takers such as Internet Explorer’s side panel.

Organizing Files As yo u c o llec t files o r referenc ed items in the Files, External, Co lo rs, and Fo nt Sets tabs o f the Site Windo w, it may bec o me hard to lo c ate what yo u need when yo u need it. By adding fo lders to these tabs, yo u c an keep things neatly filed and labeled. To add a fo lder, yo u simply drag it fro m the Site tab o f the Objec ts palette into the appro priate tab in the Site Windo w. There ’s a spec ific fo lder ic o n fo r eac h type o f fo lder:

✦ The plain fo lder is fo r o rganizing files in the Files tab.

55

56

Part I ✦ Introducing GoLive 5

✦ The fo lders with the Wo rld ic o n and the ic o n with the fac es are fo r external URLs and e-mail addresses, respec tively. They are bo th fo r use in the External tab.

✦ The fo lder with the Co lo r ic o n is fo r o rganizing c o lo rs within the Co lo rs tab. ✦ The fo lder with the Fo nt ic o n is fo r o rganizing yo ur fo nt sets in the Fo nt Sets tab . Yo u c an’t drag an inc o rrec t fo lder to a tab; it is rejec ted. But try it just fo r fun — it’s fun to watc h the Fo lder ic o n jump bac k into the Objec ts palette. Fo lders always c o me in c alled untitled. Yo u name a fo lder (o r c hange it anytime) by c lic king its name, selec ted the desired text, and then typing a new name. Tip

You can turn a URL folder into an Addresses folder and vice versa. When you select the folder w ithin the External tab, the Inspector provides the appropriate choices.

When yo u expo rt a site fo r po sting to the Web, Go Live gives yo u the o ptio n o f keeping the files o rganized exac tly ho w yo u have them in the Site Windo w o r o f putting all pages (exc ept the ho me page) in a Pages fo lder and all o ther physic al files into a Media fo lder. (Ac tually, yo u have mo re c ho ic es and yo u c an c hange tho se fo lder names in the Preferenc es windo w, but that’s ano ther sto ry.) As a thro wbac k to tho se days when expo rt was nec essary, befo re Go Live’s inno vative Site Windo w FTP, Go Live users go t into the habit o f c reating tho se fo lders in the Files tab and wo rking with that o rganizatio n. No w yo u c an have any fo lders fo r yo ur pages and/ o r files. At any time yo u c an drag a plain fo lder fro m the Objec ts palette into the Files tab, name it, and then drag files into it within the Site Windo w. Yo u c an add fo lder and reo rganize yo ur files at any time. As yo u mo ve files, URLs, o r e-mail addresses aro und, Go Live keeps trac k and reo rganizes the fo lders in yo ur hard drive fo r yo u ac c o rdingly. If yo u mo ve a file that is in use o n any o f yo ur pages, Go Live asks permissio n to update pages that use the mo ved item. In mo st c ases, yo u sho uld c lic k OK and permit the update yo ur site. (Files within the Files and Site tabs are the o nes that need to be trac ked. The items in the o ther tabs are no t ac tually files, but mo re like info rmatio n ho lders. When yo u reo rganize the items in the Co lo r, External, o r Fo nt Sets tab, o r c hange the info rmatio n in these o ther tabs, the c o ntents o f yo ur pages are no t updated.) Note

When a file is directly in the list of the Files tab, it is in the root-level folder of the site. When a file is inside a folder, its path becom es the nam e of the folder it is in, and then a slash, and then the file’s exact nam e.

In the next sec tio ns, I’ll go thro ugh the details o f mo ving files aro und the Site Windo w, bo th fo r the Mac into sh and fo r Windo ws.

Chapter 2 ✦ Getting to Know GoLive’s Interface

M oving files within the Site Window Opening fo lders and mo ving files fro m fo lder to fo lder is very similar to wo rking o n yo ur deskto p o r within any fo lders. Yo u have two ways to see what is in a fo lder, as fo llo ws:

✦ As in the Mac Finder and Windo ws Explo rer, yo u c an reveal a fo lder’s c o ntents witho ut o pening the fo lder by c lic king the Expand butto n to the fo lder’s left (blue triangle o n Mac , plus bo x (+) o n Windo ws). When yo u do this, the arro w po ints do wnward (Mac ) o r the plus c hanges to a minus sign (Windo ws), and the files inside that fo lder appear indented beneath the fo lder. Yo u c an have many fo lders o pen like this at the same time, altho ugh it may greatly inc rease yo ur need to sc ro ll. Clic king the Expand butto n again hides the fo lder’s c o ntents.

✦ The o ther way to see what’s in a fo lder is to o pen that fo lder so its c o ntents are the o nly things in view. To o pen the fo lder like this, do uble-c lic k the fo lder. When a fo lder is o pen, its name appears in the Navigatio n po p-up menu abo ve the c o lumn header. (This mimic s standard Open and Save dialo g bo xes.) Whenever a fo lder is o pen like this, the blue arro w to the right o f the po p-up menu ac tivates. Yo u c an c lic k that arro w to quic kly return to the main (ro o t) level o f yo ur site’s fo lder, o r yo u c an use the po p-up menu to navigate anywhere between the c urrent fo lder and the ro o t fo lder. To mo ve a file fro m the main (ro o t) level into a fo lder, just drag it into the desired fo lder. To drag the file fro m o ne fo lder to ano ther, c lic k the arro w by the fo lder to reveal its c o ntents and then drag any file fro m within that fo lder to any o ther visible fo lder, as in Figure 2-24. If yo u’ve plac ed a file within a fo lder and want to mo ve it o ut o f that fo lder so it resides in the main level o f the Site Windo w’s file list (the ro o t level), drag the file o nto the heading (whic h says Name) at the to p o f the Files list. Alternately, yo u c an drag a file o nto the name o f ano ther file that’s already in the ro o t level.

Figure 2-24: Moving a file from the New Files folder into the Pages folder

57

58

Part I ✦ Introducing GoLive 5

Note

You can m ove several at once by first Shift-clicking or m arqueeing them to select them .

Fo lders are “ spring lo aded.” As yo u drag a file into a fo lder, resting o ver the destinatio n fo lder c auses the fo lder to spring o pen. If a fo lder springs o pen and it’ s no t the fo lder yo u seek, just mo ve yo ur mo use to the c o lumn’ s heading (Mac ) o r Fo lder ic o n abo ve the c o lumn heading (Windo ws) and the fo lder springs c lo sed. (Later, when yo u start using Po int and Sho o t yo u’ ll find this feature handy. I explain Po int and Sho o t later in this c hapter). When yo u’ re in a fo lder, o nly that fo lder’ s files appear. To return to the main fo lder, (c alled the ro o t fo lder) c lic k the arro w (Mac ) o r Next Fo lder Up butto n (Windo ws) to the left o f the site ’ s name beneath the Files tab. Yo u c an also drag the file to the left o f any o ther file that is already at the ro o t level and dro p it there to put it into the ro o t.

Introducing Point and Shoot Po int and Sho o t pro vides a simple way to a c reate link with Go Live, whether linking fro m o ne page to ano ther, fro m a page to an external URL, o r fro m a page to a graphic o r media file yo u wish to inc lude o n the page. Whenever Po int and Sho o t is an o ptio n, Go Live pro vides a Po int and Sho o t butto n, whic h lo o ks like a c urled-up ro pe, in the Inspec to r. Thro ugho ut this bo o k, wherever Po int and Sho o t is an o ptio n, I let yo u kno w and sho w yo u ho w to use it (partic ularly in Chapter 11, whic h fo c uses o n link c reatio n). But, just to familiarize yo u with it, keep the fo llo wing po ints in mind:

✦ To c reate a link fro m text o r a graphic , yo u simply press Co mmand ( Mac ) o r Alt ( Windo ws) as yo u c lic k the text o r graphic and drag fro m it. Co ntinue dragging until yo u reac h the desired page target. ( See Figure 2-25.)

✦ To c reate any link o r to link a plac eho lder to a file, selec t the item that will be the link’ s o rigin, and then drag the Po int and Sho o t butto n fro m within the Inspec to r to the destinatio n. Po int and Sho o t makes yo u feel a bit like a c o wbo y as the ro pe extends to yo ur destinatio n. Fo r real fun, start to Po int and Sho o t but release the mo use befo re yo u reac h a destinatio n and watc h the ro pe snap bac k. Go Live ’s file management and Po int and Sho o t wo rk to gether to make it inc redibly easy to c hange the destinatio n o f any link — even when it is used within many pages. Bec ause graphic s are merely linked to a page, to o , yo u c an ac tually c hange a graphic in o ne plac e and have it c hange o n to ns o f pages.

Chapter 2 ✦ Getting to Know GoLive’s Interface

Files, Folders, and Their Effects As you add pages to your site, and then graphics, m ovies, sounds, and other m edia files, the Files tab in your Site Window can becom e a busy place. Like on your com puter, you can organize and group your files into logical folders and arrangem ents to m ake it easier to m anage them and rem em ber w here you ’ve stored everything. When I started Magic Bob Weiss’s site, I had a folder for each category of entertainm ent he did. I figured it w as neatest to keep the page for each, along w ith the graphics and other m edia files, all organized by category. How ever, looking at the URL of each page, Bob decided he’d like a person to easily bookm ark magicbobweiss.com/tradeshows.html instead of magicbobweiss.com/trade/ tradeshows.html. So, the easy fix w as to pull the pages out to the m ain folder of the Site Window. In retrospect, had I know n he w as concerned about users bookm arking the individual pages as separate units, I w ould have m ade a folder called “ tradeshow s” and put the page about trade show s into that folder, nam ing that page index.html. That w ay, the URL w ould have been magicbobweiss.com/ tradeshows. No specific page nam e w ould be needed, as the index page w ithin that folder w ould be called autom atically. I w ould have done this for every page in his site that w as about another topic. Truth is, it ’s not too late to do that. GoLive m akes page nam ing easy. As you renam e a page, all references to it are updated. And as you m ove pages around w ithin folder, all paths to and from that page are updated. Perhaps by the tim e you visit his site, you ’ll see the new paths in effect.

Figure 2-25: Pointing and Shooting directly from text to a destination page

When yo u selec t any file within yo ur site and o pen the In & Out Links palette, yo u see all o f the links in and o ut o f the page, as explained earlier in this c hapter. But there ’s mo re. Yo u also have a Po int and Sho o t butto n beside every page and graphic /media file. At any time, yo u c an drag any o f these Po int and Sho o t butto ns fro m its file to

59

60

Part I ✦ Introducing GoLive 5

ano ther file. This replac es that file with the new o ne. One suc h use o f this feature might be to c hange a bac kgro und image. If yo u use a bac kgro und image thro ugho ut yo ur site, and then c hange yo ur mind, yo u c an substitute ano ther bac kgro und graphic — just by Po inting and Sho o ting o nc e. In additio n to being able to easily swap o ne file fo r ano ther within yo ur site, yo u c an c hange the links within Ac ro bat files that yo u plac e in yo ur site. And fo r Flash files. In Chapter 11, yo u c an read all abo ut links and ho w easy it is to c hange them.

Organizing Your Screen As yo u wo rk in Go Live, yo u need to see no t o nly the page yo u’ re c reating, but a few o ther things as well. Yo u’ re bo und to fiddle aro und with yo ur wo rkspac e until yo u find a setup that wo rks well fo r yo u. The mo st c o mmo n c o nfiguratio n seems to be plac ing the page to the left, as is standard c o mputer prac tic e, and then plac ing the Objec ts palette and Inspec to r to the right o f the page. The Objec ts palette c an be resized to fit just abo ut any spac e. The Inspec to r c an be resized, but its size depends o n its c o ntents. The Site Windo w must always be o pen as yo u wo rk. As with o ther page layo ut pro grams, a large mo nito r (o r two large mo nito rs) is a true blessing. But in c ase yo u do n’ t have the luxury o f a large sc reen, o r a sec o nd mo nito r, Go Live gives yo u so me spac e-saving features. Many func tio ns and key c o mmands are built into Go Live to help yo u manage yo ur sc reen real estate. In additio n to so me c o mmo n aids, eac h platfo rm (Windo ws and Mac ) also has its o wn unique spac e-saving mec hanisms. There will be many times when yo u need to view yo u page, but then Po int and Sho o t to a file in the Site Windo w. In c ase yo u do n’ t have ro o m fo r bo th o nsc reen, yo u c an keep the Site Windo w direc tly o n to p o f yo ur page, and then use the Selec t Windo w butto n o n the to o lbar to bring either fo rward as needed. Yo u have two ways to use the Selec t Windo w butto n. If yo u have just o ne page o pen o n sc reen, just c lic k the butto n to switc h between it and the Site Windo w. But if yo u have mo re than o ne page o pen, c lic k the Selec t Windo w butto n and ho ld o n a mo ment until it reveals a po p-up menu, as in Figure 2-26. This menu sho ws eac h o f the o pen pages as well as the Site Windo w, so yo u c an c ho o se between any o pen page in additio n to c ho o sing the Site Windo w.

Figure 2-26: You can toggle betw een your page or pages and the Site Window by using the Select Window button.

Chapter 2 ✦ Getting to Know GoLive’s Interface

In additio n to c o vering up yo ur Site Windo w, yo u c an also plac e it o ut o f the way o n yo ur sc reen. In Windo ws, yo u c an minimize the Site Windo w, and then maximize it. On the Mac , yo u c an Co ntro l-c lic k the Site Windo w ’ s title bar o r drag it to the bo tto m o f the sc reen until it tabs (muc h like po p-up fo lder windo ws), and then c lic k it o nc e to bring it bac k to its o riginal po sitio n. Pages wo rk exac tly the same way in their respec tive o perating systems, by the way. One o f the easiest spac e savers is the ability to c o llapse yo ur palettes, inc luding the Inspec to r, against the right edge o f yo ur mo nito r by pressing the Co ntro l key as yo u c lic k the to p o f the palette. When c o llapsed, o nly the name tabs o f eac h tab are visible. The palette lands level to where it is o nsc reen, so yo u kno w where to lo o k fo r it. (If yo u’ re using multiple mo nito rs, yo ur palette c o llapses o nto the main mo nito r, so if yo u have two palettes at the same level o n different sc reens, o ne may o verlap the o ther. Remember where to lo o k fo r it.) To resto re yo ur palette to its pretabbed po sitio n ready fo r use, just c lic k the tab. As yo u wo rk with the vario us palettes, yo ur sc reen c an bec o me a busy plac e and yo u may find a palette o r two inc o nveniently c o vering parts o f yo ur page-in-pro gress. Yo u c an quic kly get a c lear view o f yo ur page by hiding all palettes and even the to o lbar with a simple keystro ke. On the Mac , just press Co ntro l-Tab. In Windo ws, press Ctrl-J. Only yo ur o pen pages and the Site Windo w will remain in view. The same keys resto re yo ur palettes and to o lbar to view. On the Mac , yo u c an also c lic k the “ windo wshade ” bo x at the right end o f the title bar o r do uble-c lic k the title bar o f any windo w o r palette to reduc e it to its title bar, o r “ windo wshade ” it. Palettes do n’ t have Minimize butto ns in Windo ws, tho ugh. And, o f c o urse, bo th platfo rms have their respec tive Clo se windo w c o ntro ls to c lo se any palette. In Windo ws, the Go Live applic atio n fills the who le sc reen when yo u launc h it and yo u c anno t mo ve yo ur palettes o ut o f the applic atio n windo w. Yo u c an o btain maximum flexibility o n yo ur sc reen by c lic king the Resto re butto n, and then maximizing the windo w again. After yo u do this, yo u sho uld be able to mo ve yo ur palettes anywhere o n yo ur sc reen (and o nto yo ur sec o ndary mo nito r if yo u have o ne). If yo u c anno t mo ve a palette o r the Inspec to r o utside o f the applic atio n windo w, press Co ntro l as yo u drag it into plac e. And, yo u c an always c ho o se Windo w ➪ Casc ade to stagger yo ur windo ws so the title bars sho ws, by using Tile Ho rizo ntally o r Tile Vertic ally — whic h reduc es the size o f all the windo ws so that they c an all be seen next to eac h o ther.

Previewing Your Page The real test o f a Web page is ho w it lo o ks in the vario us bro wsers o n the vario us platfo rms. Go Live makes this testing simple as c an be: fro m within Go Live, yo u c an preview yo ur page in any bro wser that is installed o n yo ur c o mputer — whic h takes c are o f c hec king fo r bro wser c o mpatibility, at least fo r the platfo rm o n whic h yo u are wo rking.

61

62

Part I ✦ Introducing GoLive 5

All it takes to have Go Live sho w yo u ho w a page will lo o k in any installed bro wser is to have the page o pen and c ho o se the bro wser with the Sho w in Bro wser butto n o n the to o lbar. Yo u need to do a small bit o f setup first, tho ugh: yo u have to tell Go Live to add the bro wser to the butto n’ s list. The first time yo u c lic k the Sho w in Bro wser butto n, Go Live even jumps to the setup auto matic ally. To set up fo r bro wser preview, c ho o se Edit ➪ Preferenc es, c lic k the Bro wsers ic o n o n the left side to display the Bro wser preferenc es, and then c lic k Add to add o ne spec ific bro wser at a time, o r c lic k Add All to have Go Live searc h all mo unted vo lumes and add every bro wser it finds. The lo c atio n o f eac h bro wser is c learly no ted so yo u c an determine if yo u wish to keep o n the list. Yo u c an remo ve a bro wser fro m the list by c lic king it in the list within the Preferenc es dialo g bo x, and then c lic king the Remo ve butto n. After a bro wser is in the list, it bec o mes available in the po p-up menu o n the to o lbar. Cho o se the bro wser to see ho w it displays the ac tive page. Note

Due to lim itations w ithin Internet Explorer, you cannot open Versions 2 or 3 after you ’ve installed Version 4. You can install these older versions, but double-clicking them or otherw ise trying to open them is fruitless —they just call up Version 4. In order to preview in Internet Explorer 2 or 3, you ’ll need to install each on another startup disk. With Internet Explorer 5, Microsoft becam e m ore flexible, so you can have and use Version 5 and 4 on the sam e startup disk. This is true on both Window s and Mac.

CrossReference

Rem em ber that several differences differentiate com puter platform s. See Chapter 26 for m ore on m aking sure your pages look good on other platform s.

And, o f c o urse, yo u’ ll want to test yo ur site o nc e it’ s po sted to the Web as well, just to make sure yo u’ ve uplo aded all the nec essary files, and that yo ur file names are appro priate fo r the type o f server yo u’ re using.

File Transfer Go Live gives yo u no t o ne, but three ways to go live with yo ur site. Two are built-in FTP features, while the third expo rts yo ur site fo r yo u to pass alo ng fo r uplo ading. Why two FTP pro grams? Bec ause o ne (the File menu) lets yo u FTP to anyplac e anywhere o n the Web, while the o ther (the Site menu) pro vides a direc t path direc tly to the spec ific site yo u’ re wo rking o n. The simplest, and dare I say c o o lest, o f the o ptio ns is the Site Windo w ’ s FTP. After yo u set up yo ur server info o nc e fo r yo ur site, it’ s remembered with the site (sto red within the site do c ument). Then, whenever yo u want to mo ve yo ur site files to the server, o r delete o r do wnlo ad a file, yo u’ re o nly a c lic k o r two away. Of c o urse, yo u always have c o ntro l o ver what gets uplo aded. Yo u have several ways to do so .

Chapter 2 ✦ Getting to Know GoLive’s Interface

Under the File menu, yo u’ ll find ano ther full-func tio n FTP pro gram. This o ne enables yo u to quic kly use Go Live to c hec k up o n a site, add o r delete fo lders, mo ve things aro und, o r make c hanges to the site — all that witho ut o pening that site ’ s site do c ument, whic h c an be very helpful when yo u do n’ t have that site ’ s site do c ument sto red o n the hard drive yo u’ re c urrently wo rking fro m. Note

GoLive even enables you edit your site live on the Web. After you connect to your server (using either FTP) just double-click any page w ithin the FTP tab or brow ser and the page opens on your screen. Change it, save it, and close it. That ’s it. It ’s cool —and it can com e in very handy w hen you ’re aw ay from your hom e m achine and need to m ake a change im m ediately.

If yo u prefer no t to use the FTP tab, yo u c an use Go Live ’ s Expo rt c o mmand to c reate a Web-ready fo lder. Then yo u c an use Go Live ’ s o wn built-in FTP pro gram o r a third-party FTP pro gram to put yo ur site up. Or yo u c an send the expo rted site, replete in its fo lder, o ff to a c usto mer via e-mail o r o n a remo vable disk. CrossReference

You can learn all about GoLive’s FTP abilities and uploading or updating your site in Chapters 27 and 28.

✦

✦

✦

63

3

C H A P T E R

Viewing and Editing HTM L

✦

✦

✦

✦

In This Cha pter

G

o Live ’s visual interfac e gives yo u a beautiful way to c reate Web pages. But . . . (there ’s always a but, isn’ t there?) . . . no matter ho w terrific it is, the bare fac t is that behind any Web page, lies plain, hard c o de. And, so metimes, o r so meday, yo u’ ll need to lo o k into that c o de. Maybe yo u’ ll want to learn a tag in o rder to use it in a style sheet. Or maybe yo u’ ll want to try applying a no nstandard attribute to an o bjec t o n yo ur page. When that day c o mes, yo u c an either bite the bullet and c hec k the HTML referenc e guides and bo o ks to learn that tag, o r yo u c an see if the attribute yo u seek even exists. . . . Or yo u c an disc o ver the answer in just a few easy c lic ks within yo ur o wn page layo ut o r in either o f the HTML interfac es right within Go Live. Serio usly, just a few c lic ks. Go Live gives yo u two ways to peer into — and wo rk with — this c o de behind yo ur pages. One way is So urc e mo de, whic h sho ws the raw HTML; the o ther way is Outline mo de, whic h pro vides an easy-to -view and unique lo o k at the HTML tags o n yo ur page. This c hapter examines all o f these interfac es, and ho w yo u c an use them.

Viewing and Working in Source Code HTML is the nitty-gritty o f what makes a Web page. It’s the c o de behind all the c o o l things yo u do when yo u drag o bjec ts fro m the Objec ts palette to the page. It’s full o f tags that tell the bro wser what to do , ho w to render an element, where to find an image, and where to take the user when a link is c lic ked.

Using the So urce Co de windo w Using the So urce Co de tab Using O utline view

✦

✦

✦

✦

66

Part I ✦ Introducing GoLive 5

Go Live ac tually pro vides two interfac es fo r yo u to view straight HTML and to wo rk with it (and o ther c o de within yo ur page). The first is the So urc e Co de windo w (a.k.a. So urce Co de pale tte ), whic h enables yo u to see yo ur c o de as yo u build yo ur page in Layo ut mo de, and it is also fo r entering c o de into . And the sec o nd is the HTM So urc e Edito r, built with features espec ially fo r HTML pro gramming (c o ding).

Using the Source Code window As yo u wo rk in Layo ut mo de, yo u c an view the so urc e o f yo ur page within the So urc e Co de windo w. To do so , simply c ho o se Windo w ➪ So urc e Co de. Yo u c an learn muc h abo ut HTML pro gramming just by having this windo w o pen while yo u are c reating pages. With this simultaneo us view o f yo ur page, yo u c an watc h the HTML in yo ur page c hange mo ment by mo ment as yo u wo rk. While yo u are dragging an o bjec t fro m the Objec ts palette o nto yo ur page, yo u c an see the c o de that renders the o bjec t. And bec ause any new o bjec t o n yo ur page is auto matic ally selec ted o n yo ur page, the new c o de fo r this o bjec t is even highlighted, making it easy fo r yo u to no tic e the c o de. By watc hing this windo w, yo u c an learn muc h abo ut HTML pro gramming. In fac t, I use it thro ugho ut this bo o k to sho w yo u what the c o de fo r an o bjec t lo o ks like. The So urc e Co de windo w isn’ t just fo r watc hing HTML. It’ s fo r pro gramming, to o . Any time it’ s o pen, yo u c an c lic k inside it and edit yo ur c o de. The edit takes effec t as so o n as yo u c lic k bac k in yo ur layo ut. Note

The Source Code w indow show s you the HTML of your page w hen you ’re w orking in any view w ithin your page, except the Source tab.

The So urc e Co de windo w has a few settings that are wo rthwhile to kno w abo ut. Yo u c ho o se the settings by selec ting them fro m the fly-o ut menu at the to p-right c o rner o f the So urc e Co de windo w, as sho wn in Figure 3-1. Eac h item is a to ggle. Selec t an item when it’ s o ff to turn it o n, and vic e versa to turn it o ff.

Local mode By default, the So urc e Co de windo w sho ws yo u all o f the HTML fo r yo ur page. Lo c al mo de (see Figure 3-2) narro ws the fo c us o f the So urc e Co de windo w, sho wing yo u o nly the c o de fo r whatever o bjec t(s) and/o r text that is c urrently selec ted. No rmally, when yo u drag, say, a table, fro m the Objec ts palette, the c o de fo r that table bec o mes selec ted in the So urc e Co de windo w, but the rest o f the page ’s c o de also appears. Sho uld yo u c lic k within the So urc e Co de windo w, yo u lo se that selec tio n, leaving it up to yo u to figure o ut where the table ’s c o de begins and ends. In Lo c al mo de, when yo u drag that table o nto the page, o nly the c o de fo r the table appears. Even when yo u c lic k within the So urc e Co de windo w, o nly that table ’s c o de is in view. This enables yo u to ro am aro und in so urc e c o de, typing away, kno wing where yo u are. Then, as so o n as yo u c lic k bac k in the page, yo u’ ll see yo ur results.

Chapter 3 ✦ Viewing and Editing HTM L

Figure 3-1: The fly-out m enu of the Source Code w indow enables you to custom ize your view of your page’s HTML.

Figure 3-2: Local m ode show s you only w hat is currently selected on your page —. in this case, just a table. Here, text entered in the table cell in source code hasn ’t appeared in the table yet because the user has not returned to the page.

Tip

Local m ode is an excellent w ay to learn HTML. Sw itch to local m ode any tim e you w ant to see a specific bit of code. It ’s great for learning and great for quick, specific source code edits, too!

Yo u c an switc h in and o ut o f Lo c al mo de any time by returning to the fly-o ut menu.

67

68

Part I ✦ Introducing GoLive 5

Word wrap In HTML, the c o ntents o f a table c ell, fo r example, c o unt as o ne line o f c o de, regardless o f ho w that c o ntent appears to wrap o n yo ur page. This c an make it diffic ult to read the c o de, as the c lo sing tag may be far o ff sc reen. With Wo rd Wrap o n, the HTML wraps between the edges o f the So urc e Co de windo w, as sho wn in Figure 3-3.

Figure 3-3: By w rapping the text w ithin the Source Code w indow, you can perhaps m ore easily see your opening and closing tags.

Display line numbers Line numbering c an enable yo u to mo re easily identify bits o f c o de within yo ur page. With this feature o n, numbers appear in a gray margin at the left side o f the So urc e Co de windo w. Of c o urse, if the line numbering c hanged every time yo u resized the width o f the So urc e Co de windo w, the numbers wo uldn’ t be muc h help. Yo u wo uld never be able to make no tes to yo urself c o nc erning a partic ular issue o n a c ertain line number. Instead, line numbering c o unts lines o f c o de. When text that wo uld no rmally appear o n o ne line is wrapped, it is no t assigned a numbered line. (Yo u c an see this in Figure 3-3.)

Dim when inactive By default, when yo u are wo rking o n yo ur page in Layo ut mo de, the c o ntents o f the So urc e Co de windo w are slightly dimmed. When yo u c lic k the So urc e Co de windo w to make it ac tive, the text bec o mes brighter so that yo u c an mo re easily fo c us o n it. On the o ther hand, turning o ff this feature c auses the c o de to always appear brighter. It may be handy fo r yo u.

Chapter 3 ✦ Viewing and Editing HTM L

Note

You can change som e of the behaviors of the Source Code w indow w ithin GoLive’s Preferences under the Source section. To learn about these settings, see Source Editor Preferences later in this appendix.

Using the HTM L Source Editor While the So urc e Co de windo w pro vides a simultaneo us view o f yo ur page in c o de, the So urc e Co de tab o f the yo ur page’s windo w pro vides a full-featured HTML edito r. This is the plac e where pro grammers c an be at ho me. But even if yo u’re an HTML no vic e, o r yo u do n’t really want to kno w that muc h abo ut HTML, yo u c an learn so mething here. As with the So urc e Co de windo w, yo u c an learn the c o de that’s generated when an o bjec t is built o n yo ur page o r as it is tweaked. Simply selec t an o bjec t in Layo ut view and then switc h views to see the c o rrespo nding c o de selec ted in so urc e, to o .

Drag and drop Yo u might think that Go Live’s drag-and-dro p page b uilding is o nly a WYSIWYG feature, b ut it’s no t! Yo u c an drag tab les, links, Smart Ob jec ts, fo rm elements, and so me o ther items fro m the Ob jec ts palette into plac e in the HTML so urc e. Co lo rs c an also b e dragged and dro pped. As yo u drag an item, yo u’ll see a vertic al b ar representing the plac ement o f the o b jec t in the so urc e c o de. Dro p the item, and the c o de appears!

Word wrap and line numbering As in the So urc e Co de windo w, the wo rd-wrap feature wraps yo ur c o de so that it fits into yo ur page windo w, while the line-numbering feature c o unts lines o f c o de. Yo u c an turn eac h o f these features o n independently o f eac h o ther by c lic king their respec tive butto ns o n the to o lbar. Tip

GoLive’s Source preferences enable you to turn either of these features on so that they’re on each tim e you return to this tab. To do so, choose Edit ➪ Preferences, click the Source topic, and then check Line Num bers and/ or Word Wrap, as desired.

Syntax highlighting and checking As is c o mmo n with o ther HTML edito rs, Go Live pro vides c o lo r c o ding, c alled Syntax Highlighting, so yo u c an differentiate between all c o de and c o ntent, media and links, server side c o de, o r just URLs, at a glanc e. Co nvenient butto ns o n the windo w’s butto n bar make it simple to switc h between c o lo r c o ding with a single c lic k. This c an be extremely useful when tro ublesho o ting a pro blem file.

69

70

Part I ✦ Introducing GoLive 5

The default Syntax Highlighting is De taile d syntax highlighting, whic h identifies tags, attributes, values (as well as o ther items), by c o lo ring them “ intelligently.” If Go Live sees that a required c harac ter is missing, the c o lo ring after the erro r is different. Fo r example, if yo u have a file that c o ntains the fo llo wing, yo u will see everything c o lo red pro perly bec ause this c o de is c o rrec t: