Produkty spoloΦnosti Macromedia pre spracovanie grafiky a tvorbu webov²ch sφdiel s· znßme predovÜetk²m medzi profesionßlnymi pou₧φvate╛mi a nepochybne tu patria ku ÜpiΦke. Platφ to aj pre Macromedia Dreamweaver, jeden zo svetovo najpopulßrnejÜφch WYSIWYG editorov, ktor² vo verzii 4 pon·ka mno₧stvo vylepÜenφ.
Prostredie
Prostredie Macromedia Dreamweaver 4.0 sa skladß z hlavnΘho editaΦnΘho okna a nieko╛k²ch vo╛ne na ploche plßvaj·cich paliet s nßstrojmi. K dispozφcii je panel vlastnostφ, pomocou ktorΘho m⌠₧ete ╛ahko meni¥ vzh╛ad jednotliv²ch Φastφ dokumentu, panel s objektmi, okno Üt²lov, okno so zobrazenφm referenΦnej HTML prφruΦky a ∩alÜie palety. Tieto oknß je mo₧nΘ zluΦova¥ do spoloΦn²ch, kde sa medzi nimi prepφna prostrednφctvom zßlo₧iek. Pre lepÜie prisp⌠sobenie pracovnΘho prostredia si m⌠₧ete tieto zßlo₧ky posklada¥ do ╛ubovo╛nΘho plßvaj·ceho okna - jednoducho myÜou pretiahnete zßlo₧ku do inΘho plßvaj·ceho okna. M⌠₧ete si tak vytvori¥ paletky s najΦastejÜie pou₧φvan²mi nßstrojmi. Celkovo je prostredie pomerne preh╛adnΘ, no menej sk·sen²m pou₧φvate╛om bude chvφ╛u trva¥, k²m si na≥ zvykn· (aj ke∩ Dreamweaver je urΦen² skutoΦn²m profesionßlom).
Ovlßdanie je rovnakΘ ako u in²ch aplikßciφ Macromedia a platφ tu to istΘ ako o prostredφ - ovlßdanie je jednoduchΘ pre profesionßlov, po Φase si vÜak na≥ zvykne ka₧d². Ve╛mi silnΘ s· mo₧nosti definovania klßvesov²ch skratiek, pre zr²chlenie Φasto sa opakuj·cich ·konov je tu zßznam makier. Pri editßcii je dostupnß ·plnß hist≤ria ·prav, v ktorej si m⌠₧ete prostrednφctvom posuvnφka "prehrßva¥" postupnos¥ editßcie. Alebo si m⌠₧ete vybranΘ kroky ulo₧i¥ ako prφkaz (pre ∩alÜie pou₧itie), opakova¥ je, kopφrova¥ at∩.
Vytvßrame web
ètrukt·ra vytvßranΘho web sφdla je v Dreamweaveri zalo₧enß na nßvrhu adresßrovej Ütrukt·ry (ako u vΣΦÜiny podobn²ch nßstrojov). Okno pre prßcu s web sφdlom m⌠₧e by¥ pod╛a nastavenia rozdelenΘ na dve Φasti. V jednej s· zobrazenΘ lokßlne adresßre a s·bory patriace strßnke, v druhom (volite╛ne) Ütrukt·ra vzdialenΘho servera. Pre sprßvu webu s· k dispozφcii kontrola odkazov, kontrola kompatibility jednotliv²ch prehliadaΦov (Internet Explorer 2-5, Netscape 2-4), vyh╛adßvanie a nahradzovanie slov vo viacer²ch strßnkach s·Φasne a ∩alÜie funkcie u╛ahΦuj·ce webov²m tvorcom ₧ivot.
Pri rozsiahlejÜφch web sφdlach uvφtate kontrolu vlastnostφ vybran²ch dokumentov. U₧itoΦnΘ s· tie₧ funkcie pre podporu teamovej prßce pri tvorbe web sφdla - m⌠₧ete si naprφklad ku strßnkam definova¥ poznßmky (vo formßte XML), ktorΘ sa zobrazia ostatn²m spolupracovnφkom pri otvorenφ dokumentu. Dreamweaver navyÜe pon·ka podporu pre Visual SourceSafe a protokol WebDAV.
S tvorbou a sprßvou web sφdla je ·zko spojenΘ jeho publikovanie na vzdialenom serveri. Dreamweaver pon·ka jednoduchΘho FTP klienta, ktor² sφce svojimi mo₧nos¥ami postaΦuje pre prenos s·borov na web server, no ani z∩aleka nepon·ka mo₧nosti Üpecializovan²ch nßstrojov. Mo₧nß je aj aktualizßcia len zmenen²ch strßnok a prenos len zvolen²ch strßnok. Okrem FTP m⌠₧ete publikova¥ lokßlne alebo na sie¥ov² disk.
EditaΦnΘ prostredie Dreamweaveru zahα≥a jeden z najlepÜφch WYSIWYG editorov, textov² editor pre ruΦn· editßciu HTML k≤du (s podporou farebnΘho rozlφÜenia syntaxu) a tie₧ debugger JavaScriptu. Pri tvorbe webov²ch strßnok ve╛mi dobre pom⌠₧e integrovan² referenΦn² on-line manußl pre HTML, CSS a JavaScript od vydavate╛stva O'Reilly.
Pre vytvßran· strßnku s· k dispozφcii ÜtandardnΘ nastavenia, ako pozadie, okraje, farby, k≤dovanie strßnky a podobne. Oproti in²m nßstrojom je tu aj mo₧nos¥ definovania transparentnosti pre obrßzok na pozadφ. Ak chcete svoju strßnku "obdari¥" rßmcami, m⌠₧ete to prostrednφctvom Dreamweaveru spravi¥ v takmer ╛ubovo╛nej kombinßcii. K dispozφcii s· ÜtandardnΘ mo₧nosti pre vkladanie objektov ¥ahanφm myÜou z plßvaj·cej palety (prφpadne staΦφ na ne klikn·¥ a objekty sa vlo₧ia na aktußlnu pozφciu kurzora).
Vkladanie objektov
Na strßnku m⌠₧ete okrem in²ch komponent vklada¥ text, obrßzok, tabu╛ku, Java applety, ActiveX prvky a tie₧ vnorenΘ objekty pre zßsuvnΘ moduly. Vlastnosti objektu je mo₧nΘ r²chlo nastavova¥ a meni¥ v∩aka preh╛adnej palete, zobrazuj·cej v samostatnom okne vÜetky parametre aktußlneho objektu. Vkladan² text sa zapisuje bu∩ be₧ne na strßnku, prφpadne do CSS rßmcov (kde sa samozrejme pon·kaj· ove╛a ÜirÜie mo₧nosti). PodporovanΘ s· ÜtandardnΘ mo₧nosti formßtovania textu a jednoducho m⌠₧ete vklada¥ aj Üpecißlne znaky.
Vkladanie obrßzkov je u╛ahΦenΘ ich zobrazovanφm vo v²berovom dial≤gu (m⌠₧ete ho vÜak vlo₧i¥ aj priamym pretiahnutφm z Prieskumnφka). PodporovanΘ s· formßty GIF, JPG a PNG (vhodnΘ by vÜak boli aj inΘ formßty - s automatickou konverziou). Definφcia aktφvnych oblastφ obrßzku pon·ka ÜtandardnΘ mo₧nosti - Ütvoruholnφk, ovßl a mnohouholnφk. V ponuke objektov je aj obrßzok s efektom "rolover".
Po vlo₧enφ objektu "tabu╛ka" staΦφ zada¥ poΦet stσpcov a riadkov a tabu╛ka je hotovß. ╧alej s· k dispozφcii vÜetky be₧nΘ mo₧nosti formßtovania - hr·bka rßmu tabu╛ky, v²pl≥ a vzdialenos¥ medzi bunkami, farby a podobne. Jednoducho je mo₧nΘ prida¥ alebo ubra¥ riadky alebo stσpce, zl·Φi¥ ich alebo rozdeli¥. Okrem t²chto Ütandardn²ch mo₧nostφ vÜak pon·ka Dreamweaver pri tvorbe tabuliek nieΦo viac - Üpecißlny re₧im editßcie, v ktorom m⌠₧ete tabu╛ky alebo bunky len tak "kresli¥", a to takmer hocikde a hociako (naprφklad nieko╛ko buniek mimo seba). Dreamweaver si v tomto re₧ime automaticky doplnφ zvyÜok nakreslenej Φasti tabu╛ky pod╛a potreby. Textov² obsah tabuliek je mo₧nΘ triedi¥ pod╛a hodn⌠t, priΦom v²ber buniek je mo₧n² po stσpcoch, riadkoch, alebo dokonca nes·vislo.
Pre vytvorenie r²chlej navigßcie na strßnkach m⌠₧ete pou₧i¥ objekt "navigaΦnß liÜta". Definova¥ tu m⌠₧ete grafickΘ tlaΦidlß v horizontßlnom alebo vertikßlnom usporiadanφ, ktorΘ pon·kaj· mo₧nos¥ "rolover" efektu. Nastavenie je jednoduchΘ prostrednφctvom dial≤govΘho okna, v ktorom definujete nßzvy tlaΦidiel, s·bory s obrßzkami pre tlaΦidlß (aj pre rolover efekty) a prφsluÜnΘ odkazy. Obrßzky tlaΦidiel aj s textom (+ rolover varianty) si vÜak musφte vytvori¥ v externom grafickom editore (Ükoda, hodila by sa automatizßcia).
Ke∩₧e sa jednß o produkt Macromedie, je samozrejmΘ ve╛mi jednoduchΘ vkladanie Flash animßciφ, dßt pre Shockwave, ale aj ╛ubovo╛n²ch Java appletov a ovlßdacφch prvkov ActiveX. èpecialitkou Dreamweaveru je objekt "Flash tlaΦφtko" - na strßnku m⌠₧ete vlo₧i¥ (peknΘ) grafickΘ tlaΦidlo s definovan²m textom a odkazom s u₧ definovan²m rolover efektom (tlaΦidlo je vlastne Flash objekt). Je to skutoΦne peknΘ, len neviem, preΦo nie je tak²mto sp⌠sobom vytvßranß aj navigaΦnß liÜta. Tvorba formulßrov pon·ka ÜtandardnΘ mo₧nosti - vstupnΘ textovΘ polia, tlaΦidlß, zaÜkrtßvacie a prepφnacie boxy, zoznamy a podobne.
PrφjemnΘ vymo₧enosti
Takmer vÜetky s·ΦasnΘ HTML editory pon·kaj· podporu Üt²lov (CSS), ktorΘ umo₧≥uj· presnejÜiu kontrolu nad vzh╛adom strßnky. Dreamweaver nie je v tomto smere ₧iadnou v²nimkou a pon·ka nadÜtandardnΘ mo₧nosti - navyÜe aj HTML Üt²ly, s ktor²mi sa pracuje podobne ako s CSS Üt²lmi, avÜak s· aplikovanΘ klasicky, teda vo forme tagov priamo do strßnky.
Dreamweaver ve╛mi dobre podporuje aj Dynamic HTML (DHTML) - m⌠₧ete teda na strßnkach vytvßra¥ animßcie, tlaΦidlß meniace vzh╛ad, pohybuj·ce sa objekty a ∩alÜie multimedißlne efekty bez nutnosti pou₧φva¥ zßsuvnΘ moduly nebo Javu. K dispozφcii je DHTML Timelines (Φasovß os), na zßklade ktorej je riadenΘ zobrazovanie, pohyb alebo zmeny vlastnostφ objektov na strßnke umiestnen²ch v Üpecißlnej vrstve. Do tejto vrstvy m⌠₧ete vlo₧i¥ ╛ubovo╛nΘ objekty a nßsledne vrstvu premiest≥ova¥. Tento pohyb m⌠₧ete prostrednφctvom Timelines zaznamena¥ a pri prehliadanφ strßnky sa m⌠₧e prehrßva¥ (jednorßzovo, v cykle). Je to jednoduchΘ a nemusφte v⌠bec niΦ programova¥.
Pre efektφvnejÜiu tvorbu s· urΦenΘ Üabl≤ny strßnok, ktorΘ oddelia grafick² nßvrh web strßnky od jej obsahu. èabl≤na sa vytvßra rovnako ako be₧nß web strßnka, teda vytvoria sa oblasti, vlo₧ia tabu╛ky a grafickΘ prvky a podobne. Potom sa oznaΦia oblasti, ktorΘ sa nebud· v rßmci celΘho web sφdla meni¥, a oblasti, ktorΘ sa naopak meni¥ bud·. Takto vytvorenΘ Üabl≤ny m⌠₧ete pou₧i¥ pri tvorbe nov²ch strßnok, podobne ako naprφklad Üabl≤ny kancelßrskych dokumentov v MS Office. Nemennß Φas¥ sa teda prenesie na nov· web strßnku a zvyÜok m⌠₧ete doplni¥.
NajlepÜie vÜak na tom je to, ₧e pri zmenßch Üabl≤ny sa tieto zmeny premietnu do vÜetk²ch strßnok vytvoren²ch prostrednφctvom tejto Üabl≤ny. Nielen₧e si tak uÜetrφte kopec Φasu, ale dßte svojmu web sφdlu jednotn² vzh╛ad. èabl≤ny nßjdu vyu₧itie aj pri prßci v skupinßch, kde vÜetci Φlenovia tφmu vyu₧φvaj· spoloΦnΘ Üabl≤ny, Φφm zachovßvaj· rovnak² vzh╛ad vytvßran²ch strßnok.
Dreamweaver vÜak nie je len WYSIWYG editor, ale pon·ka aj vstavan² HTML editor, ktor² je tesne spojen² s WYSIWYG prostredφm. V editaΦnom okne m⌠₧ete prepn·¥ do re₧imu WYSIWYG, HTML, alebo zdvojenΘho (okno rozdelenΘ na dve Φasti - WYSIWYG a HTML). Ako jeden z mßla web editorov mß podporu re₧imu RoundTrip HTML pre simultßnnu editßciu dokumentov vo vizußlnom aj zdrojovom re₧ime. To znamenß, ₧e pri oznaΦenφ akΘhoko╛vek objektu vo WYSIWYG editori sa v HTML editore automaticky oznaΦφ zodpovedaj·ci HTML k≤d a naopak. Taktie₧ vÜetky zmeny prevedenΘ v jednom editori sa okam₧ite premietnu do editora druhΘho. Zabudovan² editor zdrojovΘho k≤du samozrejme podporuje farebnΘ rozlφÜenie syntaxu.
Nßjdete tu aj integrovan² debugger JavaScriptu, ktor² pon·ka skutoΦne ÜirokΘ mo₧nosti (krokovanie, breakpoints, premennΘ, preview a podobne). UrΦitß ·prava zdrojovΘho k≤du je mo₧nß aj vo WYSIWYG re₧ime, a to prostrednφctvom vkladania Üpecißlnych parametrov do jednotliv²ch tagov - to zabezpeΦφ Quick Tag Editor, ktor² zobrazφ ·pln· syntax prφkazu s mo₧nos¥ou zmeny alebo doplnenia parametrov.
Zßver
Macromedia Dreamweaver 4.0 je v s·Φasnosti na ÜpiΦke v oblasti profesionßlnych vizußlnych nßstrojov pre webov· tvorbu. Pon·ka ve╛kΘ mno₧stvo prepracovan²ch nßstrojov a efektφvnu spoluprßcu s ostatn²mi nßstrojmi Macromedia. Ve╛mi dobrou vo╛bou je jeho spojenie s grafick²m editorom pre web Macromedia Fireworks 4.0 v balφku oznaΦenom Macromedia Dreamweaver 4 / Fireworks 4 Studio, Φφm zφskate v s·Φasnosti jeden z najlepÜφch WYSIWYG editorov web strßnok spolu s grafick²m editorom s prevratn²m prφstupom k tvorbe grafiky pre internet. Aj o Fireworks 4 si preΦφtate detailnejÜie - u₧ v bud·com Φφsle Chipu.
ètefan Stieranka
Macromedia Dreamweaver 4.0
Program pre tvorbu interaktφvnych webov²ch strßnok pod Windows
HardwarovΘ nßroky: min. PC/Pentium, 64 MB RAM, 100 MB na disku
V²robca: Macromedia Inc., San Francisko (www.macromedia.com)
Poskytol: Abakus Distribution, Praha (www.abakus.cz)
