Die 5 besten kostenlosen HTML-Editoren für Webentwickler (Mac-Edition)

Kein Beitragsbild

Andreas Hecht

ist WordPress-Entwickler und bietet dir WordPress-Sicherheit für deine Website. Zudem entwickelt er...

Wer Webseiten entwickeln möchte, braucht einen HTML-Editor, oder besser eine Entwicklungsumgebung. Sicherlich gibt es für den Mac einige sehr gute kostenpflichtige Editoren, doch wer seine Entwicklungsumgebung nicht jeden Tag nutzt, kommt auch mit kostenfreien Applikationen sehr gut aus. Dass ein Editor nichts kostet, heisst noch lange nicht, dass er nicht gut ist. Eine der besten Entwicklungsumgebungen überhaupt, ist als ständig kostenfreie Evaluierungsversion zu haben. Man kann sie “testen”, solange es einem beliebt. Allerdings sollte man bei Gefallen der Fairness halber dann schon bereit sein, den Editor auch zu kaufen. Im Folgenden präsentiere ich dir eine Auswahl der besten kostenfreien HTML-Editoren für macOS.

5-html-editoren-fuer-mac-os-x

CotEditor 2.o

Der CotEditor 2.0 für Mac OS X

Der CotEditor ist eine relativ junge und frische Neuentwicklung für Menschen, die ihren Editor nicht täglich benötigen und einfach nur einen guten Editor mit Syntax-Highlightning brauchen. Der CotEditor darf praktisch als Notepad++ für OS X verstanden werden. Er bietet neben einer brauchbaren Code-Vervollständigung auch eine wirklich gute “Suchen-und-Ersetzen”-Funktionalität an, Splitview zum Unterteilen des Editorfensters in mehrere Bereiche, gutes Syntax-Highlighting für 40 Programmiersprachen und kommt mit 8 Themes daher. Für einen einfachen Editor kann sehr viel angepasst werden, der Editor ist auf jeden Fall einen näheren Blick wert.

Hier ein Blick auf eines der 8 Themes:

coteditor-mit-dunklem-theme
Link zur Webseite mit Download

Brackets

Der Brackets HTML-Editor für Mac OS X

Bracket ist ein moderner, quelloffener Editor mit einigen extrem interessanten Funktionen. Zum Beispiel kann er in Zusammenarbeit mit der Adobe Creative Cloud Extract (=Vorschau) Designdaten wie Farbe, Schriftarten, Verläufe, Farbe und ähnliches direkt aus einer PSD-Datei herauslesen und in minimalistisch korrekten CSS-Code umsetzen. Ebenso können Ebenen als Bild extrahiert, Informationen aus der PSD als Variable in einem Präprozessor genutzt, und bequem Abstände und Proportionen von Elementen ermittelt werden. Alles, ohne den Editor verlassen zu müssen. Bitte beachten: Die Nutzung der Adobe Creative Cloud ist kostenpflichtig.

Kennst du unser E-Book-Bundle? Spare jetzt 6,99 €!

E-Book Bundle von Andreas Hecht

Ein weiterer großer Vorteil von Brackets sind die Erweiterungen, mit denen der Editor auf die eigenen Bedürfnisse angepasst werden kann. Alle drei bis vier Wochen kommen neue Erweiterungen dazu. Erwähnt werden sollte auch die vollständige Unterstützung von Präprozessoren. In Brackets können Sie “Schnelles Bearbeiten” sowie “Live-Vorschau” auch zusammen mit LESS- und SCSS-Dateien verwenden, was das Arbeiten damit wesentlich vereinfacht. Zusammen mit den richtigen Erweiterungen und der Adobe Creative Cloud Extract kann dieser Editor auch die Bedürfnisse von Profis abdecken.

brackets-editor-mit-psd-funktion

Eine kurze Vorstellung von Brackets im Video

Link zur Webseite mit Download

Sublime Text 2

Sublime Text 2 - Entwicklers Liebling

Sublime Text 2 ist der minimalistische Liebling der Entwickler, weil er ganz einfach mittels einer JSON-Datei komplett auf die eigenen Bedürfnisse anpassbar ist. Zudem gibt es etliche Erweiterungen, die den Editor “aufbohren” können. Eine Must-Have-Erweiterung ist zum Beispiel Package Control, mit dem sich Erweiterungen und Plugins ganz bequem über den Editor finden und installieren lassen. Den Funktionsumfang von Sublime Text 2 zu beschreiben ist recht schwer, denn über die Plugins und Erweiterungen kann er grundsätzlich so ziemlich alles, was man von ihm verlangt. Als Beispiel für sinnvolle Plugins dienen der Bracket Highlighter (für das Auffinden von zusammengehörigen Klammern und Tags), Emmet (ehemals Zen Coding – für extrem schnelles Coden) und Sublime Linter (macht auf Fehler im Quelltext aufmerksam).

Eine sehr gute Autovervollständigung bringt Sublime Text 2 bereits von Haus aus mit. Einige Themes sind auch an Bord. Viele weitere können installiert werden. Alle Standardfunktionen wie Suchen und Ersetzen sind sowieso vorhanden. Der Editor wird als ständige Evaluierungsversion angeboten, dass heisst, dass er zeitlich unbegrenzt kostenfrei getestet werden kann. Trotzdem sollte man der Fairness halber eine Lizenz erwerben, wenn man sich sicher ist, dass man ihn behalten und ständig nutzen möchte.
Link zur Webseite mit Download

Google Web Designer

google-web-designer

Ja, Google macht auch Tools für Webdesigner. Der Google Web Designer geht dabei eher in Richtung Adobe Dreamweaver. Er ist kein reiner HTML-Editor, sondern ein kombinierter WYSIWYG- (What you see is what you get) und Text-Editor. Arbeiten sind unter beiden Oberflächen möglich, einmal in der grafischen Oberfläche und dann auch in der Code-Ansicht. Der Google Web Designer soll aus der grafischen Oberfläche heraus gültigen HTML5- und CSS3-Code generieren.

Oberflächlich lässt sich relativ wenig über diesen Editor sagen. Auch die Informationen auf der Webseite des Editors sind mehr als spärlich, was daran liegen kann, dass der Editor sich noch in der Beta-Phase befindet. Allerdings ist das Konzept schon interessant.

google-web-designer
Link zur Webseite mit Download

Aptana Studio 3

Aptana Studio 3

Das Aptana Studio ist eine der bekanntesten und vielseitigsten Entwicklungsumgebungen überhaupt. Es handelt sich um ein sehr mächtiges Tool mit Unterstützung der wichtigsten Programmier- und Auszeichnungssprachen wie HTML (auch HTML5), CSS, JavaScript, PHP und Ruby. Mit Git-Integration, einem Debugger für Ruby und JavaScript, einem eingebauten Terminal und der Möglichkeit zur Erweiterung ist das Aptana Studio für jeden Einsatzzweck gewappnet. Aptana ist als Stand-Alone-Version oder als Eclipse-Plugin erhältlich. Wichtig zu wissen: Grundsätzlich werden die neuesten Webstandards unterstützt. Was mir missfällt: Eine Dokumentation scheint nicht (mehr) vorhanden zu sein, jedenfalls führt der betreffende Link zu einem anderen Ziel. Schade.

Link zur Webseite und Download

Du willst nicht coden? Dann schau dir Mobirise an

Der Begriff HTML-Editor wird auch von jenen verwendet, die dir damit das Editieren von HTML gar nicht erlauben, sondern dir stattdessen eine visuelle Umgebung für das Webdesign bieten. Solltest du entsprechend auf diesem Beitrag gelandet sein, weil du genau einen solchen suchst, wirst du inzwischen gemrkt haben, dass du am falschen Ort bist. Damit du uns nicht komplett frustriert wieder verlässt, will ich dich mit einem Werkzeug bekannt machen, das genau die Fähigkeiten hat, die du suchst.

Mobirise ist ebenfalls ein Editor, den du auf deiner Festplatte installieren musst, er lässt dich aber Seiten nur visuell gestalten. An den Code kommst du gar nicht ran. Dabei ist Mobirise extrem performant und einfach zu bedienen. Wenn du eine responsive Website schnell benötigst, solltest du dir den kostenlosen Editor Mobirise auf jeden Fall näher ansehen. Er steht für Windows und macOS zur Verfügung.

Fazit

Einige der besten HTML-Editoren für Mac OS X sind kostenlos oder als ständige Evaluierungsversion zu haben. Eine der meistgenutzten Entwicklungsumgebungen überhaupt findet sich mit Sublime Text 2 darunter. Sublime Text ist extrem schnell und an die eigenen Bedürfnisse ohne viel Frickelei anpassbar. Auch ich setze Sublime Text 2 ein.

Für Windows-Nutzer haben wir ebenfalls die besten HTML-Editoren vorgestellt, und zwar hier.

Links zum Beitrag

(Der Beitrag wurde am 12. Januar 2015 erstveröffentlicht und wird seitdem immer wieder aktualisiert.)

Andreas Hecht

ist WordPress-Entwickler und bietet dir WordPress-Sicherheit für deine Website. Zudem entwickelt er WooCommerce Shops mit Ladezeiten von unter einer Sekunde. Er schreibt seit 2012 für Dr. Web. Auf seinem Blog veröffentlicht er unter anderem nützliche WordPress-Snippets.

Hinterlasse einen Kommentar

17 Kommentare auf "Die 5 besten kostenlosen HTML-Editoren für Webentwickler (Mac-Edition)"

Benachrichtige mich zu:
avatar
Sortiert nach:   neueste | älteste | beste Bewertung
GripsArt
Gast

Ich nutze auch nur noch Sublime Text 2, Brackets habe ich auch angetestet, konnte mich aber nicht so sehr überzeugen. Aber im Grunde ist doch alles besser wie “Dreamweaver” 😉

Marcus
Gast

Hallo, ich denke Visual Studio Code von Microsoft ist absolut erwähnenswert. Ein guter Editor, den ich sehr gern auf meinem Mac nutze: https://code.visualstudio.com/download

Andreas Hecht
Gast

Danke Dir für die Erwähnung. Ich schaue ihn mir mal genauer an.

Björn Wibben
Gast

Gute Übersicht, leider wurde jedoch weder Vim noch Emacs erwähnt.

trackback

[…] wie Notepad (Windows) oder TextEdit (Mac), oder aber mit einer Entwicklungsumgebung – für Mac OS X oder für […]

trackback

[…] Andreas Hecht bei Die 5 besten kostenlosen HTML-Editoren für Webentwickler (Mac-Edition) […]

Florence Maurice
Gast

Google WebDesigner würde ich nicht mit Dreamweaver vergleichen, sondern eher mit Flash. Die Tools für die Animationen sind hier das Herzstück.

Bei meinen letzten Tests gab es mit dem erzeugten Code Cross-Browser-Probleme (gut gings eigentlich nur in Chrome) und ansonsten scheint es mir auch sehr auf die Erstellung von Werbebannern für das Google-Universum spezialisiert. Aber das nur so ein erster Eindruck nach ein paar kürzeren Tests.

Deedee
Gast

Ich benutze Brackets intensiv seit über 1 Jahr und bin sehr begeistert. Einige der Erweiterungen sind für mich unverzichtbar und sinnvoll.

Largo
Gast

Zu Google Web Designer

Wollte mit ihm eben eine Datei öffnen, was er mit folgender Fehlermeldung quitierte.

“Die Datei kann aufgrund des folgenden Fehlers nicht geöffnet werden: Die Datei wurde nicht in Google Web Designer erstellt.

Ich staunte nicht schlecht.. und schade, wieder keine Alternative zum Dreamweaver.

Björn Puls
Gast

Ich bin auch ein grosser Fan von Brackets 🙂

Neco
Gast

Ich kann Sublime Text 2 wirklich wärmstens empfehlen. Vielleicht braucht man etwas mehr Einarbeitungszeit als bei anderen Editoren. Dafür ist der Workflow später ein Genuss. Es gibt einige sehr schöne (deutschsprachige) Tutorials zu ST2, einfach den Suchmaschinenbetreiber seines Vertrauens fragen 🙂

Andre
Gast

Moin ati,
Brackets läuft unter auch Linux bestens, ich nutze das intensiv und mag das Programm.

ati
Gast

Ich bevorzuge Komodo http://komodoide.com/komodo-edit/

Es läuft auch unter Linux (für mich wichtig) und Windows (wurscht). Habe in den letzten 15 Jahren viele Programme getestet (auch kostenpflichtige), aber – für meinen Bedarf – noch kein besseres gefunden.

Nils
Gast

Ich vermisse GitHub Atom (www.atom.io) in der Liste. Der ist im Gegensatz zu Sublime Text nämlich wirklich kostenlos. ST2 ist es nicht, das finde ich irreführend.

Andreas Hecht
Gast

Hallo,

danke Dir für die Ergänzung. Ich werde den Atom-Editor mal eingehend testen, er scheint sehr interessant zu sein. Übrigens schrieb ich zum Sublime Text 2, dass er so lange getestet werden kann, wie man möchte – was man quasi mit kostenfrei gleichsetzen kann. Natürlich sollte man der Fairness halber dann auch eine Lizenz erwerben, wenn man den Editor immer nutzen möchte.

Andreas Hecht
Gast

Für Atom kommt noch ein eigener Beitrag demnächst.

Nils
Gast

Hallo Andreas,

genau das meinte ich mit “ST2 ist es nicht, […]”. Aber das sind nun natürlich Wortklaubereien. Dennoch hätte eigentlich Atom (erst recht durch die Möglichkeiten zur Erweiterung) anstelle von ST2 stehen sollen, finde ich.