Mit den 7 besten WYSIWYG-Editor-Tools hast du bei der Website-Gestaltung alles im Blick

Wir erklären dir, was es mit dem WYSIWYG-Prinzip auf sich hat und wie du auch ohne Programmier-Kenntnisse eine schöne Website erstellst

Inhalt
  1. Was ist WYSIWYG?
  2. Welche sind die 7 besten WYSIWYG-Editors? 
  3. 1. Froala als WYSIWYG-Editor-Tool
  4. 2. HubSpot CMS Hub als WYSIWYG-Editor-Software
  5. 3. Adobe Dreamweaver als WYSIWYG-Editor-Programm
  6. 4. Brackets als WYSIWYG-Editor-Tool
  7. 5. CoffeeCup HTML Editor als WYSIWYG-Editor-Software
  8. 6. Wix als WYSIWYG-Editor-Programm
  9. 7. CKEditor als WYSIWYG-Editor-Tool
  10. Fazit: Mit dem „What you see is what you get”-Prinzip kannst du schnell und einfach Websites und Web-Inhalte erstellen

Fast alle Unternehmen haben eine Website. Die Erstellung von Web-Inhalten verläuft meistens über einen Quellcode. Dieser wird über eine Programmier-Sprache eingegeben. Aber nicht alle Unternehmer*innen beherrschen HTML, JavaScript, Python, PHP und Co. Wie also kommen Programmier-Anfänger*innen zu einer Unternehmens-Website? Die Antwort darauf lautet: What-you-see-is-what-you-get. Wir erklären dir, was es mit dieser Phrase auf sich hat und wie du auch ohne Programmier-Kenntnisse eine schöne Website erstellst.

Was ist WYSIWYG?

WYSIWYG steht für die englische Phrase „What-you-see-is-what-you-get“, welche die Idee hinter WYSIWYG-Softwares schon sehr detailliert beschreibt – was du siehst, ist was du bekommst. Dabei handelt es sich um eine Live-Darstellung. Anstatt also einen – für viele Unternehmer*innen – abstrakten Code einzugeben, der dann übersetzt deine Website ergibt, arbeitest du mit unterschiedlichen Bausteinen. Das Website-Ergebnis sieht dann exakt so aus, wie du es auch während der Bearbeitung siehst.

Der Unterschied zwischen WYSIWYG und der Verwendung einer Programmier-Sprache wird anhand des folgenden Beispiels deutlich: 

So sieht der Unterschied zwischen WYSIWYG (links) und Code aus.

Das Programm rechts arbeitet mit einer Programmier-Sprache. Sämtliche Formatierungen und Text-Eigenschaften werden mittels Quellcode festgehalten. Die Nutzer*innen sehen während dieses Prozesses nicht, wie das Endergebnis aussehen wird. 

Im Vergleich dazu arbeitet das Programm links mit WYSIWYG. Die Schriftart und -größe sowie das Layout des Textes können einfach per Klick im Menü ausgewählt und geändert werden. Die Nutzer*innen sehen während des gesamten Bearbeitungs-Prozesses bereits das fertige Ergebnis.

Welche sind die 7 besten WYSIWYG-Editors? 

Unsere Nutzer*innen haben WYSIWYG-Editor-Tools für dich auf die Probe gestellt, bewertet und die besten herausgefiltert. Auf OMR Reviews findest du die beliebtesten WYSIWYG-Editors im Vergleich. Folgende WYSIWYG-Tools haben bei den User*innen am besten abgeschnitten: 

Ein wichtiges Tool fehlt in unserem Ranking? Sag uns Bescheid, welches du gerne aufgenommen sehen würdest! Wir in der Redaktion schätzen dein Feedback sehr.

Achtung: Dieses Ranking beruht auf dem Stand vom 09. Februar 2024.

1. Froala als WYSIWYG-Editor-Tool

editor.jpg

Der in JavaScript geschriebene Froala-WYSIWYG-Editor ist einer der visuell beeindruckendsten Rich-Text-Editors in der Branche. Die WYSIWYG-Software ist bekannt für ihr sauberes und schnelles UI-Design. Der WYSIWYG-Editor besticht durch gemeinsame Bearbeitung in Echtzeit. Das WYSIWYG-Tool ist in Kombination mit unterschiedlichen Framework-Plugins erhältlich und bietet außerdem eine detaillierte Anleitung für alle Programmierer-Newbies. Programmier-Kenntnisse oder Erfahrungen in diesem Bereich sind für die Verwendung der Software also nicht erforderlich. Zusätzlich zeichnet sich der Froala-WYSIWYG-Editor durch seine Geschwindigkeit aus. Der Rich-Text-Editor lässt sich beispielsweise in weniger als 40 Millisekunden initialisieren.

Froala-Funktionen

  • Kollaborative Online-Bearbeitung in Echtzeit
  • Individuelle Anpassung des Rich-Text-Editors
  • Nahtlose Server-Integration
  • Mehr als 100 intuitive Funktionen
  • Leistungsstarke Framework-Plugins
  • Erhältlich in unterschiedlichen Sprachen

Froala-Preise

Froala Free

Die kostenlose Version des Froala-WYSIWYG-Editors ist ideal für alle, die sich unverbindlich überzeugen lassen wollen. Sie umfasst eine unlimitierte Anzahl an monatlichen Nutzer*innen sowie eine Self-Host-Option. Die kostenlose WYSIWYG-Software kann sowohl für eine Domain als auch ein Produkt verwendet werden. 

Froala kostenpflichtig nutzen

Die kostenpflichtigen Optionen des Froala-WYSIWYG-Editors bieten dir je nach Paket unterschiedliche Möglichkeiten.

Die Professional-Variante liegt bei 899 $/Jahr und ist vor allem für die geschäftliche Verwendung, CMS und SaaS-Anwendungen geeignet. Sie verfügt über alle Features der Basic-Version. Zusätzlich ist sowohl die Anzahl an monatlichen Nutzer*innen als auch an bearbeitbaren Domains unlimitiert. Zudem kann der WYSIWYG-Editor auch für interne und mobile Apps verwendet werden. Bei Problemen kannst du jederzeit den Kunden-Support kontaktieren.

Die Froala-Enterprise-Version ist besonders für größere Unternehmen attraktiv und ab 1.999 $/Jahr zu haben. Sie verfügt über alle Features der Professional-Version sowie der Möglichkeit, den Editor auch bei Website-externen Produkten zu verwenden. Außerdem ist die Anzahl an bearbeitbaren internen Produkten unlimitiert.

Froala-Alternativen

Auf OMR Reviews findest du eine Übersicht aller Froala-Alternativen. So kannst du basierend auf den verifizierten Bewertungen und Erfahrungs-Berichten unserer Nutzer*innen das passende WYSIWYG-Editor-Tool für dich und dein Unternehmen auswählen.

2. HubSpot CMS Hub als WYSIWYG-Editor-Software

Das HubSpot CMS bietet dir eine Komplettlösung. Das WYSIWYG-Tool hält SEO-Empfehlungen, adaptive Tests, Code-Warnung, ein voll integriertes CRM-System und eine große Auswahl an Website-Designs sowie einen Drag-and-drop-Editor für dich bereit. HubSpot ContentHub ist vor allem für schnell wachsende Unternehmen geeignet, die Unterstützung im Content-Management benötigen. 

HubSpot CMS Hub-Funktionen

  • Content-Erstellung
  • Rich-Text-Editor
  • Content-Management
  • Drag-and-drop-Editor
  • SEO-Empfehlungen
  • Dashboards und Reports
  • Website-Themen
  • Integriertes CRM
  • SSL-Zertifikat
  • Code-Alerts

HubSpot CMS Hub-Preise

HubSpot CMS Hub Free

Die kostenlose Testversion von HubSpot CMS Hub kann 14 Tage lang genutzt werden. Sie umfasst den Drag-and-drop-Editor, grundlegende SEO-Empfehlungen, Cloud-Hosting, eine CRM-Datenbank sowie Website-Traffic-Analytics. Außerdem kann eine Custom-Domain mit dem WYSIWYG-Tool verbunden werden. Die kostenfreie Version ist sowohl für Websites als auch für Blogs geeignet.

HubSpot CMS Hub kostenpflichtig nutzen

Die HubSpot-CMS-Hub-Preise für die kostenpflichtigen Versionen unterscheiden sich je nach Feature-Umfang. Die Starter-Variante gibt es für 23 $/Monat. Sie beinhaltet alle Features der kostenlosen Testversion sowie eine mehrsprachige Inhalts-Erstellung, 24/7-Sicherheits-Überwachung inklusive Bedrohungs-Erkennung, ein Standard-SSL-Zertifikat und einen Live-Chat- sowie E-Mail-Support.

Die Professional-Version kostet 360 $/Monat und umfasst alle Starter-Features. Ebenso verfügt diese Version über Personalisierungs-Möglichkeiten dank Smart-Content, erweiterten SEO-Empfehlungen, A/B-Testing und Reporting sowie einer benutzerdefinierten Bericht-Erstellung.

Wer das Komplett-Paket möchte, greift zur Enterprise-Variante für 1.180 $/Monat. Sie bietet dir neben allen Professional-Funktionen zusätzliche Root-Domains, adaptive Tests, Partionierungen, Mitgliedschaften und Web-Anwendungen.

HubSpot CMS Hub-Alternativen

Auf OMR Reviews findest du eine Übersicht aller HubSpot-CMS-Hub-Alternativen. So kannst du basierend auf den verifizierten Bewertungen und Erfahrungs-Berichten unserer Nutzer*innen das passende WYSIWYG-Editor-Tool für dich und dein Unternehmen auswählen.

3. Adobe Dreamweaver als WYSIWYG-Editor-Programm

Die Adobe Dreamweaver-Software ist speziell für die Erstellung von Websites gedacht. Du kannst dich zwischen den Programmier-Sprachen HTML, CSS und JavaScript entscheiden. Dank der visuellen Darstellung und der Code-Engine kannst du im Handumdrehen programmieren. Zudem umfasst das Software-Paket von Adobe Dreamweaver Startvorlagen für Blogs, E-Commerce-Seiten, Newsletters und HTML-Mails. Wie der Name schon vermuten lässt, ist das WYSIWYG-Tool mit allen Adobe-Programmen kompatibel und ermöglicht dir die Integration von Creative Cloud-Elementen. 

Adobe Dreamweaver-Funktionen

  • Code-Engine
  • Verwaltung von dynamischen Websites
  • Visuelle Hilfestellung
  • Anpassbare Start-Vorlagen
  • Einbindung von Creative-Cloud- und Adobe-Stock-Elementen
  • Live-Ansicht
  • Moderne, optimierte Benutzer-Oberfläche
  • Git-Unterstützung

Adobe Dreamweaver-Preise

Adobe Dreamweaver kostenpflichtig nutzen

Der Adobe-Dreamweaver-Preis hängt von der Art des Abos ab. Entscheidest du dich für das monatliche Abo, gibt es das WYSIWYG-Tool für 38,98 €/Monat. Das Jahres-Abo gibt es bereits für 25,99 €/Monat. Zudem kannst du das Jahres-Abo 14 Tage kostenlos testen und danach selbst entscheiden, ob dies der passende WYSIWYG-Editor für dein Unternehmen ist. Mit einem Abo hast du Zugang zu Features wie 100 GB Cloud-Speicherplatz, Tutorials, Adobe Express, Adobe Portfolio, Adobe Fonts, Behance, Creative Cloud-Bibliotheken und vieles mehr.

Adobe Dreamweaver-Alternativen

Auf OMR Reviews findest du eine Übersicht aller Adobe-Dreamweaver-Alternativen. So kannst du basierend auf den verifizierten Bewertungen und Erfahrungs-Berichten unserer Nutzer*innen das passende WYSIWYG-Editor-Tool für dich und dein Unternehmen auswählen.

4. Brackets als WYSIWYG-Editor-Tool

Der WYSIWYG-Editor von Brackets ist komplett kostenlos!

Der Brackets-WYSIWYG-Editor ermöglicht dir das Erstellen und Gestalten von Websites direkt im Browser. Er wurde speziell für Web- und Frontend-Entwickler*innen kreiert. Der Text-Editor verfügt über eine Live-Vorschau, sodass du bereits während des Entwicklungsprozesses das Endergebnis im Blick hast. Das WYSIWYG-Tool beeindruckt Nutzer*innen mit seinem modernen Design und der einfachen Bedienung.

Brackets-Funktionen

  • Visuelle Werkzeuge
  • Inline-Redakteure
  • Live-Vorschau
  • Unterstützung von Prä-Prozessoren
  • Unzählige Plug-ins
  • Community-Support 

Brackets-Preise

Und jetzt kommt das Beste: Das Brackets-Tool gibt es komplett kostenlos!

Brackets-Alternativen

Auf OMR Reviews findest du eine Übersicht aller Brackets-Alternativen. So kannst du basierend auf den verifizierten Bewertungen und Erfahrungs-Berichten unserer Nutzer*innen das passende WYSIWYG-Editor-Tool für dich und dein Unternehmen auswählen.

5. CoffeeCup HTML Editor als WYSIWYG-Editor-Software

Intuitiv und einfach: der WYSIWYG-Editor von CoffeeCup.

Der CoffeeCup HTML Editor unterstützt dich bei der schnellen Erstellung von Websites und Web-Inhalten. Das WYSIWYG-Tool wird aufgrund seiner intuitiven Bedienung und vielen Features von Nutzer*innen gelobt. Der CoffeeCup Editor schlägt dir noch während des Tippens Vervollständigungs-Vorschläge für den Code vor. Zudem umfasst er eine Komponenten-Bibliothek, in der du beispielsweise Kopf- und Fußzeilen-Elemente speichern und später wiederverwenden kannst. Dadurch müssen Elemente nur einmal erstellt und bearbeitet werden. Wer mit HTML (noch) überhaupt nichts am Hut hat, kann anfänglich auch auf den CoffeeCup SiteDesigner zurückgreifen.

CoffeeCup HTML Editor-Funktionen

  • Tag-Highlighting
  • Split-Screen und externe Vorschau
  • Responsive Templates
  • Komponenten-Bibliothek
  • SiteDesigner für Anfänger*innen

CoffeeCup HTML Editor-Preise

Free CoffeeCup-HTML-Editor

Die kostenlose Version des CoffeeCup HTML Editors umfasst einige Optionen für einen einfachen Start in die Website-Kreation. Entweder entscheidest du dich für eine HTML- oder CSS-Datei und beginnst von Grund auf oder du holst dir ein bestehendes Thema sowie ein vorgefertigtes Design. Auch wenn du bereits eine Website hast, könnte dieses WYSIWYG-Tool hilfreich sein. Dank der Open-from-Web-Option kann jede beliebige Website dein Ausgangspunkt sein.

CoffeeCup HTML Editor kostenpflichtig nutzen

Du kannst die Premium-Version für 21 Tage kostenlos testen. Der Preis für den Premium-CoffeeCup HTML Editor beläuft sich anschließend auf 29 $/Monat. Entscheidest du dich für diese Version, hast du Zugriff auf alle Features wie Tag-Highlighting, den Vorlagen-Downloader und die Komponenten-Bibliothek. 

CoffeeCup HTML Editor-Alternativen

Auf OMR Reviews findest du eine Übersicht aller CoffeeCup HTML Editor-Alternativen. So kannst du basierend auf den verifizierten Bewertungen und Erfahrungs-Berichten unserer Nutzer*innen das passende WYSIWYG-Editor-Tool für dich und dein Unternehmen auswählen.

6. Wix als WYSIWYG-Editor-Programm

Wix bietet dir eine Komplettlösung für die Erstellung von Websites, Online-Shops, Blogs etc. Zudem kannst du Buchungen einfach verwalten und hast dank der mobilen App stets Zugriff auf das Programm. In dem visuellen Editor kannst du deine Website mittels Drag-and-drop einfach und schnell designen. Das WYSIWYG-Tool von Wix umfasst außerdem eine umfangreiche Vorlagen-Bibliothek, aus der du dir Inspiration holen und Vorlagen individuell anpassen kannst. Mithilfe des Dev-Tool Velo by Wix kannst du über 100 APIs verbinden und integrierte Datenbanken erstellen.

Wix-Funktionen

  • HTML-Input
  • Personalisierter SEO-Plan
  • Website-Analytics
  • Content-Management
  • Mobile App
  • Drag-and-drop-Editor
  • Dev-Tool Velo by Wix

Wix-Preise

Wix kostenpflichtig nutzen

Die Wix-Preise variieren je nach den Anforderungen. Die Light-Version ist bereits für 11,90 €/Monat erhältlich. Sie umfasst eine Domain für ein Jahr, 2 GB Speicherplatz sowie die Nutzung durch bis zu zwei Mitarbeiter*innen.

Die Core-Variante ist für 23,80 €/Monat erhältlich. Diese Version ermöglicht die Nutzung durch 5 Mitarbeiter*innen, eine Domain für ein Jahr, 50 GB Speicherplatz, eine Basic-Marketing-Suite, Basic-Statistiken, Basic-E-Commerce und die Verwaltung von Zahlungen.

Die Business-Variante ist für 34,51 €/Monat erhältlich. Diese Version ermöglicht die Nutzung durch 10 Mitarbeiterinnen, eine Domain für ein Jahr, 100 GB Speicherplatz, eine Standard-Marketing-Suite, Standard-Statistiken, Standard-E-Commerce sowie ebenfalls die Möglichkeit, Zahlungen anzunehmen. Bei der Business Elite-Version stehen 15 Mitarbeiterinnen zur Verfügung, ebenso wie eine Domain für 1 Jahr, unbegrenzter Speicherplatz, eine erweiterte Marketing-Suite, erweiterte Statistiken, erweiterter E-Commerce und eine erweiterte Entwicklerplattform sowie die Möglichkeit, Zahlungen anzunehmen.

Die Crème de la Crème ist die Enterprise-Variante mit allen Premium-Features sowie unbegrenzter Anzahl von Mitarbeiter*innen, Multi-Site-Management, Single Sign-On (SSO), eigenem Success Manager, eigenen Templates, eigenen Integrationen und zentralisierter Abrechnung. Den Preis kannst du auf der Unternehmenswebsite anfragen.

Wix-Alternativen

Auf OMR Reviews findest du eine Übersicht aller Wix-Alternativen. So kannst du basierend auf den verifizierten Bewertungen und Erfahrungs-Berichten unserer Nutzer*innen das passende WYSIWYG-Editor-Tool für dich und dein Unternehmen auswählen.

7. CKEditor als WYSIWYG-Editor-Tool

Klares Design und intuitive UX: das WYSIWYG-Tool von CKEditor.

CKEditor ist ein WYSIWYG-HTML-Editor mit einer sauberen UI und klaren UX, der sich für viele Anwendungs-Bereiche eignet. Zudem bietet das WYSIWYG-Tool einige Plugin-Optionen, sodass du es personalisieren und auf dein Wünsche abstimmen kannst. Dank Track-Changes, einer Revision-History und Comments können mehrere Nutzer*innen gleichzeitig an einem Projekt arbeiten und sich austauschen.

CKEditor-Funktionen

  • Kollaborative Bearbeitung
  • File-Management
  • Personalisierbare Themen und Symbolleisten
  • Grammatik- und Rechtschreib-Prüfung
  • Technischer Support und Open-Source-Community
  • Mehrsprachigkeit

CKEditor-Preise

CKEditor Free

Als Open-Source-Programm kannst du die Standard-Version der Software kostenfrei nutzen, und zwar gemäß der GNU General Public License. Diese Version bietet dir die modernste WYSIWYG-Bearbeitungsumgebung mit über 100 erweiterten Plugins wie Erwähnungen, Tabellen und der Möglichkeit, Inhalte aus Word einzufügen, sowie zahlreichen Anpassungen, Modifikationen und Symbolleistenoptionen und vielem mehr.

CKEditor kostenpflichtig nutzen

Das Starter-Paket kostet 49 $/Monat und stellt dir eine Bandbreite von und 50 GB im Monat sowie einen Speicherplatz von 50 GB zur Verfügung. Das Premium-Paket liegt bei 99 $/Monat und umfasst eine Bandbreite von und 100 GB im Monatsowie einen Speicherplatz von 100 GB. Das Pro-Paket kostet 199 $/Monat und ermöglicht dir die Nutzung einer Bandbreite von 250 GB im Monat und einem Speicherplatz von 200 GB.

CKEditor-Alternativen

Auf OMR Reviews findest du eine Übersicht aller CKEditor-Alternativen. So kannst du basierend auf den verifizierten Bewertungen und Erfahrungs-Berichten unserer Nutzer*innen das passende WYSIWYG-Editor-Tool für dich und dein Unternehmen auswählen.

Anmeldung zum SEO-Newsletter von OMR Reviews

Fazit: Mit dem „What you see is what you get”-Prinzip kannst du schnell und einfach Websites und Web-Inhalte erstellen

Unternehmer*innen sind oft mit vielen Dingen gleichzeitig beschäftigt. Nebenbei noch eine Programmier-Sprache für die Website-Erstellung zu lernen, ist da meist unmöglich. Dank moderner WYSIWYG-Tools ist das auch nicht nötig. Mit den passenden WYSIWYG-Editors wird die Website-Erstellung und -Gestaltung zum Kinderspiel. Und das Beste daran? Du siehst schon während des Design-Prozesses, wie dein fertiges Meisterwerk aussehen wird. 

Empfehlenswerte Website- & Homepage-Baukasten

Empfehlenswerte Website- & Homepage-Baukästen kannst du auf unserer Software-Vergleichsplattform OMR Reviews finden. Dort haben wir über 70 Website- & Homepage-Baukästen gelistet, mit denen du deine Website oder Homepage erstellen kannst. Also schau vorbei und vergleiche die Softwares mithilfe der authentischen und verifizierten Nutzerbewertungen:

Sarah Magdalena Huber
Autor*In
Sarah Magdalena Huber

Sarah ist sprachaffin und liebt Herausforderungen. Die gebürtige Österreicherin verfasst und übersetzt Texte in Deutsch, Englisch und Spanisch. Sie ist seit einigen Jahren selbständige Übersetzerin und Dolmetscherin und schreibt als freie Redakteurin bei OMR Reviews zu den Themen Software und Co.

Alle Artikel von Sarah Magdalena Huber

Im Artikel erwähnte Softwares

Im Artikel erwähnte Software-Kategorien

Ähnliche Artikel

Komm in die OMR Reviews Community & verpasse keine Neuigkeiten & Aktionen rund um die Software-Landschaft mehr.