Leserinnenfrage: Kostenloser WYSIWYG HTML-Editor für den Mac – welchen kann man empfehlen?

WYSIWYG HTML Editor für den Mac

Ok, die Leserin, die hier die Frage gestellt hat, ist jemand aus meinem Haushalt, der sich seit Kurzem verschärft mit HTML Programmierung beschäftigt. Sie hat einen Kurs gebucht, in dem man kleine HTML Fragestellungen löst und seine ersten Zeilen in HTML-Code schreibt. Die kleinen Aufgaben lassen sich problemlos in einem Online-Editor lösen, in dem man links die HTML Ansicht hat und rechts direkt das Ergebnis sieht, aber wenn man größere Sachen schreibt und diese auch abspeichern möchte, dann kommt man um einen HTML-Editor nicht rum.

Sublime Text ist im Vergleich zu Dreamweaver wunderbar schnell und auch das Öffnen von 50 oder mehr Dateien legt den Mac keinesfalls lahm – ein Grauen bei Dreamweaver. Dafür gibt es bei Sublime Text keine Vorschau des Codes.
Sublime Text ist im Vergleich zu Dreamweaver wunderbar schnell und auch das Öffnen von 50 oder mehr Dateien legt den Mac keinesfalls lahm – ein Grauen bei Dreamweaver. Dafür gibt es bei Sublime Text keine Vorschau des Codes.

Adobe Dreamweaver und Sublime Text – kostenpflichtig, aber empfehlenswert

Ich persönlich arbeite bei meinen Jobs in der Regel mit Dreamweaver, mit dem ich seit vielen Jahren vertraut bin und den ich sowieso mit der Adobe Cloud gebucht habe. Mit der Zeit ist Dreamweaver allerdings etwas behäbig geworden und wenn es um reines Programmieren geht, ohne dass ich eine zeitnahe Vorschau sehen muss, dann ist mein neuer Liebling Sublime Text.

Beide Programme kosten Geld: Adobe verlangt sogar eine monatliche Gebühr und Sublime Text möchte einmalig 80 USD – der Editor ist aber wirklich jeden Cent wert. Wer also bereit ist, ein bisschen Geld für sein neues Hobby oder sein neues Standbein in die Hand zu nehmen, ist mit beiden Programmen gut bedient.

RocketCake machte erst einen guten Eindruck, bis ich gemerkt habe, dass die Sourcecode Ansicht nur "lesen" erlaubt, man aber nichts dort eintippen kann. Grandios… :D
RocketCake machte erst einen guten Eindruck, bis ich gemerkt habe, dass die Sourcecode Ansicht nur “lesen” erlaubt, man aber nichts dort eintippen kann. Grandios verfehlt… :D

Update: Espresso ist mein neuer Liebling

Der Beitrag ist noch keine 4 Stunden alt und schon muss ich mich korrigieren. :-( Aber so ist es nun mal: BlueGriffon, den ich erst als meine liebste Auswahl vorgestellt habe, ist nun nur noch Platz 2, weil meine Leserin Beatrix mir den Tipp mit der App Espresso gegeben hat.

BlueGriffon hat einen Bug, den es derzeit für mich extrem unhandlich macht: Der Quellcode des Dokuments bricht in der Ansicht nicht um – selbst, wenn man dies in den Optionen ausgewählt hat. Damit ist das Editieren von HTML-Dokumenten mit langen Texten unangenehm und kostet unnötig viel Zeit.

Der HTML Editor Espresso, der zwar normal 99 USD kostet, aber in der wirklich guten App-Flatrate von Setapp enthalten ist, bietet ein deutlich komfortableres Arbeiten. Wie man sieht, funktionieren hier auch die automatischen Umbrüche im Source Code.

Der HTML-Editor Espresso ist meine neueste Lieblingswahl. Der Sourcecode wird ordentlicher dargestellt als bei BlueGriffon.
Der HTML-Editor Espresso ist meine neueste Lieblingswahl. Der Sourcecode wird ordentlicher dargestellt als bei BlueGriffon.

Wer kein Geld ausgeben möchte und für einen Kompromiss bereit ist, der kann sich BlueGriffon aber trotzdem mal anschauen.

BlueGriffon – kostenlos, aber sehr gut

Nachdem ich für mein Hasi (ok, jetzt ist raus, für wen ich auf der Suche war) ein paar HTML Editoren wie Amaya, Sea Monkey und RocketCake ausprobiert habe, bin ich letztendlich bei BlueGriffon am glücklichsten geworden. Der Editor bietet die klassische Ansicht mit zwei Fenstern (Sourcecode und Vorschau) und lässt sowohl das Arbeiten im WYSIWYG-Modus (“What you see is what you get”=”was du siehst, ist was du bekommst”) als auch im Source Code Fenster zu.

Er verfügt über zahlreiche Buttons mit fertigen Code-Schnipseln für die üblichen HTML-Codes und man kann sogar CSS einfach zusammenbauen, in dem man die Eigenschaften für eine ID ändert. Der Editor erstellt dann im HEAD-Bereich einen CSS-Code für die entsprechenden Änderungen.

Ich denke für Einsteiger ist dies wirklich ein empfehlenswertes Tool, da man sich nicht mit vielen Fenstern rumschlagen muss, die bei Dreamweaver bei den ersten Schritten erst einmal abschreckend wirken.

BlueGriffon ist genau das, was ich gesucht habe: Man kann eine Zwei-Fenster-Ansicht wählen oder im Source Code Fenster arbeiten. Auch der WYSIWYG-Modus ist eine Möglichkeit, die man beim Editieren wählen kann.
BlueGriffon ist genau das, was ich gesucht habe: Man kann eine Zwei-Fenster-Ansicht wählen oder im Source Code Fenster arbeiten. Auch der WYSIWYG-Modus ist eine Möglichkeit, die man beim Editieren wählen kann.

Unterschiede der Lizenzen von BlueGriffon

Wer mehr mit BlueGriffon machen möchte, zum Beispiel EPUB-Dateien bearbeiten, Code Snippets selbst erstellen oder mit vorgefertigten Tabellen Layouts werkeln, der kann sich eine Lizenz für BlueGriffon holen. Dies ist aber nicht nötig, wenn man den Editor im privaten Bereich zum Bearbeiten von HTML-Seiten verwendet. Nutzt man die lizenzfreie Version, kann man BlueGriffon gratis laden und einsetzen.

Die Preise für die lizenzierten Versionen liegen hier bei der Basic Lizenz bei 75 EUR und bei der EPUB-Lizenz (der größten Lizenz mit allen Features) bei 195 EUR zuzüglich Mehrwertsteuer. Die Unterschiede der drei Versionen könnt ihr hier einsehen.

Dass BlueGriffon durchaus verbreitet ist, machen die Entwickler auf der Webseite deutlich:

BlueGriffon® is used by millions of users around the world, including Universities, Governments and even the European Parliament. It is officially recommended by the French Government as the Web Authoring Tool for the French Administration in its effort to rely on and promote Free Software (Socle Interministériel de Logiciels Libres).

Man sieht schon, dass BlueGriffon ein sorgsam entwickelter HTML-Editor ist, der flexibles Arbeiten erlaubt. Seine Unterstützung bei den CSS-Eigenschaften dürfte vor allem für CSS-Neulinge eine tolle Hilfe sein. Die Basis-Lizenz für 75 Euro ist natürlich schon etwas schmerzhaft, wenn man nur hobbymäßig mit dem Programm arbeiten möchte, aber durch die lizenzfreie, kostenlose Version hat man – gerade als Anfänger – genug Möglichkeiten, um mit BlueGriffon kleine HTML-Projekte umzusetzen.

Die Dual-View des HTML Editors bietet sowohl eine Source Code als auch eine WYSIWYG-Ansicht und im rechten Bereich ein Fenster in dem die Eigenschaften von CSS Elementen angezeigt werden.
Die Dual-View des HTML Editors bietet sowohl eine Source Code als auch eine WYSIWYG-Ansicht und im rechten Bereich ein Fenster in dem die Eigenschaften von CSS Elementen angezeigt werden.

Fehler beim Öffnen von BlueGriffon?

Wenn ihr eine Meldung beim Öffnen von BlueGriffon erhaltet, die verhindert, das Programm zu starten, dann könnt ihr hier die Details zu dieser Gatekeeper-Blockade lesen. Um die Sache abzukürzen, klickt mit der rechten Maustaste auf das Programmsymbol von BlueGriffon und wählt “Öffnen”. Dann erscheint nur eine Warnung und ihr könnt die Mac-App aber trotzdem starten.

Lesertipps: andere HTML Editoren?

Wenn ihr noch Alternativen kennt, die am Mac unter macOS Catalina (64 Bit!) laufen, dann würde ich mich über eure Tipps freuen. Alle Programme, die in die Rubrik HTML-Editor mit WYSIWYG-Ansicht fallen, ergänze ich dann hier in einer Liste.

 

Meine Tipps & Tricks rund um Technik & Apple

Hat dir der Artikel gefallen und helfen dir die Anleitungen im Blog? Dann würde ich mich freuen, wenn du das Blog über eine Steady-Mitgliedschaft unterstützen würdest.

34 Kommentare zu „Leserinnenfrage: Kostenloser WYSIWYG HTML-Editor für den Mac – welchen kann man empfehlen?“

    1. Hallo Gustav! Ok, ich habe gerade mal danach gesucht, aber bei deren Webseite ist nur ein Schild: “Sorry, we are closed!”. :(

      1. Oha. Das tut mir leid, wußte ich nicht. Habe hier noch die Version 3.0.9 und die läuft nach wie vor. Sehr übersichtlich, gut designed und mit einigen schönen Funktionen. Aber hat ja keinen Zweck hier veraltete Programme zu empfehlen. Also: sorry.

        1. Hallo Gustav! Ist doch kein Problem. Das ist doch eher mein Job und nicht deiner. Du hast schon sehr geholfen, indem du dich hier einbringst. Es freut mich immer wieder, wenn Leser mithelfen, die Beiträge interessanter zu machen.

    1. Danke! Ist das denn ein Tool, mit dem man auch im Source Code die Seiten ändern kann? Oder bastelt man in dem Editor und der macht das ganze HTML, ohne dass man es im Code ändern kann?

  1. Beatrix Willius

    Die Software BlueGriffon hörte sich interessant an. Aber da gibt es echt Entwickler, die Geld für ihre Software verlangen, und dann ist die Software nicht notarisiert. Oh wei.

    Das html im Screenshot ist php und sollte better mit einem php-IDE entwickelt werden.

    Ich habe eine alte Version von Espresso (https://www.espressoapp.com). 99$ ist ein stolzer Preis. Ich muß den Preis für meine eigene Software erhöhen!

    1. Hallo Beatrix! Der Screenshot von Sublime Text ist PHP mit HTML gemischt, weil ich da ein Projekt für einen Verlag programmiert habe. Ich bin aber kein Profi, darum habe ich von den IDEs keine Ahnung. :D Espresso sieht gut aus. Und vor allem: Es ist in Setapp enthalten – ich Depp hätte dort gleich mal nachsehen sollen. ;-)

  2. Moin
    ich bin auf der Suche nach einem Programm zum Internet-Seitenbau.
    Früher hatte ich das mit Adobe Muse gemacht.
    WordPress ist mir schon zu viel.
    Ich würde es gerne offline am Mac bauen können.
    Hast du da auch Tipps?
    Vielen Dank

  3. Beatrix Willius

    Mit Rapidweaver kann man viel machen. Aber es erfordert Einarbeitungszeit und einiges an Geld. Ohne das Plugin Stacks geht erst einmal gar nichts. Dann braucht man noch ein Template. Es gibt generische Templates, mit denen man sein eigenes Template bauen kann. Aber das ist dann noch mehr Arbeit.

    1. Ja, das mit den generischen Templates kenne ich von Wordpress. :D Die sehen immer gut und einfach aus, aber dann steckt noch ein Haufen Arbeit drin.

  4. Vielleicht mag sich der eine oder andere mal die App PINEGROW pinegrow.com anschauen.
    Sicher viel Einarbeitungszeit, aber man kann auch viel damit machen. ;-)
    Nicht kostenlos, aber sehr fairer Preis.

    1. Hallo R! Das sieht ganz interessant aus, auf der Webseite. Hast du die App in Verwendung? Könnte man sie als Alternative zu Dreamweaver nutzen? Ich suche derzeit noch Wege, um von der Adobe Cloud wegzukommen. :D

  5. Hallo Jens,
    Danke für Deine tollen Ratschläge zu den html-Editoren. Ich nutze seit Jahren erfolgreich Bluegriffon (ohne Lizenz) auf meinem iMac. Seit einiger Zeit (ggfls ab Update auf Big Sur) kann ich in Bluegriffon die Funktion Insert nicht mehr nutzen. Nach dem Klick auf den Button erscheint zwar ein neues Menü Fenster, aber es bleibt grau und ohne Inhalt.
    Hast Du davon schonmal gehört? Weisst Du was ich hier tun kann?

    1. Hallo Heike! Oh, tut mir leid. Leider habe ich mit Bluegriffon nicht wirklich was gemacht. Nur mal installiert und ausprobiert. Aus dem Grund wäre es vermutlich erfolgreicher, wenn du dich an deren Support wendest. Vielleicht haben die eine Idee, an was es liegt. LG!

    2. Hallo Heike,
      das gleich Problem hab ich auch (Big Sur und BG 3.1). Leider antwortet der Support nicht, so dass ich mich nach Alternativen umschauen muss, leider. War bisher immer sehr zufrieden aber graue Texte (im gesamten Userinterface) auf grauen Grund ist nicht brauchbar.
      Jeder Tipp zur Lösung ist natürlich gern gesehen ;-)

  6. Hallo Jens, ich habe bis vor kurzem immer noch Dreamweaver2 und Fireworks2 verwendet für html Schnipsel. KompoZer ist ein 64bit Opfer also wollte ich BlueGriffon testen. Beim ersten Öffnen erhält man ein Fenster ? Bluegriffon möchte die Tastatureingaben aller apps empfangen. Darf man das erlauben ?

    1. Hallo Roland! Das irritiert mich nun etwas… ich wüsste nicht, weshalb die App das wollen würde. Hast du es von der richtigen Webseite geladen? Ich hatte BlueGriffon relativ schnell wieder deinstalliert, da es mir von der Bedienung nicht gefallen hat. Die Meldung hätte mich aber garantiert stutzig gemacht, wenn sie gekommen wäre. Ich würde da keinen Zugriff erlauben und die App wieder deinstallieren.

  7. Es ist mittlerweile 2023 und seit Big Sur läuft Bluegriffon nicht mehr. Kennt jemand einen Trick, die Software zum Laufen zu bringen?

    1. Wenn die Entwickler von Bluegriffon die Software nicht an die neuen macOS Versionen anpassen, dann gibt es vermutlich nur einen Weg: Ein altes macOS nehmen.

  8. Das habe ich auch gemacht, nur leider habe ich jetzt ein MacBook mit M2, da lässt sich kein altes OS installieren, nicht mal virtualisieren. Und eine echte Alternative zu Bluegriffon gibt es nicht (und Dreamweaver ist die Pest). Leider antworten die Entwickler auch nicht auf Nachrichten, ich schätze, das Projekt ist tot :-(

  9. Ich habe versucht, BG 3.1 mit SONOMA zu installieren, aber beim Öffnen sind die Fenster transparent. Gibt es eine Idee, wie ich das Problem lösen kann? Danke

    1. Hallo gg! TJa, wenn ich wüsste, was BG3.1 ist, könnte ich vielleicht helfen. Aber wenn mir die Abkürzung nix sagt, dann kenne ich das Programm vermutlich nicht einmal. LG, Jens

    1. Danke für den Tipp, Stas! Aber du hättest erwähnen können, dass du Teil des CodeLobster Team bist. Das wäre transparenter gewesen.

Kommentar verfassen

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

Im Sir Apfelot Blog findest du Ratgeber, Anleitungen und Testberichte zu Apple Produkten wie iPhone, iPad, Apple Watch, AirPods, iMac, Mac Pro, Mac Mini und Mac Studio.

Specials
Shopping
  •  
  •  

Meine Tipps & Tricks rund um Technik & Apple