15 HTML Editoren zum Downloaden: Übersicht mit aktuellen Tools
Ob HTML, CSS oder JavaScript – mit HTML-Editoren kann die Arbeit als Webentwickler deutlich leichter von der Hand gehen. Diese Übersicht zeigt 15 aktuelle und beliebte Tools mit Komfortfunktionen wie Syntaxhervorhebung, Themes und mehr.
Merkmale moderner HTML-Editoren
Im Grunde genommen lassen sich Codezeilen in HTML, CSS, JavaScript und Co. mit einem einfachen Texteditor für Windows oder Mac schnell ansehen und bearbeiten. Wenn der Quellcode jedoch deutlich an Umfang gewinnt oder die Projekte umfangreicher werden, bieten sich spezielle HTML-Editoren an.Mit diesen für Webdevelopern optimierten Tools lassen sich beispielsweise einzelne Befehle oder Tags farblich hervorheben. Neben diesem sogenannten „Syntax-Highlighting“ bieten moderne HTML-Editoren zudem auch häufig eine automatische Code-Vervollständigung, Suchen-und-Ersetzen-Funktionen, WYSIWYG-Vorschauen sowie weitere nützliche Features, die wie für Webentwickler gemacht sind. Außerdem lässt sich durch den Download von Themes das Aussehen der Benutzeroberfläche den eigenen Vorstellungen farblich anpassen. Das kann unter anderem für ermüdungsfreieres Arbeiten sorgen.
Die Plattform „Stack Overflow“ hat in einer Umfrage die beliebtesten Entwicklungsumgebungen für Webentwickler ermittelt. Darunter befinden sich auch viele HTML-Editoren. Diese schauen wir uns im Detail an.
Welche HTML-Editoren tatsächlich für einen selbst am besten geeignet erscheinen, ist jedoch häufig eine Frage der persönlichen Präferenzen. Auf jeden Fall kommt hier eine Übersicht mit weltweit beliebten HTML-Editoren. Die Tools stehen für Windows, Mac oder Linux entweder kostenlos, als Open Source oder gegen eine entsprechende Lizenzgebühr zum Downloaden zur Verfügung.
Viel Spaß beim Entdecken!
Visual Studio Code Editor: HTML-Editor von Microsoft
Das von Microsoft entwickelte Visual Studio Code zählt heutzutage zu den beliebtesten HTML-Editoren. Laut einer Umfrage von Stack Overflow belegt er sogar Platz 1 unter den beliebtesten Entwicklungsumgebungen.
Unterstützt wird eine Vielzahl von Programmiersprachen. Darunter findet man beispielsweise Visual Basic .NET, C, C++, C++/CLI, C++/CX, C#, F#, SQL-Server, TypeScript und Python. Aber auch Webentwickler kommen mit HTML, JavaScript und CSS nicht zu kurz.
Highlights des HTML-Editors von Microsoft sind unter anderem die komfortable Syntaxhervorhebung, die Unterstützung von Themes sowie die Erweiterungsfähigkeit durch sogenannte Extensions. Dass der Editor ständig gepflegt und weiterentwickelt wird, verdeutlichen die vielen umfangreichen Updates, die die Redmonder monatsweise vornehmen.
Visual Studio Code gibt es kostenlos für Windows, Mac und Linux zum Downloaden.
Sublime Text HTML-Editor
Sublime Text ist ein unter Webentwicklern beliebter HTML-Editor. Er belegt Platz 6 bei der Umfrage zu den beliebtesten Entwicklungsumgebungen. Sublime wird zum Downloaden für Microsoft Windows, Mac und Linux angeboten. Die Benutzeroberfläche lässt sich durch Themes den eigenen Vorstellungen anpassen. Zudem können nahezu alle Elemente auf Wunsch ein- oder ausgeblendet werden. Auch ablenkungsfreies Schreiben ist somit möglich.
Außerdem bietet Sublime Text viele Komfortfunktionen, die „unter der Haube“ liegen und nicht sofort ins Auge springen. Dazu gehört beispielsweise das gleichzeitige Bearbeiten mehrerer Codezeilen, das Ein- und Ausblenden von Quellcode und vieles mehr.
Das folgende Video zeigt einige dieser im HTML-Editor versteckten Shortcuts und Tipps, die auf jeden Fall nützlich sind:
Außerdem stellt der Package Manager viele Möglichkeiten bereit, den HTML-Editor durch weitere Plugins mit Befehlen zu erweitern und anzupassen.
Die aktuelle Version Sublime 4, die es seit Mai 2021 zum Downloaden gibt, ist übrigens offiziell nicht „free“ bzw. komplett kostenlos. Sie kann jedoch unbegrenzt auf Herz und Nieren getestet werden. Ein Ablaufdatum gibt es tatsächlich nicht. Für Anwender, die also intensiv mit diesem HTML-Editor arbeiten, empfiehlt es sich – nach Gefallen und einer angemessenen Zeit – die Lizenzgebühr von 80 US-Dollar dem Entwickler zukommen zu lassen.
ATOM HTML-Editor
Der kostenlose HTML-Editor ATOM ist Open Source und kommt direkt von GitHub. Die Entwickler bezeichnen ATOM als den „Hackable Text Editor“. Da lässt sich also einiges selbst einstellen, erweitern und ergänzen. Im sogenannten Flight Manual werden sämtliche Features und Funktionen erklärt.
Die Community ist sehr aktiv. Durch ATOM Packages kann man, ähnlich wie in Sublime, neue Shortcuts, Farbvarianten und Co. nach Lust und Laune installieren. Beispielsweise lassen sich damit Fehler erkennen, häufig genutzter Quellcode auf Knopfdruck einfügen und vieles mehr.
Die Anzahl der Themes ist ebenfalls sehr umfangreich gehalten. Derzeit darf aus über 3.200 Farbvorlagen ausgewählt werden. Da dürfte sicherlich für den einen oder anderen etwas dabei sein.
Als reiner HTML-Editor belegt ATOM einen respektablen 9. Platz bei der Umfrage nach den beliebtesten Werkzeugen für Webentwickler. ATOM steht für Windows, Mac und Linux zum kostenlosen Download zur Verfügung.
Adobe Brackets: HTML5-Editor mit optionaler WYSIWYG-Ansicht
Der HTML-Editor Brackets kommt aus dem Hause Adobe und ist Open Source. Der Anbieter bezeichnet das Tool als modernen, quelloffenen Code-Editor. Mit Brackets lassen sich Funktionen immer dann einblenden, wenn es erforderlich ist. Somit befinden sich ganz bewusst nur wenig Elemente auf dem Bildschirm, die für Ablenkung sorgen können. Außerdem gibt es einen „Ablenkungsfreien Modus“.
Zudem gibt es in Brackets eine optional einblendbare WYSIWYG-Ansicht, die unter dem Menüpunkt „Live-Vorschau“ abgerufen werden kann. Bereiche lassen sich in dieser Echtzeitdarstellung per Mauszeiger anwählen. Daraufhin werden in der Code-Ansicht automatisch die entsprechenden Zeilen markiert dargestellt.
Der HTML-Editor lässt sich per Extensions erweitern und somit den eigenen Bedürfnissen individuell anpassen. Die vielen von der Community erstellten Erweiterungen können direkt der Software aktiviert werden.
Der Open Source HTML-Editor Brackets steht kostenlos für Windows, Mac und Linux zur Verfügung. Das aktuelle Update von April 2020 bezieht sich jedoch auf die entsprechenden Windows- und Mac-Versionen.
Adobe Dreamweaver CC 2023
Ebenfalls von Adobe stammt Adobe Dreamweaver CC. Im Laufe der Jahre hat der HTML-Editor eine umfangreiche Entwicklung hingelegt. War die Software anfangs noch eher auf eine Bearbeitung in der Echtzeitvorschau ausgerichtet, ist aus Dreamweaver mittlerweile ein HTML-Editor geworden, der Komfortfunktionen wie Syntaxhervorhebung, Autovervollständigung und mehr bietet.
Die WYSIWYG-Ansicht ist nach wie vor fester Bestandteil von Dreamweaver. Diese lässt sich parallel zur Code-Ansicht einblenden, reagiert auf Markierungen mit der Maus und bietet kontextbedingte Funktionen.
Für Webentwickler interessant sind auch die Startvorlagen des HTML5-Editors. Damit lassen sich beispielsweise HTML-Grundlayouts auf Basis von Bootstrap erstellen. Der entsprechende Code sowie alle erforderlichen CSS- und JavaScript-Dateien werden dabei gleich passend für die Projektseite angelegt und in das Verzeichnis der Wahl abgelegt.
Adobe Dreamweaver CC ist Teil der Creative Cloud von Adobe und steht somit für alle Abonnenten zum Herunterladen bereit. Eine kostenlose Testversion gibt es ebenfalls.
Coda 2 HTML Editor
Coda ist ein schneller und kompakter Source Code Editor, der Features für Webdeveloper mit sich bringt. Der HTML-Editor bietet einen grafischen Website-Manager, einen integrierten FTP-Client für sichere Übertragungen über SFTP, FTP-SSL und WEBDAV und vieles mehr.
Da es Coda ausschließlich für MacOS gibt, findet man in diesem HTML-Editor einige Funktionen, die speziell für das Betriebssystem optimiert wurden. So wird unter anderem die Touch Bar des MacBook Pro unterstützt. Mit „Air Preview“ lassen sich iPads und iPhones mit dem Code-Editor verwenden, um Seiten direkt beim Erstellen auf dem Desktop in der Vorschau anzuzeigen.
Für Coda steht eine 14-tägige Testversion zum Downloaden bereit. Danach kann der HTML-Editor für 99 US-Dollar über die Projekt-Website erworben werden.
Update vom 6. März 2022: Neue Versionen dieses HTML5-Editors erscheinen unter dem Namen Nova. Aktuell wurde die Version 8.4 veröffentlicht.
lite (Simple HTML Editor)
Mit dem frisch erschienenen HTML-Editor lite verfolgt der Entwickler rxi einen besonders leichtgewichtigen Ansatz. Geschrieben wurde der Text-Editor in der Programmiersprache Lua. lite soll ansprechend, klein, schnell und so einfach wie möglich im Umgang sein.
Der Texteditor kann außerdem den Syntax von CSS, PHP, JavaScript und Co. darstellen. Der kostenlose HTML-Editor lässt sich zudem durch PlugIns und Themes den eigenen Vorstellungen anpassen.
Das Programm steht unter einer MIT Licence für Windows und Linux zum Downloaden bereit.
Notepad++ HTML-Editor
Notepad ++ ist ein freier Source Code Editor. Ursprünglich ist die Software entwickelt worden, um eine Alternative zum in Windows mitgelieferten Editor „Notepad“ zu bieten. Im Laufe der Jahre sind viele Funktionen hinzugekommen.
Mittlerweile bietet der HTML-Editor die Möglichkeit, Dateien in Tabs zu öffnen. Außerdem gibt es Autovervollständigung, Miniaturansichten, Kodierungswerkzeuge und viele weitere Komfortfunktionen.
Interessant ist zudem die Möglichkeit, Makros direkt in Notepad++ aufzuzeichnen und anschließend auszuführen. So lassen sich ständige Arbeitsschritte automatisieren.
Ein echter Klassiker: Notepad++ belegt einen beachtlichen dritten Platz bei den beliebtesten Entwicklungsumgebungen. Das geht jedenfalls aus der Umfrage von Stack Overflow hervor.
Notepad ++ gibt es kostenlos für Windows zum Downloaden.
Coffee Cup HTML-Editor
Neben dem visuell orientierten Site Designer bietet Coffee Cup auch einen waschechten HTML-Editor an. Nützlich ist auch hier die Funktion, oft verwendete Codezeilen in eine Bibliothek abzulegen und dann später an beliebiger Stelle einzufügen. Der „Theme/Layout Chooser“ enthält zudem einige fertige Komponenten wie mehrspaltige Layouts, Slider etc. zum nachträglichen anpassen.
Außerdem verfügt der HTML-Editor über eine Befehlsreferenz, unterstützt Code-Vervollständigung und die Nutzung von Website-Komponenten, die auf den entsprechenden Seiten aktualisiert werden können und weitere Features.
Den HTML-Editor von Coffee Cup gibt es in einer Testversion sowie als lizenzierte Software für 29 US-Dollar zum Downloaden. Bei der kostenlosen Variante erscheinen diverse Hinweisfenster, die auf den möglichen Erwerb der kostenpflichtigen Version hinweisen.
BlueGriffon
Die Entwickler von BlueGriffon bezeichnen ihr Tool selbst als den „Next-Gen Web und EPUB-Editor“. Als Basis für den HTML-Editor dient Gecko, die Rendering-Engine von Firefox.
Zwischen einer WYSIWYG- und Quelltext-Ansicht kann nach Belieben gewechselt werden. Auf Wunsch lassen sich auch beide Bereiche nebeneinander anzeigen und bearbeiten. Zudem wartet der HTML-Editor mit einer Druckvorschau auf.
Hervorzuheben ist auch die Möglichkeit, SVG-Grafiken direkt im Editor zu erstellen. Über die WYSIWYG-Ansicht lässt sich per „Einfügen -> SVG“ ein Bearbeitungsfenster öffnen, in dem sich (ähnlich wie in einem Grafikprogramm) Objekte von Hand zeichnen lassen. Nach dem Speichern wird die Grafik automatisch in SVG-Code umgewandelt und anschließend in die HTML-Datei eingefügt.
BlueGriffon bietet außerdem weitere Komfortfunktion wie Syntax-Highlighting, automatische Vervollständigung von Tags und mehr. Über zusätzliche Extras lässt sich der Funktionsumfang entsprechend erweitern.
Der HTML-Editor ist Open Source und kann kostenlos für Windows, Mac und Linux heruntergeladen werden. Einige Features der aktuellen Version 3.1 sind jedoch der kostenpflichtigen Version vorbehalten. Diese kann für 75 US-Dollar (Basis-Lizenz) bzw. 195 US-Dollar (EPUB-Lizenz) erworben werden.
CotEditor
CotEditor ist ein schlanker aber dennoch leistungsstarker HTML-Editor für MacOS. Mit dem Tool lässt sich der Quellcode von HTML-Seiten, CSS-Dateien etc. ansehen und bearbeiten. Außerdem unterstützt der HTML-Editor auch Programmquellcode von etwa 50 Programmiersprachen – darunter beispielsweise Python, Ruby oder Perl.
Der Schwerpunkt bei CotEditor liegt jedoch eher auf der einfachen Handhabung. Das Tool bietet eine Autovervollständigung für Codezeilen, Syntax-Highlighting, Themes, Auto-Backups, Suchen-und-Ersetzen-Funktionen und vieles mehr im typischen Look-and-Feel einer Mac-Anwendung.
Der HTML-Editor ist Open Source und steht kostenlos für MacOS zum Downloaden auf der GitHub-Seite sowie im Mac App Store bereit.
CodeLobster
CodeLobster gesellt sich zu der Reihe von HTML-Editoren, die als IDE (Integrierte Entwicklungsumgebung) konzipiert wurden. Mit dem Programm lssen sich PHP-, HTML-, CSS- und JavaScript-Projekte umsetzen.
Der Editor mit den Standardfunktionen ist kostenlos. Er bietet Code-Vervollständigung, einen leistungsfähigen PHP-Debugger, Code-Validator, dynamische Hilfe-Funktionen sowie weitere Features, die bei der Entwicklung behilflich sein können.
Die Standard-Version des HTML-Editors kann kostenlos heruntergeladen werden. Darüber hinaus gibt es eine Professional version, die unter anderem Unterstützung von CSS Frameworks, Code-Snippets, FTP- und SQL-Funktionen etc. bietet.
PhpStorm Editor
PhpStorm ist eine integrierte Entwicklungsumgebung für PHP, die vom tschechischen Unternehmen JetBrains erstellt wurde. Die Entwickler haben eine ganze Reihe an Software- und Programmiertools im Angebot.
Bei PhpStorm handelt es sich um einen Editor, mit dem sich neben PHP auch HTML- und JavaScript-Dateien bearbeiten lassen. Durch die Live-Edit-Funktion lassen sich die Auswirkungen von Änderungen direkt am Bildschirm verfolgen. Zudem gibt es Formatierungs-Tools für den Code, unterstützende Navigationshilfen, Debugging-Tools und weitere smarte Funktionen.
Der HTML-Editor darf 30 Tage lang kostenlos genutzt werden. Danach kann man sich zwischen einer jährlichen oder monatlichen Lizenzgebühr mit unterschiedlichen Preisstaffelungen entscheiden.
Komodo IDE
Komodo IDE stellt ebenfalls eine integrierte Entwicklungsumgebung dar, die Sprachen wie Python, PHP, Perl, Golang, Ruby und mehr unterstützt. Aber auch mit HTML, CSS und JavaScript kommt dieser HTML-Editor zurecht.
Bereits bei der Installation kann man sich für ein passendes Theme entscheiden. Der HTML-Editor bietet Komfortfunktionen wie Syntaxhervorhebung, Autovervollständigung für Tags sowie Unterstützung für Versionskontrolle bei Git, Mercurial, Subversion, CVS, Perforce und Bazaar. Darüber hinaus stehen Add-Ons zur Erweiterung der Funktionen zur Verfügung.
Im Rahmen der „ActiveState Platform“ kann die Software kostenlos genutzt werden. Zum Starten des HTML-Editors ist eine Registrierung beim Entwickler erforderlich. Die Software steht für Windows, Mac und Linux zum Downloaden bereit.
Vim
Vim ist eine Weiterentwicklung des Editors „Vi“, der 1991 von Bram Moolenaar veröffentlicht wurde. Der Texteditor richtet sich eher an versierte Programmierer und Coder. Unter denen ist VIM auch besonders beliebt. Platz 5 nimmt das Tool beim Ranking der Entwicklungsumgebungen ein.
Die Software funktioniert auf jedem Terminal. Sie bietet allerdings auch eine grafische Benutzeroberfläche zum Interagieren an. Dementsprechend lassen sich unterschiedliche Modi für verschiedene Tätigkeiten nutzen.
Unterstützt werden außerdem sogenannte „rechts-nach-links-Schriften“ und Multibytetexte – also Sprachen mit Zeichen, die aus mehr als einem Byte bestehen wie beispielsweise Chinesisch, Japanisch oder Koreanisch.
Der Editor bietet eine Autovervollständigung, Texthervorhebungen, Erkennung von Dateiformaten, Verlaufsspeicher und mehr. Vim unterstützt außerdem die Aufnahme von Makros. Die Editieraktionen lassen sich auf diese Weise beliebig oft für wiederholende Aufgaben nutzen.
Der HTML-Editor ist Open Source und für viele Betriebssysteme erhältlich. Die Software kann kostenlos für AmigaOS, Atari MiNT, BeOS, DOS, MacOS, NextStep, OS/2, OSF, RiscOS, SGI, UNIX, VMS, Win16 + Win32 (Windows95/98/00/NT), FreeBSD und Linux heruntergeladen werden.
Mein bester Code-Editor ist Codelobster – http://www.codelobster.com
Klasse Beitrag zu HTML Editoren!
Cheers Artem von ardu-digital