... aus Dreamweaver 4, Galileo Design
Die oben genannten Probleme mit JPEGs lassen sich umgehen, wenn Sie zusammen mit Dreamweaver auch die Bildbearbeitung Fireworks von Macromedia einsetzen. Fireworks löst seit der Version 3 dieses Problem ganz elegant, indem es sich anhand der aus Dreamweaver bekannten Design Notes den Speicherort der Ursprungsdatei merkt und diese dann zur Bearbeitung heranzieht. Auch mit älteren Versionen von Fireworks klappt diese Zusammenarbeit ganz hervorragend, wenn man sich bei der Dateiablage an bestimmte Konventionen hält: Wenn im selben Verzeichnis wie die zu bearbeitenden Bilder auch eine Datei mit dem gleichen Namen und dem Suffix .png liegt (Fireworks verwendet PNG als natives Dateiformat), so öffnet Fireworks 1 diese automatisch in der Annahme, dass es sich hierbei um die Originaldatei handelt.
In Fireworks 2 hingegen bekommt der Benutzer automatisch einen Dialog für die Suche nach der Originaldatei, wenn ein Bild aus Dreamweaver nachgebessert werden soll. Fireworks ab Version 3 lässt dem Benutzer per Voreinstellung die Wahl, ob immer oder nie die Vorlage benutzt werden soll oder ob er das von Fall zu Fall entscheiden möchte.
Wenn Sie in Dreamweaver Befehle • Bild in Fireworks optimieren wählen, kommen Sie zu dem Exportvorschau genannten Fenster von Fireworks, das eine Vielzahl von Optimierungsmöglichkeiten bietet (Abb. 45). Gerade bei GIF-Bildern kann diese Funktion helfen, die Dateigrößen noch weiter gefahrlos zu minimieren. Fireworks zeichnet sich unter anderem dadurch aus, dass es die GIF-Dateien mit der geringsten Dateigröße unter allen vergleichbaren Tools produziert.
Änderungen an Dateien in Fireworks werden von Dreamweaver ohne Ihr weiteres Zutun automatisch übernommen. Lediglich bei Größenänderungen müssen Sie nochmals den Grösse zurücksetzen -Button der Eigenschaftenpalette drücken.
Auch der umgekehrte Weg von Fireworks zu Dreamweaver gestaltet sich denkbar einfach: Fireworks bietet eine Vielzahl von Optionen, um zu den erstellten Grafiken auch gleich den dazugehörigen Code zu generieren und in Dreamweaver einzubetten. Dabei beschränkt sich dieser Code nicht nur auf das simple <img>-Tag, sondern es können auch komplexe Gebilde von zerschnittenen und in Tabellen positionierten Bildern oder JavaScript-Aktionen (in Dreamweaver Verhalten genannt) erstellt werden. Diese und auch automatisch generierte Bibliotheksobjekte können dann von Dreamweaver übernommen werden.
Die einfachste Methode des Codeaustauschs zwischen den beiden Programmen ist es, beim Exportieren der Bilder aus Fireworks den dazugehörigen Code in eine eigene HTML-Datei schreiben zu lassen. Diese Datei können Sie dann in Dreamweaver über Einfügen • Medien • Fireworks-HTML direkt importieren (Abb. 46), wobei Dreamweaver den HTML-Code in das aktuelle Dokument übernimmt und so das dazugehörige Bild mit einbettet. Bei diesem Import haben Sie auch die Möglichkeit, die von Fireworks generierte HTML-Datei löschen zu lassen, damit nicht zu viele Leichen ihre Festplatte bevölkern. Alternativ haben Sie beim Export aus Fireworks auch die Option, den Code in die Zwischenablage zu kopieren, sodass Sie diesen in anderen Editoren wie BBEdit oder HomeSite per Copy and Paste einfügen können. Dieselbe Option funktioniert übrigens auch mit HTML-Code, der vom Konkurrenzprodukt Adobe ImageReady generiert wurde.
Als Spezialist für Webgrafiken kann Fireworks natürlich auch Imagemaps erstellen (Abb. 47). In vielen Funktionen ist das Programm hierbei Dreamweaver überlegen: So ist es in Dreamweaver nicht möglich, in ein Bild hinein zu zoomen, um die Koordinaten für eine Imagemap präzise zu positionieren.
Fireworks bietet hier die Möglichkeit, von 6 % bis 6400 % zu zoomen (bei der letzten Möglichkeit wird ein einzelnes Bildpixel dann 64 x 64 Pixel groß auf Ihrem Monitor dargestellt – diese Option werden Sie also nicht allzu oft nutzen :-).
Außerdem bietet Fireworks alle Möglichkeiten, die einzelnen Formen einer Imagemap mit allen Tools zu bearbeiten, die man aus Vektorzeichenprogrammen wie Freehand oder Illustrator kennt. Dadurch ist es im Gegensatz zu Dreamweaver auch möglich, Ovale oder Kombinationen der drei Formen Rechteck, Kreis und Polygon zu zeichnen.
Die resultierenden Instruktionen für die Imagemap werden beim Export zusammen mit dem restlichen Code in die bereits erwähnte HTML-Datei geschrieben oder in die Zwischenablage kopiert.
Falls Sie nachträglich in Fireworks noch Änderungen an bereits erzeugten Dateien und dem damit verbundenen Code durchführen wollen, bietet das Programm über den Befehl Datei • HTML aktualisieren... die Möglichkeit, diese Änderungen an Dreamweaver (oder einem beliebigen anderen Editor) mitzuteilen. Dazu müssen Sie in der dann folgenden Dialogbox die Datei auswählen, in die Sie das HTML aus Fireworks eingebettet haben. Falls Fireworks diesen Code dort nicht finden kann, weil er nachträglich verändert wurde, bietet das Programm an, den nötigen Code inklusive eventuell benötigter JavaScripte erneut in das Zieldokument zu schreiben.
Bei häufig verwendeten Grafiken – wie zum Beispiel Gruppen von Navigationselementen – bietet es sich an, diese gleich als Dreamweaver-Bibliotheksobjekte aus Fireworks zu exportieren. Mehr Informationen zum Sinn von Bibliotheken und zu deren Erstellung und Anwendung finden Sie im Kapitel »Effektive Arbeitstechniken«. Um eine solche Bibliothek von Fireworks erzeugen zu lassen, wählen Sie beim Export die Option Sichern als • Dreamweaver Bibliothek (.lbi) (Abb. 48). Falls Sie in Ihrer Website schon Bibliotheksobjekte angelegt haben, werden Sie nun in einem Dialog aufgefordert, den dazugehörigen Ordner Library im Root-Verzeichnis der Site zu öffnen. Falls Sie noch keine Bibliothek angelegt haben sollten, so ist dies jetzt ein guter Zeitpunkt, es zu tun. Durch diese Arbeitsweise werden Sie eine Menge unnötiger Wiederholungen immer gleicher Arbeitsgänge einsparen.
Fireworks gleicht in seinem Aufbau in vielen Dingen Dreamweaver, bis hin zu der offenen Konfigurierbarkeit durch externe Steuerdateien. Die gesamten Exportfunktionen von Fireworks sind ähnlich wie in Dreamweaver in JavaScript geschrieben und befinden sich im Programmordner unter Settings/ HTML-Code. Wenn Sie mehr als ein ungesundes Basiswissen von JavaScript besitzen, können Sie diese Dateien, die sich mit jedem Texteditor öffnen lassen, nach Herzenslust ändern und damit zum Beispiel den HTML-Output von Fireworks manipulieren.