Kvalitní webové stránky se bezesporu neobejdou bez zajímav∞ch, profesionáln╪ vytvo²en∞ch grafick∞ch prvkà. K tomu je samoz²ejm╪ pot²eba speciální software, kter∞ obsahuje poºadované funkce. Jaké moºnosti nabízí grafikàm program Macromedia Fireworks 2?
Lahàdka pro vaτe oƒi
Bylo nebylo. V zaƒátcích tvorby obrázkà pro webové stránky museli grafici sáhnout po kombinaci hned n╪kolika ràzn∞ch programà, nejƒast╪ji po Adobe Photoshopu s n╪kolika plug-in moduly a sadou sharewarov∞ch utilit, aby dosáhli k∞ºeného v∞sledku. V loσském roce se na trhu koneƒn╪ objevily první programy nabízející kompletní sluºby v oblasti webové grafiky a letoτek se stal rokem jejich druh∞ch verzí. Zatímco Adobe integroval vlastnosti svého webového grafického programu ImageReady do nového Photoshopu 5.5 a ImageReady 2 se samostatn╪ neprodává, firma Macromedia drºí svoji linii a uvedla program Fireworks 2.
Macromedia Fireworks 2 je ve svém principu grafick∞ editor, nabízející nástroje pro práci s vektorovou i bitmapovou grafikou v rámci jediného obrázku. Krom╪ grafické ƒásti nabízí i funkce specifické pro webovou grafiku, jako je p²íprava animací, map a interaktivních tlaƒítek, a samoz²ejm╪ export v pot²ebn∞ch formátech.
Editace grafiky
Základem Fireworks 2 je grafick∞ editor, kter∞ màºete pouºít pro nakreslení nov∞ch obrázkà nebo pro úpravu obrázkà p²ipraven∞ch v jin∞ch aplikacích. Podporován je import formátà PNG, GIF, JPEG, BMP, TIFF, LRG a pro texty ASCII a RTF. Grafiku màºete do Fireworks p²etáhnout také p²ímo z dalτí aplikace, nap²íklad z Freehandu, Illustratoru i CorelDRAW, z Photoshopu a Flashe nebo z MS Office, Internet Exploreru a Netscape Navigatoru.
Znalci grafick∞ch aplikací si moºná vτimli, ºe zmín╪ná kolekce programà zahrnuje editory vektorov∞ch i bitmapov∞ch obrázkà, jejichº zpàsob zpracování je dosti odliτn∞. Fireworks 2, jak se u podobn∞ch aplikací stává zvykem, totiº màºe v rámci jednoho dokumentu pracovat s ob╪ma typy grafiky a vyuºívat tak jejich v∞hod.
Pro prvotní p²ípravu obrázku je moºná vhodn╪jτí vektorová grafika (²adíme do ní i text), jejíº základní v∞hodou je zachování editovatelnosti tvaru a vlastností. K dispozici jsou základní nástroje pro kreslení ƒar, geometrick∞ch objektà a pro zadávání textu. U textu lze nastavit základní typografické vlastnosti vƒetn╪ t²eba prostrkávání, τí²ky písmen nebo vertikálního posunu (na úrovni písmen). Tvar grafick∞ch objektà lze m╪nit taºením kotevních bodà, rotací, p²eklopením, zkosením apod. Také text zàstává p²i vτech t╪chto operacích pln╪ editovateln∞.
Nastavit lze ràzné parametry ƒáry a v∞pln╪ a hlavn╪ aplikovat "ºivé" efekty, jako je p²idání stínu, zá²e, vn╪jτího i vnit²ního úkosu nebo vytlaƒení. ªivost t╪chto efektà se projevuje v jejich automatickém p²izpàsobení zm╪nám tvaru objektu. Novinkou oproti Fireworks 1 je moºnost aplikovat n╪kolik efektà naráz na jeden objekt. Jednou p²ipravenou kombinaci parametrà ƒáry, v∞pln╪ a efektà màºete také pojmenovat a uloºit do knihovny stylà. Odtud lze styl kdykoliv vybavit a aplikovat na libovoln∞ objekt, ƒímº lze snadno udrºet jednotn∞ vzhled grafick∞ch prvkà. Pro snazτí organizaci objektà nabízí Fireworks práci ve vrstvách a moºnost vytvá²et symboly a jejich instance, které se po úprav╪ symbolu automaticky p²izpàsobí.
Vektorové objekty lze p²evést na bitmapové obrázky, které je pak moºné upravovat pomocí nástrojà tuºka, τt╪tec, nálevka nebo guma. Zajímav╪jτí je ale aplikovaní filtrà na takové obrázky, nap²íklad rozost²ení. Filtry se od efektà odliτují svou nevratností - pokud je aplikujete na vektorov∞ objekt, stane se z n╪j bitmapa. Program Fireworks 2 podporuje zásuvnou architekturu Photoshopu, takºe lze pouºívat i filtry p²ipravené pro tento program.
ªivé obrázky
Webová grafika nabízí oproti své starτí tiτt╪né sest²e ²adu zvláτtností vypl∞vajících ze zpàsobu pouºití. Jednou z nich jsou webové mapy, kdy ƒásti obrázku slouºí jako odkazy na internet prost²ednictvím URL. Zóny s odkazy màºete kreslit bu╘ ruƒn╪ (obdélník, ovál, polygon), anebo prost╪ necháte automaticky vygenerovat oblast obklopující zvolen∞ objekt. V palet╪ Object pak lze zadat URL a nastavit dalτí parametry odkazu.
Podobn╪ jako oblasti odkazà lze nov╪ vytvo²it i v∞²ezy obdélníkového tvaru, které obrázek d╪lí do samostatn∞ch obdélníkov∞ch ƒástí. P²i exportu je pro kaºdou ƒást vytvo²en samostatn∞ soubor, kter∞ màºe mít vlastní exportní parametry (formát, barvy atd.). Na webové stránce se potom pàvodní obrázek poskládá z jednotliv∞ch ƒástí pouºitím tabulky. V∞hodou tohoto d╪lení je menτí velikost grafiky (díly jsou optimalizovány samostatn╪) a plynulejτí nahrávání stránky.
Dále tady máme tvorbu animovan∞ch GIF obrázkà, kterou program také podporuje. Krom╪ vrstev lze totiº p²idat také políƒka (frames), která p²i spojitém p²ehrání vytvo²í animaci. Animaci lze sloºit z jiº p²ipraven∞ch obrázkà nebo ji navrhnout ruƒn╪ nakreslením jednotliv∞ch políƒek. Zde se jist╪ bude hodit moºnost nastavit sdílení vrstvy v rámci celé animace (pro nem╪nné prvky) nebo zobrazení onion skinning, tj. p²edchozích ƒi následujících políƒek animace. Pokud z objektu vytvo²íte symbol a jeho instanci, lze políƒka animace mezi t╪mito dv╪ma instancemi vygenerovat automaticky, jde o tzv. tweening. Moºnosti tweeningu jsou ale omezené a ²adu morfingov∞ch efektà budete v p²ípad╪ pot²eby muset nakreslit ruƒn╪.
Spojením políƒek s webov∞mi objekty, jak jsou souhrnn╪ naz∞vány mapy a v∞²ezy, a dodáním skriptà dostaneme interaktivní grafiku, m╪nící svàj vzhled v závislosti na akcích uºivatele (pohybech ukazatele). Jiº produkt Fireworks 1 nabízel hezk∞ nástroj pro p²ípravu tzv. rollover tlaƒítek, kter∞ byl ve verzi 2 dále zobecn╪n. V∞sledkem je nová paleta Behaviours, umoºσující k webov∞m objektàm p²id╪lovat reakce na pohyby ukazatele nad objektem. Lze tak vytvá²et tradiƒní rollover tlaƒítka, kdy jsou jednotlivé verze tlaƒítka obsaºeny v prvních ƒty²ech políƒkách, nebo nechat zobrazit zprávu ve stavové ²ádce okna. K pokroƒilejτím funkcím pat²í p²ehození obrázku (ze souboru nebo z jiného políƒka) ve v∞²ezu odliτném od aktivaƒního objektu nebo provázání stavà tlaƒítek tak, ºe pouze jedno tlaƒítko je ve stisknutém stavu (pro tvorbu grafick∞ch v∞b╪rov∞ch tlaƒítek). Tyto akce lze navzájem kombinovat, p²ísluτné JavaScripty jsou pochopiteln╪ generovány automaticky. Aplikace Fireworks 2 tak grafikàm zp²ístupσuje moºnosti, pro jejichº pouºití by jinak pot²ebovali intenzivní spolupráci programátora skriptà.
Expert na export
Program Fireworks ukládá obrázky v mírn╪ upraveném formátu PNG (obsahuje vektorovou informaci), kter∞ màºete otev²ít vτude, kde je PNG podporován. Na webu jsou ovτem b╪ºn╪jτí formáty GIF a JPEG, a tak program samoz²ejm╪ umoºσuje export do t╪chto formátà (a také do TIFF, PICT, LRG a BMP).
Finální export obrázkà pro web má svoji zvláτtnost v hledání vyváºenosti mezi kvalitou obrázku a velikostí grafického souboru prost²ednictvím nastavení ²ady parametrà. Jiº p²edchozí verze Fireworks 1 nabízela pohodln∞ exportní dialog, v n╪mº τly najednou zobrazit aº ƒty²i náhledy p²i ràzném nastavení parametrà. U kaºdého náhledu je vid╪t velikost souboru, takºe uºivatel màºe interaktivn╪ ladit parametry a ihned si ov╪²it a porovnat v∞sledky. Ve Fireworks 2 byla navíc vylepτena práce s barevnou paletou, a uºivatel má tedy nad barvami v╪tτí kontrolu.
Dalτí novinkou je exportní ƒarod╪j, kter∞ poradí s nastavením parametrà exportu. Zvláτt╪ ƒarod╪j "Export To Size" uτet²í spoustu ƒasu, umí totiº najít nejlepτí nastavení pro zvolenou velikost grafického souboru.
Webová grafika p²irozen╪ není jen vlastní obrázek, ale také integrace s kódem. S obrázkem tak màºete ihned exportovat i p²ísluτnou stránku HTML, resp. DHTML se vτemi pot²ebn∞mi skripty. To se hodí jak p²i návrhu map s odkazy, tak i p²i pouºití rollover efektà nebo p²i roz²ezání obrázku na více ƒástí. Vytvo²enou stránku lze dále upravovat ve webovém editoru, pohodlná integrace je hlavn╪ s Dreamweaverem firmy Macromedia.
Záv╪r
Macromedia Fireworks 2 nabízí snad vτe, co si màºe grafik p²ipravující obrázky pro web p²át. Díky integraci ²ady nástrojà v jediném programu se tak v∞razn╪ zvyτuje pohodlí a zkracuje ƒas, kter∞ by byl pro p²ípravu webové grafiky pot²eba p²i pouºití n╪kolika utilit. Mezi nejuºiteƒn╪jτí novinky verze 2 pat²í moºnost aplikovat n╪kolik ºiv∞ch efektà na jeden objekt, schopnost rozd╪lit obrázek do více souborà a τirτí podpora akcí JavaScriptu. A to jsme se jeτt╪ nezmínili o moºnostech dávkového zpracování, kdy lze najednou upravovat n╪kolik dokumentà, nap²íklad v nich vyhledávat a nahrazovat text ƒi barvu. Struƒn╪ ²eƒeno, pokud si chcete po²ídit jedin∞ program pro práci s webovou grafikou, potom je Macromedia Fireworks 2 ten prav∞.