WYSIWYG-Editoren: Webdesign ohne Code

Wer Websites nicht von Hand erstellen will, braucht ein WYSIWYG- Werkzeug. Wir vergleichen fünf der bekanntesten Programme.

Artikel erschienen in Swiss IT Magazine 2001/19

     

Nach wie vor werden viele Homepages von Hand programmiert. Für umfassende Sites ist dieses Vorgehen jedoch mit einem beträchtlichen Arbeitsaufwand verbunden. Zwar kann mit Server-Side-Techniken wie ASP oder PHP ein grosser Teil der wiederkehrenden Elemente in einer Site dynamisch erzeugt werden. Allerdings erfordern solche Lösungen Programmierkenntnisse weit über HTML hinaus. Für Unternehmen, die ihre Website selbst gestalten möchten, aber keinen Webprogrammierer anstellen möchten oder können, gibt es eine Reihe von WYSIWYG-Werkzeugen, mit denen auch umfangreiche Sites bequem erstellt und betreut werden können.


What You See Is What You Get

Bei den fünf hier vorgestellten Produkten handelt es sich um sogenannte WYSIWYG-Editoren. Im Vergleich zu codebasierten Editoren wie etwa HomeSite werden WYSIWYG-Editoren wie Textverarbeitungs- oder Layoutprogramme bedient. Der HTML-Code wird dabei im Hintergrund erstellt.



Die Umsetzung vom grafischen Layout in HTML-Code ist allerdings keine leichte Aufgabe. Besonders beim mehrmaligen Redigieren von Dokumenten zeigten die ersten Generationen dieser Programme markante Schwächen. Der produzierte Code wurde zu komplex oder gar fehlerhaft. Inzwischen sind WYSIWYG-Programme in der vierten, fünften oder gar sechsten Generation erhältlich. Dabei wurden die Programme nicht nur im Funktionsumfang erweitert, sondern auch unter der Oberfläche deutlich verbessert. Somit produzieren WYSIWYG-Editoren nun generell ein Resultat, das im Browser so ausschaut, wie es im Editor geplant wurde.





Layout fürs Web

Nicht selten werden WYSIWYG-Editoren als Layoutprogramme fürs Web bezeichnet. Auf den Arbeitsflächen der Programme befinden sich denn auch eine Reihe ähnlicher Tools, angefangen von der Textformatierung über Tabellentools bis hin zum Formulargenerator. Neben diesen grundlegenden Formatierungsfunktionen bieten die meisten Programme auch die Möglichkeit, Multimedia in die Webpages einzubinden.



Sobald ein Projekt über mehrere Einzelseiten verfügt, werden Funktionen zur Betreuung ganzer Sites benötigt. So kann man in mehreren Programmen einen Site-Manager finden, in welchem man die Struktur einer ganzen Site grafisch darstellen und verändern kann. Aber auch Funktionen wie das Heraufladen oder Synchronisieren einer Site auf dem Server gehören in diese Kategorie.





Adobe GoLive 5

GoLive ist ein Produkt, das Adobe 1999 von CyberStudio gekauft hat und seither weiterentwickelte. Das GUI von GoLive entspricht daher nicht ganz denjenigen der anderen Adobe-Produkte, hat sich aber seit der letzten Version etwas dem Look-and-Feel von Adobe genähert.



Die eigentliche Arbeitsfläche ist in eine Reihe Paletten aufgeteilt, auf denen Layout, Frames, Quellcode und eine Vorschau dargestellt werden. Besonders erwähnenswert ist der HTML-Strukturbaum, bei welchem strukturierte Codeblöcke zum Redigieren ausgeklappt werden können. Dank dieser Funktion fällt es einem leicht, sich auf das Wesentliche zu konzentrieren.




Da eine Seite also prinzipiell auf drei verschiedene Arten redigiert werden kann (Layout, Quellcode und HTML-Strukturbaum), ist eine gewiefte Funktionsweise erforderlich, damit die Seiten konsistent bleiben. In GoLive ist dieses Problem mit der Funktion 360 Code gelöst. Diese interne Funktion sorgt ausserdem dafür, dass externe Codestücke von der Arbeit im Designmodul unberührt bleiben. Designer können somit nach Herzenslust Oberflächen entwerfen und ändern, während Webprogrammierer ihren Code schreiben, ohne dass sie sich gegenseitig in die Quere kommen. Um die Zusammenarbeit zwischen verschiedenen Entwicklern zu erleichtern, unterstützt GoLive WebDAV.



Zu den übrigen neuen Funktionen in dieser Version gehören unter anderem auch Dynamic Link for ASP zur Anbindung von ODBC-Datenbanken, ein integrierter Zeitlinieneditor für QuickTime-Filme und Flash-Dateien sowie Unterstützung von CSS, WebObjects und Scalable Vector Graphics (SVG).



Zur Administration ganzer Sites stellt GoLive ebenfalls eine Fülle von Funktionen zur Verfügung. Einerseits können auf Wunsch beispielsweise tote Links fortlaufend hervorgehoben oder in einem Rapport aufgelistet werden, andererseits ist GoLive in der Lage, beinahe alle erdenklichen Informationen über eine Site aufzulisten.




Macromedia Dreamweaver 4

Der seit jeher beliebte Dreamweaver von Macromedia hat mit Version 4 noch einmal einen Zahn zugelegt. Insbesondere sind die Möglichkeiten für die Codebearbeitung von Hand verbessert worden. Die Verbesserungen umfassen beispielsweise einen integrierten Texteditor, einen JavaScript-Debugger und eine Code-Referenz von O'Reilly. Trotz dieser neuen Features, die es dem User erlauben, sich spielend zwischen grafischem Gestalten und Sourcecode-Bearbeitung hin und her zu bewegen, ist die Vollversion von Allaires HomeSite nach wie vor im Lieferumfang von Dreamweaver mit dabei.



Während die Bildbearbeitung in Adobe GoLive nahtlos mit Photoshop integriert werden kann, besitzt Dreamweaver eine entsprechende Funktion für die sogenannte Roundtrip-Grafikbearbeitung mit Fireworks.




Auch für die Verwendung in Arbeitsgruppen kann Dreamweaver ein paar Neuigkeiten präsentieren. Zum einen wird ausser WebDAV auch SourceSafe unterstützt, zum anderen können den einzelnen Dateien in der Site-Definition Verantwortliche zugeordnet werden. Dank Integration mit einem beliebigen E-Mail-Client wird so die Zusammenarbeit auch in grösseren Webabteilungen wesentlich erleichtert.



Das Site-Management-Fenster verfügt über zwei Ansichten. Die Listenansicht wird einerseits zur Erstellung verschiedener Berichte, andererseits zum Publizieren der Sites verwendet. In der Sitemap-Ansicht werden die internen und externen Verknüpfungen zwischen den Seiten angezeigt.



Bezüglich des GUI hat sich wenig seit der vorgehenden Version geändert. Die vielen schwebenden Paletten mögen den Einsteiger zu Beginn vielleicht verwirren, aber nach einiger Zeit lernt man die durchdacht angeordneten Tools zu schätzen. Für Dreamweaver spricht auch eine hervorragende Dokumentation, die neben dem Manual auch Tutorials und einen Lehrgang umfasst.




Microsoft FrontPage 2002

FrontPage hatte lange einen schlechten Ruf unter den Webdesignern, aber bereits FrontPage 2000 konnte älteren Versionen gegenüber gewaltige Fortschritte verzeichnen. FrontPage 2002, nun in Microsoft Office XP integriert, ist weiter verbessert und erweitert worden.



Eine der umfassendsten Neuerungen sind die SharePoint Team Services, eine Servererweiterung, mit welcher Arbeitsgruppen auf einfache Weise im Web zusammenarbeiten können. Die herkömmliche FrontPage-Servererweiterung tritt folglich etwas in den Hintergrund, ist aber für FrontPage 2002 im Web erhältlich. Während die FrontPage-Servererweiterung 2002 noch auf Windows NT 4.0 installiert werden kann, erfordern die SharePoint Team Services zwingend Windows-2000-Server.




Websites, die unter SharePoint Team Services errichtet werden, bieten dafür eine Reihe von Intranetfunktionen wie beispielsweise Diskussionsforen und Dokumentbibliotheken. Ebenfalls können SharePoint-Team-Websites direkt im Webbrowser redigiert werden.



Neu sind auch Webkomponenten zur Errichtung unter anderem von Fotogalerien, Statistiklisten und dynamischen Inhalten wie etwa News und Stock Tickers.



Das GUI von FrontPage ist im Vergleich zu den Oberflächen der anderen Programme eher schlicht. Was anfangs aber langweilig aussieht, entpuppt sich während der Arbeit als effizient eingerichtet. Die grosse Arbeitsfläche wird optimal für das Gestalten von Seiten und Projekten ausgenutzt und nicht durch unzählige Werkzeugpaletten versperrt. In der Bedienungsweise ist FrontPage generell ziemlich gut auf die übrigen Office-Programme abgestimmt. Die Textformatierungsleiste entspricht derjenigen in Word, mit dem Formatpinsel können Formatierungseigenschaften auf andere Textstellen übertragen werden und so weiter.



Auch FrontPage unterstützt unterdessen das Redigieren des HTML-Codes. Erfreulich dabei ist, dass die meisten Tags in einem Dialogfenster bearbeitet werden können.



Schade dagegen ist, dass Autofiguren und WordArt, die übrigens in VML realisiert werden, nicht ohne weiteres miteinander kombiniert werden können.



Generell fehlt dem Programm etwas Flexibilität bei der Anordnung von Objekten, die sich nur mit Hilfe von im voraus definierten Tabellen und Layers genau plazieren lassen.



Wenn man aber bedenkt, dass FrontPage dafür dem durchschnittlich routinierten Office-User die Gestaltung von umfassenden Sites mit stringentem Code ermöglicht, fallen diese Nachteile nicht besonders ins Gewicht.




Namo WebEditor 4

Der aus Korea stammende Webeditor ist im Vergleich zu den anderen Produkten eher bescheiden ausgestattet. Dafür sind die bereitgestellten Funktionen und unterstützten Features zum grossen Teil durchdacht und einfach einzusetzen.



Namo WebEditor scheint nach dem KISS-Prinzip aufgebaut zu sein (Keep It Simple, Stupid). Dies ermöglicht einen schnellen Einstieg in die Homepage-Produktion, wie sie sonst nur mit FrontPage möglich ist. Überhaupt ähnelt die Bedienung vieler Funktionen in Namo WebEditor derjenigen in Microsofts Editor.




Die Einfachheit hat aber auch ihren Preis. Das Einfügen von JavaScripts und DHTML-Effekten beispielsweise geht mit Hilfe der vorhandenen Wizards spielend einfach. Leider ist es aber nicht möglich, einmal eingefügte Scripts zu redigieren. Falls man später eine Änderung vornehmen und die Scripts nicht von Hand anpassen will, müssen diese entfernt und danach von Grund auf wieder neu eingefügt werden.



Der Seiten-Manager von Namo WebEditor wird als separates Fenster geöffnet und bietet nun auch die Möglichkeit, Navigationsbäume anzuzeigen. Ausserdem umfasst der Seiten-Manager übersichtliche Dateilisten für das aktuelle Projekt, ein Registerblatt zur Anzeige von Links und einen eingebauten FTP-Client zum Publizieren der Projekte.



Erstaunlich ist, dass Namo WebEditor zur Anbindung an Datenbanken neben ASP und dem Windows-basierten ODBC-Standard auch PHP und MySQL unterstützt. Allerdings erscheint der entsprechende Wizard noch ein wenig fehlerhaft, so dass ein Datenbankaufruf gegebenenfalls manuell angepasst werden muss.



Unter den übrigen Neuigkeiten ist die Importmöglichkeit für Tabellenkalkulationen aus Excel, wobei die Daten auf Wunsch mit der Originaltabelle verknüpft werden können.



Erwähnenswert ist auch die erweiterte Anzahl von Layoutvorlagen und Themen. Während die über 50 Layoutvorlagen durchaus brauchbar sind, vermögen die Farbthemen nicht ganz zu überzeugen.




NetObjects Fusion MX

NetObjects Fusion ist in der jüngsten Version um eine Reihe Online-Services erweitert worden. So stellt NetObjects in Zusammenarbeit mit unter anderen MyComputer.com Dienste wie Statistik, Promotion und Werbung sowie verschiedene interaktive Elemente zur Verfügung.



Die Auslagerung solcher Funktionen zu externen Service-Providern hat somit auch zur Folge, dass die Funktionspalette von NetObjects Fusion gegenüber früheren Versionen nun etwas stromlinienförmiger ist. Wer selber dynamische und interaktive Elemente für seine Homepage gestalten will, sollte daher NetObjects ScriptBuilder als Ergänzung in Betracht ziehen oder auf ein anderes Programm ausweichen.




NetObjects Fusions Stärken liegen dagegen in der Planung und Administration ganzer Sites. Anders als bei den konkurrierenden Produkten wird in NetObjects Fusion generell zuerst ein Navigationsbaum mit Platzhaltern für die geplanten Seiten erstellt. Auch wenn nachträglich neue Seiten dazukommen oder bestehende verschoben werden sollen, kann dies mit einfachem Drag-and-Drop im Site-Modus erledigt werden.



Während der Erstellung von Seiten und Sites lagert NetObjects Fusion sämtliche Informationen in einer integrierten Datenbank. Erst wenn das Projekt publiziert werden soll, werden diese Informationen in HTML-Code umgewandelt. Dieses Vorgehen verunmöglicht das Redigieren des Codes von Hand. Hingegen können in der HTML-Source-Ansicht beliebige Codestücke zwischen NetObjects-Fusion-Elemente eingefügt werden.



Ebenfalls einzigartig für NetObjects Fusion ist der Umgang mit Themen. Ausgehend von acht Themen in jeweils verschiedenen Farbvarianten kann der User selber Themen erstellen. So ist es möglich, dass auch kleinere Unternehmen ohne eigenen Webgrafiker leicht eine individuelle Site erstellen können. Und gerade auf dieses Segment ist NetObjects Fusion auch ausgerichtet.




Fazit

Bei den fünf getesteten WYSIWYG-Editoren handelt es sich um sehr unterschiedliche Produkte in verschiedenen Preisklassen. Daher soll unsere Wertung nur richtungsweisend verstanden werden - die Entscheidung für eine bestimmte Software hängt in erster Linie vom eigenen Bedarf ab.



Trotz der Unterschiede liegen die fünf Produkte in der Bewertung recht nahe aneinander, was insbesondere daran liegt, dass wir das Preis/Leistungsverhältnis in die Bewertung miteinbezogen haben.




Wer einen einfachen grafischen HTML-Editor zu einem günstigen Preis sucht, wird mit Namo WebEditor sicher nicht schlecht beraten sein. Der koreanische Newcomer umfasst die wichtigsten Funktionen und bietet darüber hinaus als einziges Programm die Möglichkeit, MySQL-Datenbankaufrufe mit der Scriptsprache PHP zu realisieren.



Für professionelle Webdesigner sind Macromedia Dreamweaver und Adobe GoLive nach wie vor die naheliegendsten Lösungen. Beide Programme produzieren eleganten HTML-Code und bieten eine riesigeFülle von Funktionen.



Microsoft FrontPage kann vor allem dann empfohlen werden, wenn man von vornherein auf die diversen Kollaborationstechnologien von Microsoft setzt. Obwohl FrontPage nun auch recht guten Code produziert, ist das Programm, wenn man einmal von Microsoft-spezifischen Funktionen absieht, aber doch eher etwas farblos.



NetObjects Fusion ist auch in der MX-Version eine Klasse für sich - sowohl im Guten als auch im Schlechten. Zwar ist NetObjects Fusion das einzige Programm, bei dem der produzierte Code nicht manuell bearbeitet werden kann, dafür bietet Fusion beinahe unübertroffene Site-Management-Funktionen. Ob die Verschmelzung von PC-Software und Online-Diensten eine gute Strategie ist, muss der User jedoch für sich selbst entscheiden.



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

Anti-Spam-Frage: Vor wem mussten die sieben Geisslein aufpassen?
GOLD SPONSOREN
SPONSOREN & PARTNER