Auf der Suche nach dem perfekten WYSIWYG-Editor

WYSIWYG-Editoren

Es ist mal wieder soweit, dass wir für ein konkretes Projekt einen WYSIWYG-Editor auswählen müssen. Mir persönlich sind diese Editoren eigentlich ein Graus, da der erzeugte HTML-Code meist sehr zu wünschen übrig lässt.

Der konkrete Anwendungsfall ist ein Newsletter-System, das es erlaubt mit Templates zu arbeiten – auch HTML-Templates.

Nach Sichtung mehrerer Editoren habe ich folgende Anforderungen festgelegt, die nicht nur die funktionelle Seite sondern auch die ergonomische Seite betreffen:

  • Open Source
  • Umschalten auf Quellcode und zurück zum HTML-Code ohne nervige PopUps (also integriert über Layer etc.)
  • Zufriedenstellende Ladezeit
  • Multilanguage
  • Gute Integrationsmöglichkeiten in PHP-Framework “CodeIgniter”
  • Konfigierbare Templates/NonEditableContent
  • Gutes Look & Feel
  • Gutes Image-Handling inkl. Upload

Es gibt ungefähr eine Million WYSIWYG-Projekte unter denen wir eine Vorauswahl treffen mussten. Diese Vorauswahl beinhaltet nun folgende Editoren, auf die ich noch ein wenig näher eingehe:

  1. openwysiwyg (www.openwebware.com)
  2. tinymce (tinymce.moxiecode.com)
  3. WYMeditor (www.wymeditor.org)
  4. SPAW Editor (www.solmetra.com)
  5. Xinha (xinha.webfactional.com)
  6. NicEdit (www.nicedit.com)
  7. FCKeditor (www.fckeditor.net)
  8. [Edit 30.08.2010] elRTE (elrte.org)
  9. [Edit 26.05.2017] Ori (editor.ory.am)

Und los gehts.

1. openwysiwyg

Der Editor fällt durch seine schnelle Ladezeit auf.  Das Umschalten von Source auf Visuell geschieht im gleichen Fenster und stört daher nicht.  Von der Feature-Vielfalt her liegt er eher im hinteren Drittel und auch die oben erwähnten Features wie Templating oder Upload habe ich nicht gefunden.
Vom Look&Feel her “liegt dieser Editor gut in der Hand”, fällt jedoch durch die von mir geforderten Features aus.

2. tinymce

Dieser Editor ist mit dem FCKeditor der meiner Meinung nach Feature-Reichste Editor im Feld. Dies ist aber nur ein vermeintlicher Vorteil bei meiner Beurteilung, da die Ladezeiten darunter leiden (wie auch beim FCKeditor). Was ich suche ist ein schneller, leicht einzubindender und konfigurierbarer Editor.
Das Öffnen des Quellcodes geschieht beim tinymce nicht in einem extra Fenster, sondern in einem extra Layer, was es für mich etwas angehmer macht. Ich kann mir nicht helfen, aber mich stören neue Fenster eben. Überhaupt hat der tinymce einige “CSS-Features” mit denen man Layer mit der Maus positionieren kann und sich so das ganze Layout zusammenklicken kann.

Leider muss für einen Image Manager, der das Handling der Bilder übernimmt extra bezahlt werden. Bitte nicht falsch verstehen, der zugegebenermaßen sehr gute MCImageManager ist sein Geld wert, fällt jedoch aus schon erwähnten Gründen aus meiner Auswahl.

Im Grossen und Ganzen macht tinymce einen sehr professionellen Eindruck und scheint auch eine sehr aktive Entwicklergemeinde zu vereinen. Sehr positiv ist mir das Feature “noneditable content” aufgefallen, was für meine jetzigen Belange perfekt wäre. Auch das “load on demand” Feature, also dass der Editor praktisch bei Bedarf nachgeladen werden kann ist nicht schlecht.

Diesen Editor benutze ich übrigens auch gerade.

3. WYMeditor

“What you see is what you mean” sagt eigentlich alles aus, was über diesen Editor gesagt werden muss. Dieser Editor lädt extrem schnell und macht einen sehr stabilen Eindruck ohne Firlefanz. Der eingegebene Text und seine Formatierungen werden visuell abgesetzt, was den “Otto-Normal”-Benutzer sicher stören würde, jedoch für denjenigen, der auf die Qualität des erzeugten HTML-Codes wert legt wunderbar ist.

Um es kurz zu machen: Dieser Editor ist mir sehr sympatisch, fällt jedoch hier durch, weil meine Anforderungen andere sind. Hätte ich andere Anforderungen wäre dieser Editor im oberen Drittel.

4. SPAW Editor

Die Ladezeiten dieses Editors sind akzeptabel wenngleich natürlich nicht so kurz wie vom WYMeditor.  Es gibt aber hier einige Features die diesen Editor zu einer guten Wahl machen. Eine davon ist sicher der gute Filemanager, der komplett ist und auch die Uploads von Bildern meistert. Das umschalten zwischen Quellcode und Design ist sehr intuitiv mit Tabs geregelt.  Der Vorteil von dem Feature mehrere WYSIWYG-Fenster per Tabs in einem Feld zu befüllen zu können ist mir noch nicht ganz klar, aber ich denke die Jungs von Solmetra haben sich da schon was bei gedacht.
Die (serverbasierte) Integration in CodeIgniter ist auch vorhanden.

5. Xinha

Xinha macht für mein Empfinden auch einen guten Eindruck unter den hier vorgestellten Editoren. Er vereint Konfigurierbarkeit mit Feature-Vielfalt bei zufriedenstellender Ladezeit. Der Image Manager hat alles was ich brauche inklusive einer Upload Möglichkeit. Es können Templates integriert werden, die Sprache des Editors kann einfach angepasst und auch gewechselt werden und auch das Umschalten auf Quellcode verläuft “leise” und nicht mit Gedonner und neuem Fenster.
Die (serverbasierte) Integration in CodeIgniter müsste noch erzeugt werden.

6. NicEdit

NicEdit ist mit einer der jüngsten Entwicklungen unter den WYSIWIG-Editoren und eigentlich auch beeindruckend. Der Editor hat für meine Begriffe ein gutes Look&Feel, hält den Benutzer nicht lang mit grossen Dialogen beim Upload oder Einfügen eines Bildes auf und kommt schnell zum Punkt. Leider fehlen mir einige Features, wie Templates oder Mehrsprachigkeit.

Sehr beeindruckend für mich ist, dass der Entwickler das ganze in ein einziges Javascript-File packt und somit sehr “leichtgewichtig” und portabel daherkommt. Das Panel des Editors besteht ebenso aus einem einzigen Bild, das alle Icons enthält und daher auch bei den Ladezeiten Punkten kann.

7. FCKeditor

Zuletzt komme ich zum “Flak-Schiff” der WYSIWYG-Editoren, dem FCKeditor. Wie schon erwähnt bekommt man hier alles geboten was das Herz begehrt. Er kann Templates (Vorlagen), ist mehrsprachig, hat einen sehr guten Image Manager, ist in CodeIgniter integriert hat eine riesige Entwicklergemeinde etc.
Das einzige was ich bemängeln könnte, wäre die Ladezeit, die aufgrund der Features eher im Mittelfeld liegt.

8. elRTE

Ein neuer Kandidat ist dazu gekommen und zwar elRTE. Dieser Editor basiert auf dem Javascript Framework jQuery (jQuery UI).
Vom Look and Feel ähnelt er dem tinyMCE und hält auch bei der Funktionsvielfalt mit. Was mir sehr gefällt ist der “Aufsatz” elFinder file manager, der in den Editor eingebunden werden kann. Die Krönung hier ist, dass bei einigen Editoren das Bilder-Management unter eine kostenpflichtige Lizenz gestellt wird – anders beim elRTE – hier ist der elFinder ebenso unter der BSD-Lizenz zu benutzen.

Mein Resümee

Für mein jetziges Einsatzgebiet werde ich wohl den FCKeditor einsetzen, da ich viele Features die ich benötige bei den anderen Editoren vermisse oder diese dürftig integriert sind.

Es ist leider immerwieder so, dass das Einsatzgebiet entscheidet und man wie meistens auf die Eierlegende Wollmilchsau vergeblich Ausschau hält. Wozu auch, das geeignete Werkzeug für ein bestimmtes Einsatzgebiet. Speziell bei den WYSIWYG-Editoren sollte man je nach Anwender sogar mehrere Implementationen bereithalten, da jeder Editor seine Stärken in bestimmten Bereichen hat.

Vielleicht hat der ein oder andere von Euch noch einen andere Favoriten oder Hinweis, den ich gerne verfolge. Ich bin nämlich immernoch auf der Suche nach dem perfekten WYSIWYG-Editor.

[Edit 30.08.2010] Der elRTE ist hier sicherlich eine Überlegung wert, jedenfalls für  mich, da ich sowieso jQuery einsetze und dies somit mit diesem Editor perfekt ergänzen könnte ohne wieder eine andere Code-Basis benutzen zu müssen.

WYSIWYG-Editoren

Es ist mal wieder soweit, dass wir für ein konkretes Projekt einen WYSIWYG-Editor auswählen müssen. Mir persönlich sind diese Editoren eigentlich ein Graus, da der erzeugte HTML-Code meist sehr zu wünschen übrig lässt.

Der konkrete Anwendungsfall ist ein Newsletter-System, das es erlaubt mit Templates zu arbeiten – auch HTML-Templates.

Nach Sichtung mehrerer Editoren habe ich folgende Anforderungen festgelegt, die nicht nur die funktionelle Seite sondern auch die ergonomische Seite betreffen:

  • Open Source
  • Umschalten auf Quellcode und zurück zum HTML-Code ohne nervige PopUps (also integriert über Layer etc.)
  • Zufriedenstellende Ladezeit
  • Multilanguage
  • Gute Integrationsmöglichkeiten in PHP-Framework “CodeIgniter”
  • Konfigierbare Templates/NonEditableContent
  • Gutes Look & Feel
  • Gutes Image-Handling inkl. Upload

Es gibt ungefähr eine Million WYSIWYG-Projekte unter denen wir eine Vorauswahl treffen mussten. Diese Vorauswahl beinhaltet nun folgende Editoren, auf die ich noch ein wenig näher eingehe:

  1. openwysiwyg (www.openwebware.com)
  2. tinymce (tinymce.moxiecode.com)
  3. WYMeditor (www.wymeditor.org)
  4. SPAW Editor (www.solmetra.com)
  5. Xinha (xinha.webfactional.com)
  6. NicEdit (www.nicedit.com)
  7. FCKeditor (www.fckeditor.net)

Und los gehts.

1. openwysiwyg

Der Editor fällt durch seine schnelle Ladezeit auf.  Das Umschalten von Source auf Visuell geschieht im gleichen Fenster und stört daher nicht.  Von der Feature-Vielfalt her liegt er eher im hinteren Drittel und auch die oben erwähnten Features wie Templating oder Upload habe ich nicht gefunden.
Vom Look&Feel her “liegt dieser Editor gut in der Hand”, fällt jedoch durch die von mir geforderten Features aus.

2. tinymce

Dieser Editor ist mit dem FCKeditor der meiner Meinung nach Feature-Reichste Editor im Feld. Dies ist aber nur ein vermeintlicher Vorteil bei meiner Beurteilung, da die Ladezeiten darunter leiden (wie auch beim FCKeditor). Was ich suche ist ein schneller, leicht einzubindender und konfigurierbarer Editor.
Das Öffnen des Quellcodes geschieht beim tinymce nicht in einem extra Fenster, sondern in einem extra Layer, was es für mich etwas angehmer macht. Ich kann mir nicht helfen, aber mich stören neue Fenster eben. Überhaupt hat der tinymce einige “CSS-Features” mit denen man Layer mit der Maus positionieren kann und sich so das ganze Layout zusammenklicken kann.

Leider muss für einen Image Manager, der das Handling der Bilder übernimmt extra bezahlt werden. Bitte nicht falsch verstehen, der zugegebenermaßen sehr gute MCImageManager ist sein Geld wert, fällt jedoch aus schon erwähnten Gründen aus meiner Auswahl.

Im Grossen und Ganzen macht tinymce einen sehr professionellen Eindruck und scheint auch eine sehr aktive Entwicklergemeinde zu vereinen. Sehr positiv ist mir das Feature “noneditable content” aufgefallen, was für meine jetzigen Belange perfekt wäre. Auch das “load on demand” Feature, also dass der Editor praktisch bei Bedarf nachgeladen werden kann ist nicht schlecht.

Diesen Editor benutze ich übrigens auch gerade.

3. WYMeditor

“What you see is what you mean” sagt eigentlich alles aus, was über diesen Editor gesagt werden muss. Dieser Editor lädt extrem schnell und macht einen sehr stabilen Eindruck ohne Firlefanz. Der eingegebene Text und seine Formatierungen werden visuell abgesetzt, was den “Otto-Normal”-Benutzer sicher stören würde, jedoch für denjenigen, der auf die Qualität des erzeugten HTML-Codes wert legt wunderbar ist.

Um es kurz zu machen: Dieser Editor ist mir sehr sympatisch, fällt jedoch hier durch, weil meine Anforderungen andere sind. Hätte ich andere Anforderungen wäre dieser Editor im oberen Drittel.

4. SPAW Editor

Die Ladezeiten dieses Editors sind akzeptabel wenngleich natürlich nicht so kurz wie vom WYMeditor.  Es gibt aber hier einige Features die diesen Editor zu einer guten Wahl machen. Eine davon ist sicher der gute Filemanager, der komplett ist und auch die Uploads von Bildern meistert. Das umschalten zwischen Quellcode und Design ist sehr intuitiv mit Tabs geregelt.  Der Vorteil von dem Feature mehrere WYSIWYG-Fenster per Tabs in einem Feld zu befüllen zu können ist mir noch nicht ganz klar, aber ich denke die Jungs von Solmetra haben sich da schon was bei gedacht.
Die (serverbasierte) Integration in CodeIgniter ist auch vorhanden.

5. Xinha

Xinha macht für mein Empfinden auch einen guten Eindruck unter den hier vorgestellten Editoren. Er vereint Konfigurierbarkeit mit Feature-Vielfalt bei zufriedenstellender Ladezeit. Der Image Manager hat alles was ich brauche inklusive einer Upload Möglichkeit. Es können Templates integriert werden, die Sprache des Editors kann einfach angepasst und auch gewechselt werden und auch das Umschalten auf Quellcode verläuft “leise” und nicht mit Gedonner und neuem Fenster.
Die (serverbasierte) Integration in CodeIgniter müsste noch erzeugt werden.

6. NicEdit

NicEdit ist mit einer der jüngsten Entwicklungen unter den WYSIWIG-Editoren und eigentlich auch beeindruckend. Der Editor hat für meine Begriffe ein gutes Look&Feel, hält den Benutzer nicht lang mit grossen Dialogen beim Upload oder Einfügen eines Bildes auf und kommt schnell zum Punkt. Leider fehlen mir einige Features, wie Templates oder Mehrsprachigkeit.

Sehr beeindruckend für mich ist, dass der Entwickler das ganze in ein einziges Javascript-File packt und somit sehr “leichtgewichtig” und portabel daherkommt. Das Panel des Editors besteht ebenso aus einem einzigen Bild, das alle Icons enthält und daher auch bei den Ladezeiten Punkten kann.

7. FCKeditor

Zuletzt komme ich zum “Flak-Schiff” der WYSIWYG-Editoren, dem FCKeditor. Wie schon erwähnt bekommt man hier alles geboten was das Herz begehrt. Er kann Templates (Vorlagen), ist mehrsprachig, hat einen sehr guten Image Manager, ist in CodeIgniter integriert hat eine riesige Entwicklergemeinde etc.
Das einzige was ich bemängeln könnte, wäre die Ladezeit, die aufgrund der Features eher im Mittelfeld liegt.

Mein Resümee

Für mein jetziges Einsatzgebiet werde ich wohl den FCKeditor einsetzen, da ich viele Features die ich benötige bei den anderen Editoren vermisse oder diese dürftig integriert sind.

Es ist leider immerwieder so, dass das Einsatzgebiet entscheidet und man wie meistens auf die Eierlegende Wollmilchsau vergeblich Ausschau hält. Wozu auch, das geeignete Werkzeug für ein bestimmtes Einsatzgebiet. Speziell bei den WYSIWYG-Editoren sollte man je nach Anwender sogar mehrere Implementationen bereithalten, da jeder Editor seine Stärken in bestimmten Bereichen hat.

Vielleicht hat der ein oder andere von Euch noch einen andere Favoriten oder Hinweis, den ich gerne verfolge. Ich bin nämlich immernoch auf der Suche nach dem perfekten WYSIWYG-Editor.

2 Kommentare bei „Auf der Suche nach dem perfekten WYSIWYG-Editor

  1. hat jemand eine lsöung für das Problem, daß der FCK Editor bei Hosting bei 1 & 1 bei der Bearbeitung von Bilder die Schaltfläche Server durchsuchen nicht anzeigt ?

    danke.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.