WYSIHTML5 – der schnellere WYSIWYG Editor

Was zur Zeit an WYSIWYG-Editoren für das Web unterwegs ist, ist der totale Overkill. Meistens wird ja TinyMCE oder der FCKEditor genommen, die beide nicht unbedingt durch ihren kleinen Skripte und ihre Durchschaubarkeit von sich reden machen. Ich zähle inzwischen beide zu den Monstern aus der grauen Vorzeit, die man nicht wirklich noch verwenden sollte. Beide Editoren machen eine ganze Menge Zeug das man nicht braucht, und es dauert elend lange bis sie überhaupt geladen sind.

Screenshot von WYSIHTML5

Auch in meiner Twitter Timeline werden inzwischen die Rufe nach Alternativen lauter, und ich hab ja auch schon das eine oder andere Skript vorgestellt. Angenehm aus der Menge sticht allerdings der WYSIHTML5 heraus, denn er ist rattenschnell, wie man dieser Demo entnehmen kann. Er wurde erstellt von Xing (Jehova!) und wird auch von Basecamp und Qype verwendet. Das er so schnell geladen wird liegt prinzipiell daran, das er in einer einzigen Datei daher kommt, und kein jQuery verwendet. In einer zweiten Datei werden sogenannte Parser Rules definiert, der Editor also mehr oder weniger definiert.

Wie üblich wird das Skript auf eine Textarea angewendet, und die Buttons über Attribute gesteuert, der Getting Started Guide gibt hier einen guten Eindruck. Man sollte sich den Editor auf jeden Fall einmal ansehen und eventuell sogar im nächsten Projekt einsetzen, denn etwas schnelleres habe ich bisher noch nicht gefunden.

 

Ähnliche Beiträge

Sicherheitskopie im HTML5 Local Storage Unabhängig von dem was man über WordPress denkt ist eine Funktion ziemlich genial: das regelmäßige automatische Speichern beim Anlegen eines Artikels....
Hakim El Hattabs HTML5 Experimente HTML5 entwickelt sich zu einem Konstrukt, das für Webworker primär aus einem besteht: Einem Konstrukt der über mehr Browserweichen verfügt, als es für...
CLEditor – WYSIWYG-Editor als jQuery-Plugin Normalerweise hat man heutzutage in so ziemlich jedem Webprojekt zwei Dinge: eine Javascript-Library (jQuery oder Mootools) und einen WYSIWYG-Editor u...
InstaCSS – die Referenz in Sachen CSS3 / HTM... Ich ergehe mich ja nicht oft in Superlativen, aber in Sachen CSS3 / HTML5 Dokumentation besteht mancherorts echt Nachholbedarf. Man bewegt sich dort i...

10 Antworten auf „WYSIHTML5 – der schnellere WYSIWYG Editor“

  1. Mit CKEditor und TinyMCE können Anwender viel, viel Unfug treiben, wenn man die Menüs in den Editoren nicht drastisch aufs Allernötigste reduziert. Aber dann kann man ja gleich einen schlankeren WYSIWYG-Editor einsetzen.

    Ich finde den WYMeditor ganz gut (http://www.wymeditor.org/), habe aber auch noch ein paar andere getestet. Leider lassen sich in so manchem CMS die Editoren nicht ohne erheblichen Aufwand oder zumindest ohne Lesen ellenlanger Anleitungen austauschen. Bisher fand ich da nur Drupal vorbildlich.

    Nun bin ich aber auf den hier vorgestellten Editor neugierig geworden. Lade ich gleich mal runter! Getestet wird dann irgendwann in der Freizeit, die es quasi nie gibt …
    :-(

  2. Hallo Vlad & Reinhard,

    es gibt mittlerweile bereits die option „useLineBreaks“ die auf false gesetzt werden kann.
    Man muss dazu lediglich den aktuellen master des GitHub Repositories kompilieren oder noch ein paar Tage warten bis ich Version 0.4 fertig hab. Danke für das Feedback :)

  3. Das aus TinyMCE was sinnvolles heraus kommt verdankt es prinzipiell der Tatsache, das es einen HTML Optimizer besitzt, der alles kaputt macht ;) Man muss sich an der Stelle schon irgendwo entscheiden zwischen Geschwindigkeit und Qualität, und wenn man mal ehrlich ist, reicht ein einfacher Editor für 90% der Anwendungsfälle. WordPress selbst hat ja ein Großteil der Funktionalität von TinyMCE weggeblendet, ist also dort auch totaler Overkill. Mir steht es an der Stelle ja frei das resultierende HTML noch einmal durch einen Beautifier oder durch Lint laufen zu lassen, wenn ich meine ich wills schöner haben, und es darf was länger dauern ;)

  4. @Reinhard,

    das p vs. doppel-br würde ich nicht auf die leichte Schulter nehmen. Speziell wenn die Website für die Absätze und Zeilenumbrüche unterschiedliche CSS-Angaben parat hat (Zeilenhöhe, Abstände, Schriftgröße etc.)

  5. Das ist mir auch aufgefallen und ist schon klar dass dies semantisch nicht so schön ist.

    Aber es macht die Texteingabe für unbedarfte Nutzer einfacher. Die nach meiner Erfahrung oft nicht zwischen Absätzen und Zeilenumbrüche unterscheiden können oder wollen.

  6. Hi Guido,

    ich habe mir mal den Code-Ausgabe bzw. das HTML des Editor angeschaut und das ist nicht das was ich mir unter guten Code vorstelle:

    <b>Test</b><br><br><h1>Noch mehr test</h1><br><ol><li>Und wo ist der Absatz?</li></ol>

    Alles in eine Zeile und doppel-br anstatt p … ich weiß nicht.

  7. Ich habe WYSIHTML5 bei meinem aktuellen Projekt eingesetzt und bin durchaus zufrieden damit. Gerade die reduzierte Funktionalität gefällt mir sehr gut.
    Nur auf den Einsatz von ausgerichtetem Text (rechtsbündig, …) habe ich einstweilen verzichtet, da dies auf Grund der fehlenden Absatzkontrolle nicht wirklich zufriedenstellend funktioniert hat.
    Aber super dass sich endlich was Neues aufgetan hat!

  8. Danke fürs Vorstellen, kommt wirklich angenehm schnell. Im HTML-Modus fällt das Lesen ein wenig schwer, weil der Quelltext ohne Umbrüche generiert wird – was natürlich andererseits für kompakte Seitengrößen sorgt. Jetzt würde ich mir den Editor nur noch als Plugin für WordPress wünschen! :)

Schreibe einen Kommentar

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