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

Rollenspiele in HTML5 Was waren das noch Zeiten als isometrische Grafiken das neue Ding waren. Während man sich mit Telnet durch MUDs gekämpft hatte, und das erste Ultima a...
Blog für HTML5 Game Development HTML5 Game Development (Spielprogrammierung) ist das nächste große Ding, da führt gar kein Weg dran vorbei! Dummerweise kocht da grad jeder sein eigen...
HTML5 Cheat Sheets Ok, es sind nur zwei, aber mehr braucht man auch (erstmal) nicht ;) HTML5 bietet viele neue Möglichkeiten, die nicht nur Videos und Audio betreffen, s...
Automatoon – HTML5 Animationen Deluxe Bei meinem ersten Besuch auf Automatoon gab es ein ziemliches auf und ab, angefangen bei "Das kann ja jeder" über "Wie haben sie das bloss gemacht" bi...

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.