Dreamweaver MX und Fireworks MX: Tool-Paradies für Webworker

Die Macromedia-MX-Generation hat es in sich: Attraktive Neuerungen machen das Update zum Muss – vor allem im Fall von Dreamweaver.

Artikel erschienen in Swiss IT Magazine 2002/19

     

Schon äusserlich haben sich der Webpage-Editor und das Web-Grafikprogramm von Macromedia in der MX-Version stark verändert: Allen MX-Produkten gemeinsam ist die kompakte Oberfläche, in der sich eine beliebige Kombination von je nach Bedarf auf- und zuklappbaren Parameter-Eingabebereichen statt einzelner, irgendwo umherliegender Palettenfenster ein einziges, im Ganzen manipulierbares Gesamtfenster teilen. Das klingt kompliziert, ist aber äusserst einfach und bequem - die Begeisterung kommt beim ersten Ausprobieren.



Die meisten Paletten braucht man aber nur noch selten, denn wie in Flash MX warten auch Dreamweaver und Fireworks nun mit einem Property Inspector auf, der alle wesentlichen Eigenschaften des gerade selektierten Objekts auf einen Blick präsentiert. Praktischer geht es kaum mehr.




Die verbesserte Oberfläche allein bringt zwar viel, nur damit wäre ein Update auf die MX-Generation aber wohl kaum gerechtfertigt. Beide Produkte haben auch unter der Haube viel Neues zu bieten.


Fireworks: Webgrafik par Excellence

Die Bearbeitung von Bitmap-Grafiken erfährt in Fireworks MX einen starken Schub: Besseres Masking, die neuen Retuschierwerkzeuge Weichzeichner, Schärfen, Verwischen, "Dodge" und "Burn" machen den bisher nötigen gelegentlichen Umweg über Photoshop auch bei der Fotobearbeitung fast überflüssig. Und es kommt noch besser: Beim Import von Photoshop-Dateien bleibt nicht nur die Ebenenstruktur, sondern auch der editierbare Text erhalten. Damit das Schriftbild auch beim Transfer hin und zurück stets übereinstimmt, führt Fireworks MX eine neue Font-Caching-Technologie ein. Wie unser Beispiel zeigt, funktioniert das Text-Editing in Photoshop-Files anstandslos - aber nicht nur dort: In Fireworks MX fällt endlich der antiquierte Texteingabe-Dialog weg; Text editiert man nun ganz einfach direkt auf der Arbeitsfläche, und die Textattribute stellt man im Property Inspector ein. Bravo - dafür wurde es höchste Zeit!



Eine Folge ähnlicher Grafiken mit variablen Textinhalten und Bildbereichen, zum Beispiel Werbebanner für verschiedene Automodelle, erstellt das Programm neu halbautomatisch: Der Gestalter entwirft das Grundgerüst und spezifiziert an den Stellen, wo unterschiedliche Inhalte geplant sind, Variablen als Platzhalter. Der "data driven graphics wizard" generiert daraufhin die gewünschte Serie von Grafikdateien, wobei die Inhalte für die Variablen aus einer XML-Datei gelesen werden, die wahlweise von Hand erstellt oder aus einer Datenbank erzeugt wurde.




Interessant auch die Funktion "Reconstitute Table", die bei Angabe einer im Tabellenlayout gehaltenen HTML-Datei automatisch alle benötigten Grafiken inklusive Links, Image Maps und Hotspots zusammenstellt - nützlich bei der Bearbeitung einer Website, deren Originaldateien nicht mehr vorhanden sind. In der uns vorliegenden Betaversion funktioniert das Feature allerdings noch nicht.



Fireworks lässt sich nun wie Dreamweaver mit Erweiterungen im Macromedia-Extension-Manager-Standard erweitern; dabei handelt es sich um JavaScripts mit optionalem User-Interface in Flash. Zu den mitgelieferten Extensions gehören die Alignment-Palette, der Data Driven Graphics Wizard sowie eine Palette zur Ergänzung von Linien mit Pfeilspitzen; zusätzliche Erweiterungen können von der Macromedia-Website heruntergeladen werden.




Bessere Popup-Menüs und Buttons

Stark verbessert hat Macromedia auch den Popup-Menü-Editor, der mit Fireworks 4 eingeführt wurde. In der neuen Version können nun auch horizontal ausklappende Popup-Menüs erstellt werden; sämtliche relevanten Darstellungsparameter vom Textattribut bis zur Umrandung der Menüelemente lassen sich einstellen. Das Programm erzeugt nach Abschluss des Wizards entweder Grafikelemente oder DHTML-Code samt den zugehörigen JavaScript-Funktionen, die nahtlos in Dreamweaver und neu auch andere Webeditoren übernommen werden.





Dreamweaver: Aus drei mach eins

Der Webpage-Editor hat sich in der MX-Version noch mehr geändert als das Grafikprogramm: Während Fireworks nebst neuer Oberfläche mit einer stattlichen Anzahl produktivitätssteigernder Features ergänzt wurde, integriert Dreamweaver nun mehrere bisher separate Produkte. In erster Linie enthält Dreamweaver MX die gesamte kombinierte Funktionalität von Dreamweaver 4 und Dreamweaver Ultradev: kein Dreamweaver mehr ohne integrierte Werkzeuge für dynamische Websites. Die laut Dokumentation mitgelieferte Anwendung HomeSite+ (in der Betaversion noch nicht enthalten) bietet zusätzlich sämtliche Funktionen von ColdFusion Studio - für manchen Entwickler gar nicht nötig, denn die wesentlichen ColdFusion-Designfunktionen sind bereits in Dreamweaver selbst enthalten, darunter umfassender Support für ColdFusion-MX-Komponenten und ein Debugging-Dialog: Der Debugging-Output des ColdFusion-Servers wird damit direkt innerhalb Dreamweaver angezeigt.



Darüber hinaus bietet das Programm nun einen ausgefeilten Code-Editor mit fast allen Möglichkeiten von HomeSite samt Code-Hinweisen (sogar für XML-Strukturen gemäss importierter DTD), Tag-Editoren für HTML, CFML und ASP.NET, Codevalidierung sowie korrekt formatiertem Printout und wird so zum universellen Editor für HTML, XHTML, XML, ColdFusion, ASP, ASP.NET, JSP und PHP. Das Argument vieler Profi-Webentwickler gegen visuelle Editoren ist damit definitiv entkräftet. Besonders attraktiv: Der XML-Support unterstützt das Bearbeiten, Validieren und Importieren von XML-Schemas und XML-Code. Das Produkt erlaubt auch die Umwandlung von HTML-Code in XHTML sowie die XHTML-Validierung nach XHTML 1.0 Strict und Transitional.





Datenbankanbindung leichtgemacht

Was früher Ultradev-Anwendern vorbehalten war, steht nun jedem Dreamweaver-Benutzer offen: dynamische Websites mit Datenbankanbindung ohne Programmierung. Webdesigner, die vor derartigen Aufgaben bisher zurückgeschreckt sind, haben nun keine Ausrede mehr: Es ist äusserst einfach, eine simple, datenbankgesteuerte Website mit Seiten zur Anzeige, zum Einfügen und zum Mutieren von Datensätzen zu erstellen.



Ein "Master-Detail Pageset" mit einer Liste aller vorhandenen Datensätze auf einer Übersichtsseite und Links auf eine detaillierte Seite zu jedem Datensatz ist in fünf Schritten erstellt. Die Voraussetzung: Es existiert eine passende Datenbank, die auf dem Test-Webserver abgelegt ist. Wir haben mit einem ColdFusion-Webserver als Beispiel getestet und die Abfrage in wenigen Minuten erstellt; ASP und JSP wären ebenfalls unterstützt:





• Zunächst muss in Dreamweaver eine "Site" mit einer Startseite sowie zwei Seiten für Master und Detail angelegt werden.




• In Dreamweaver wird nun der Dokumententyp für die dynamische Site festgelegt, in unserem Fall ColdFusion.




• Auf Basis der Datenbank, im einfachsten Fall eine Access-Tabelle, definiert der ColdFusion-Administrator eine Datenquelle.




• Auf der für die Master-Darstellung vorbereiteten Seite wird nun "Master Detail Page Set" aus den "Application Objects" im "Insert"-Menü gewählt und im folgenden Dialog die Datenquelle sowie die auf Master- und Detailseiten gewünschten Felder bestimmt. Das Programm erstellt entsprechende HTML-Tabellen samt zugehörigem ColdFusion-Code.




• Die Rohdarstellung kann nun mit den visuellen Tools von Dreamweaver auf das restliche Design der Site angepasst werden.



Ebenso einfach entstehen Formulare zur Eingabe und zur Mutation von Datensätzen, dynamische Tabellen, Text- und Bildinhalte, "Repeating Regions" für tabellarische Inhalte mit dynamisch angepasster Zeilenzahl sowie dynamische Formularelemente wie Listboxen und Radio Buttons, die zur Laufzeit aufgrund des Datenbankinhalts generiert werden. Dreamweaver bietet ausserdem Assistenten zum Einfügen häufig benötigter ColdFusion-, ASP-, JSP- und PHP-Objekte sowie von ASP.NET-Konstrukten für Web Services.



Gegenüber Dreamweaver Ultradev hat sich die Anzahl der Server-Behaviors leicht erhöht; neu sind die umfassende Integration von ColdFusion und die Unterstützung für ASP.NET und PHP. Wer mit der vorgefertigten Funktionalität nicht auskommt, die sich vor allem auf Server-Scripts und Basislayouts für einfache Datenbankabfragen beschränkt, hat mit dem Code-Editor eine perfekte Entwicklungsumgebung zur Verfügung.


Detailverbesserungen in Hülle und Fülle

Dreamweaver verhält sich dem Webdesigner gegenüber genauso entgegenkommend wie dem Entwickler, was sich in zahlreichen Details äussert: Bei der Verwaltung der Files - vom Erstellen neuer Dateien bis zum Upload auf den Webserver - hilft der im gewohnten Stil als aufklappbarer Fensterbereich integrierte Datei-Explorer, der das bisherige lästige Site-Fenster ersetzt. Ein Site-Definitions-Assistent hilft dem Einsteiger bei der Konfiguration der neuen Site für verschiedene Server-Technologien und beim Einrichten der ISP-Accounts.



Sehr brauchbare Verbesserungen auch bei der Vorlagenverwaltung: Mit den "Dream Templates" von MX lässt sich schon fast ein Content-Management-System aufbauen. Neu lassen sich Vorlagen verschachteln, und einzelne Regionen der Vorlage können über den Befehl "#TemplateBeginIf" regelbasiert in einer Vorlage erscheinen oder unterdrückt werden. Ebenfalls neu sind die "Repeating Regions", die sich vor allem für Tabellen eignen: In der Vorlage wird nur eine Zeile der Tabelle angegeben und als Repeating Region definiert; der Content Contributor kann dann beliebig viele Zeilen erfassen; die Tabelle wird im Browser stets in der korrekten Länge angezeigt.




Die verschiedenen Toolbars wählt man durch Anklicken eines Karteireiters an. So erhält man Schnellzugriff zum Beispiel auf verschiedene ColdFusion-orientierte Werkzeuge, auf Text- und Tabellenformate sowie, ein nettes Zückerchen am Rande, auf diverse sonst mühsam einzugebende Sonderzeichen wie © oder ®.



Macromedia vereinfacht den Start mit dem neuen Tool besonders auch dem Einsteiger mit der integrierten Referenz für HTML und JavaScript, verschiedenen praxisorientierten Tutorials, einer Reihe von Quickstart-Vorlagen für bestimmte Arten von Websites (zum Beispiel "Produktkatalog" oder "Slideshow") und einem hervorragenden Help-System, das in der neuen Version nun nicht mehr als Website, sondern im traditionellen Help-Stil des Betriebssystems daherkommt. Das Answers-Panel gibt zudem direkten Zugriff auf die relevanten Sektionen der Macromedia-Website, die unter anderem die aktuellen Tech Notes und zusätzlich ladbare Erweiterungen enthält.



Artikel kommentieren
Kommentare werden vor der Freischaltung durch die Redaktion geprüft.

Anti-Spam-Frage: Wieviele Fliegen erledigte das tapfere Schneiderlein auf einen Streich?
GOLD SPONSOREN
SPONSOREN & PARTNER