Freitag, 10. Februar 2012

entwickler.com Magazine Konferenzen Entwickler Akademie Entwickler-Forum Jobbörse Bücher
Software & Support Verlag




 
CREATE OR DIE!!
 
April 2006
aus MX Magazin Ausgabe: 10.2005
Dreamweaver 8: Neues aus der Traumfabrik
von Frank Kudermann

Wir wollen die beste Dreamweaver-Version, die es jemals gab - mit dieser Vorgabe sind die Entwickler von Macromedia die neuste Ausgabe der beliebten Design- und Coding-Suite angegangen. MX Magazin hat die englische Beta 2 unter die Lupe genommen und zeigt, was aus der vollmundigen Vorgabe geworden ist.


Grundlegend zunächst die ersten Eindrücke: Die MX-Produktbezeichnung fällt komplett weg. Stattdessen heißt der neue Dreamweaver ganz der eigentlichen Version entsprechend Dreamweaver 8 statt wie erwartet Dreamweaver MX 2005. Schon die ersten Schritte funktionierten im Test ohne Probleme: Wie beim Vorgänger läuft die Installation schnell und geräuschlos ab. An der vieldiskutierten Produktaktivierung hat sich nichts geändert. Nach dem Start wird man vom gewohnten Startbildschirm empfangen - auf den ersten Blick sieht alles in etwa so aus wie bei der MX-2004-Version, sieht man einmal von dem neu gestalteten Logo ab.

Interface
Am Interface wurde einiges im Detail modifiziert, allerdings eher im Sinne einer Evolution denn einer Revolution. Wie bei Flash ist es jetzt möglich, das aktuelle Panel-Layout zu speichern und damit schnell zwischen verschiedenen Arbeitsumgebungen umzuschalten. Weitere Änderungen im Bereich der Benutzeroberfläche sind das neue CSS-Panel, die neue seitliche Symbolleiste für die Codeansicht sowie endlich auch für Mac-Benutzer die Möglichkeit, mehrere Dokumente unter Verwendung von Tabs in einem Fenster zu halten, was eine unglaubliche Arbeitserleichterung mit sich bringt. Zudem lassen sich in der oberen Symbolleiste weitere Funktionen anzeigen, zum Beispiel ein Buttonset für die diversen neuen Anzeige- und CSS-Render-Optionen.


Dreamweaver 8: Präsentiert sich ähnlich wie die Vorgängerversion.

Performance und Stabilität
Performance und Stabilität lassen sich bei der getesteten Betaversion natürlich nur mit Vorsicht beurteilen. Es sind aber dennoch Tendenzen erkennbar. Macromedia scheint aus den Startschwierigkeiten von Dreamweaver MX 2004 gelernt zu haben. Damals brachte erst das entsprechende Update eine wirklich stabile und einigermaßen schnelle Version hervor. Die Performanz ist in der Beta 2 generell mindestens genauso hoch wie bei Dreamweaver 7 - die Startgeschwindigkeit war beispielsweise auf dem Testrechner (Apple G5) sogar etwas schneller als beim Vorgänger. Von der Stabilität her erwies sich bereits die Vorabversion als durchaus produktionstauglich. Allerdings waren noch kleinere - betatypische - Probleme vorhanden, sodass man sehen muss, was die finale Version bringt. Aber auch hier zeigt sich, dass Macromedia das Feedback der Benutzer ernst genommen hat. Gute Chancen also, dass eine stabile Punkt-Null-Version im Herbst auf den Markt kommt.

Für Designer
Schon immer war die Zielgruppe von Dreamweaver zweigeteilt, wobei sich viele Benutzer in beiden Hälften des Programms wohl fühlen, das heißt sowohl in der visuell orientierten als auch in der eher codingbezogenen. Bei den designspezifischen Programmteilen wurden neben einer weiteren Überarbeitung der CSS-Erstellung und -Darstellung auch viele visuelle Hilfen implementiert.


Unified CSS: So sieht das neue Panel in seinen verschiedenen Modi aus.


DIV-Visualisierung: Layer, Ränder und Attribute werden sichtbar gemacht.

CSS
Dreamweaver hat sich als erste Entwicklungsumgebung schon früh mit der Visualisierung und Erstellung von CSS beschäftigt. Auch bei der aktuellen Version wurde weiter an der CSS-Implementierung gearbeitet. Die Darstellung wurde weiter verbessert und befindet sich näher an den aktuellen Browsern, wobei man sich trotzdem leider nicht immer 100-prozentig auf die Darstellung verlassen kann, sodass ein endgültiger Test in den Browsern nach wie vor unabdingbar ist. Zumindest muss man aber seine Testbrowser nicht mehr selbst konfigurieren. Auf dem Testsystem wurden alle installierten Browser erkannt und automatisch in die entsprechende Liste eingefügt. Eine Art Simulationsmodus, der für die Darstellung tatsächlich die Rendering Engines der entsprechenden Browser verwendet, wäre da sehr hilfreich. Ein Weg in diese Richtung wurde zumindest teilweise beschritten, da man nun die Ausgabe auf anderen CSS-konformen Medien simulieren kann. Wurde beispielsweise ein Print-CSS definiert, kann das Dokument mit diesem CSS angezeigt werden.


Größenwahn: Vergrößerung in der Designansicht mit Hilfslinien und Shortcuts

Starke Überarbeitung hat das CSS-Panel erfahren, das unter dem Schlagwort Unified CSS vorgestellt wurde. Dabei wur¬den zum einen die beiden früheren Panels CSS-Eigenschaften und CSS-Stile zu einem einzigen Panel zusammengefasst, zum anderen gibt es jede Menge zusätzlicher Darstellungs- und Editier-Modi. So bleiben kaum noch Wünsche offen, was das Editieren der eigenen CSS angeht. Mithilfe von zwei Reitern kann man jetzt alle verwendeten Regeln wie bisher anzeigen lassen oder aber sich nur auf die Regel(n) mit Gültigkeit für den markierten Codeteil konzentrieren. Ebenso werden jetzt alle definierten Attribute für ein ausgewähltes Element angezeigt, zusammen mit der Information, wo und in welchem CSS die angewandten Attribute eigentlich definiert wurden, genauso wie die Specificity (Spezifität, Gewichtung) der entsprechenden Regel. Sehr angenehm ist auch, dass man nur die verwendeten Attribute einer CSS-Regel anzeigen lassen kann. Insgesamt zielt Unified CSS also darauf ab, CSS-Informationen besser zu filtern und den Zugriff schneller zu gestalten, was alles in allem gut gelungen ist - aber nur, wenn man dem Panel genügend Platz auf dem Bildschirm lässt!

Eine weitere visuelle Hilfe
bei der CSS-Gestaltung ist die so genannte DIV-Visualisierung, mit der man wesentlich mehr Informationen zu allen Blockelementen (also nicht nur DIVs) sehen kann, als dies bisher möglich war. So kann man sich zum Beispiel margins und paddings grafisch anzeigen lassen, was einen guten Einblick in das verwendete Box Model gibt. Des Weiteren werden diverse Informationen über die relevanten Stilparameter als Tooltipps angezeigt.


Die Codeansicht mit der neuen Symbolleiste auf der linken Bemaßungsfunktion.


Kollabiert: Code zusammen-und aufgeklappt.

Wie im Grafikprogramm
kommt man sich vor, wenn man die beiden weiteren neuen Visualisierungshilfen benutzt, denn diese finden sich so normalerweise nur in entsprechenden Designapplikationen. Zum einen gibt es jetzt ein Seitenlineal, das sich sogar mit verschiedenen Maßeinheiten wie Zentimeter oder Pixel anzeigen lässt. Zieht man bei gedrückter Taste die Maus aus diesem Lineal heraus, lässt sich wie erwartet eine Hilfslinie erstellen, die komfortabel editierbar und auch mit allen bekannten Optionen wie EINRASTEN, SPERREN etc. versehen ist. Doch damit nicht genug: Wenn man die COMMAND- (Mac) beziehungsweise die CONTROL-Taste (Windows) drückt, kann man auch den Abstand zwischen den Hilfslinien beziehungsweise den Abstand zum Seitenrand in Pixeln anzeigen, sodass sich Hilfslinien auch zum Ausmessen von Layouts benutzen lassen. Ein weiteres Feature besteht darin, auf verschiedene Arten in ein Dokument zu zoomen. Die maximale Vergrößerungsstufe ist dabei 1.600 Prozent, sodass auch kleinste Details sichtbar werden - das Dokument bleibt dabei weiterhin voll editierbar.

Für Programmierer
Auch für Programmierer hat sich einiges getan. Zunächst fällt eine neue Symbolleiste an der Seite des Codeansicht-Fensters auf. Diese enthält eine Menge Buttons, die hauptsächlich einen Shortcut zu Funktionen darstellen, die normalerweise über das ganze User Interface verstreut sind. Beispielsweise kann man auf diese Weise schnell zwischen Dokumenten wechseln, unsichtbare Zeichen anzeigen und verbergen oder zuletzt benutzte Snippets einfügen. Was allerdings noch fehlt, ist die Möglichkeit, sich über eine grafische Oberfläche selber eine Auswahl von Funktionen zusammenzustellen, die man dort haben möchte.

Kollabiert
Ein weiteres Feature, das die Bearbeitung des Codes und die Übersichtlichkeit verbessert, nennt sich CODE AUSBLENDEN, also die Möglichkeit, bestimmte Teile des Codes zusammenzuklappen und damit nur relevante Teile des Dokuments zu zeigen. Das funktioniert, indem man zuerst den Teil des Dokuments markiert, den man zusammenklappen möchte. Dabei wird im linken Bereich, wo sich auch die Zeilennummerierung befindet, eine Markierung angezeigt.


Dateitransfer: Mehr Informationen auf Wunsch.

Ein Klick darauf blendet den ausgewählten Codeabschnitt aus, und es erscheint eine Art Button mit den ersten Zeichen des ausgeblendeten Textes. Durch einen Doppelklick auf diesen kann der ausgeblendete Text wieder angezeigt werden. Der Codeblock wird dabei auch automatisch eingeblendet, wenn eine SUCHEN & ERSETZEN-Operation etwas in einem solchen Block ändert oder wenn in der Designansicht etwas ausgewählt wird, das sich in einem ausgeblendeten Teil befindet. Raffiniert ist zudem die Möglichkeit, Ausblendungen zu verschachteln, indem ein Teil ausgeblendet werden kann, der bereits einen versteckten Codeblock beinhaltet. Außerdem merkt sich Dreamweaver beim Schließen der Datei, welche Teile ausgeblendet sind, sodass die Ausblendungen beim erneuten Öffnen erhalten bleiben. Das funktioniert ebenfalls Tag-bezogen und ist ebenso mittels des Tag-Selektors beziehungsweise über ein Kontextmenü möglich. Zudem lassen sich genau die Teile zusammenklappen, die gerade nicht markiert sind.

XML und XSL
Ein viel gehörtes Buzzword in letzter Zeit war XSL (siehe auch Kasten unten). Nachdem Dreamweaver bereits sehr früh die Dar- und Erstellung von CSS forciert hat, verwundert es nicht, dass nun auch XSL(T) auf breiter Basis unterstützt wird. Dem Entwickler stehen dabei visuelle Tools zur Verarbeitung von XSLT-Befehlen zur Verfügung. Sowohl komplette XSL-Templates als auch einzelne Fragmente werden unterstützt, die sich ihrerseits in andere (dynamische) Seiten integrieren lassen. Dazu wählt man eine XML-Quelle aus; dies kann sowohl eine statische Datei als auch ein so genannter Feed sein, also eine XML-Datenquelle, die direkt von einem Server geholt werden kann. Da das inzwischen sehr verbreitete RSS-Format dem XML-Standard folgt, kann man leicht Headlines vieler Newsseiten in die eigene Page integrieren oder alternativ beispielsweise Stau- und Wetterberichte, die in einem entsprechenden Format verfügbar sind. Entsprechende Server-Behaviours machen es dabei möglich, diese Feeds live zum Beispiel in eine PHP-Seite zu integrieren - zur Not auch ganz ohne Programmierkenntnisse.


Synchron: Der überarbeitete Dialog zur Synchronisation.



Um die händische Programmierung der entsprechenden XSLT-Tags kommt man herum, da Macromedia einen eleganten visuellen Weg gefunden hat, solche Daten zu integrieren. Nach der Auswahl einer XML-Quelle sieht man im Bindungen-Panel die Baumstruktur des Dokuments und kann nun mittels Drag & Drop die gewünschten Informationen in das XSL-Dokument ziehen und dort mit den üblichen Möglichkeiten formatieren. Dabei werden die variablen Informationen wie bei Live Data als Platzhalter in geschweiften Klammern angezeigt. Im Gegensatz dazu werden sie aber in der Designansicht nicht mit den eigentlichen Daten gefüllt, sodass für die Vorschau immer noch ein Sprung in den Browser nötig ist. Des Weiteren existieren noch einige vordefinierte Formatierungsmöglichkeiten sowie die Möglichkeit, die Daten anhand bestimmter Bedingungen weiter zu bearbeiten. Beispielsweise lassen sich Zahlen auf vielfältige Art und Weise formatieren oder bestimmte Daten ausfiltern, wobei auch mehrere Filterregeln mit und beziehungsweise oder verknüpft werden können.

Resümee
Sind die Dreamweaver-Entwickler ihrer Vorgabe gerecht geworden? Diese Frage lässt sich durchaus mit einem kräftigen JA! beantworten, denn die aktuelle Version ist in der Tat die beste, die es je gab. Es erstaunt nicht nur, was man auch aus einem so gereiften Programm noch an neuen Funktionen hervorzaubern kann - diese wirken darüber hinaus nicht aufgesetzt und sind durchgehend sinnvoll implementiert. Einziger Kritikpunkt: Mittlerweile benötigt man doch relativ leistungsfähige Hardware, um so eine große und komplexe Applikation wie Dreamweaver performant nutzen zu können - vor allem bei sehr großen Dateien und Sites wirkt das Programm manchmal etwas behäbig. Dafür wird man mit einer unglaublichen Menge an Möglichkeiten belohnt. Auch speziellere Wünsche bleiben kaum noch unerfüllt. Macromedia entwickelt sich weiter mit den neuesten Standards. Das zeigt die konsequente Unterstützung von CSS und jetzt auch XSL. So bleibt ein überaus positiver Eindruck: Der Kauf oder das Upgrade sind insgesamt wärmstens zu empfehlen.

Gekürzte Version - der vollständige Artikel ist in MX Magazin 10/2005 nachzulesen.

Systemanforderungen, Preise und Verfügbarkeit
Anforderungen für Windows
  • Windows 2000, Windows XP
  • 800 MHz Pentium-3-Prozessor,
  • 256 MB Hauptspeicher,
  • 2 GB auf der Festplatte
Anforderungen für Macintosh
  • OS X 10.3 oder 10.4
  • 600 MHz G3-Prozessor,
  • 256 MB Hauptspeicher,
  • 2 GB auf der Festplatte
Preise
  • Vollversion: 479 Euro Update: 239 Euro
    (Preise zuzüglich Mehrwertsteuer, Angaben ohne Gewähr)
Verfügbarkeit
  • in Englisch ab September 2005,
  • deutsche Version kurz danach


    Hat Ihnen dieser Artikel gefallen? Dann abonnieren Sie VISUAL-X direkt über unser

zur vorherigen Seite
zurück
an den Anfang der Seite
nach oben
Diesen Artikel drucken
drucken
Diesen Artikel weiterempfehlen
empfehlen

Anzeige
Software & Support Verlag GmbH