Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Dieter Petereit 5. Juli 2018

Kostenlose HTML-Editoren: Die 16 Besten für Webentwickler unter Windows

Webdesigner und Webentwickler, die mit Windows arbei­ten, fin­den durch­aus eini­ge kos­ten­lo­se HTML-Editoren vor. Nur, wel­cher eig­net sich und wel­cher eher nicht. Wir sagen es dir.

Der HTML-Editor ist ein unver­zicht­ba­res Werkzeug, des­halb wäh­le wei­se

Wer Webseiten ent­wi­ckeln möch­te, braucht einen HTML-Editor. Sicherlich kannst du auch mit Hilfe des Windows-Notepad eine Webseite erstel­len – schön und kom­for­ta­bel geht indes anders. Besonders wich­tig bei einem HTML-Editor sind eine gute Einfärbung der Syntax – auch Syntax-Highlighting genannt – und eine brauch­ba­re Code-Vervollständigung.

Natürlich wäre das ein oder ande­re Extra gut, zum Beispiel eine Auswahl an Themes für den Editor, damit du dir die Optik des Tools, das du gan­zen Tag vor Augen hast, etwas gefäl­li­ger gestal­ten kannst. Das kommt dem eige­nen Individualismus ent­ge­gen und, vor­aus­ge­setzt man wählt ein geeig­ne­tes Design, erlaubt ermü­dungs­freie­res Arbeiten über län­ge­re Zeit.

Schauen wir ein­fach mal vor­ur­teils­frei auf unse­re Auswahl der bes­ten kos­ten­lo­sen HTML-Editoren für Windows.

Visual Studio Code

Visual Studio Code von Microsoft

Visual Studio Code ist ein kos­ten­lo­ser HTML-Editor aus dem Hause Microsoft. Auch in der Vergangenheit hat sich Microsoft schon häu­fig durch kos­ten­lo­se Webentwickler-Varianten ihrer Werkzeuge für den pro­fes­sio­nel­len Entwickler her­vor­ge­tan. Leider waren die so ent­stan­de­nen Tools bis­lang eher für den Hobby-Anwender und dort nicht mehr als ein akzep­ta­bler Kompromiss.

Erst mit Visual Studio Code zei­gen die Redmonder ein ernst­zu­neh­men­des Produkt, dass sich inner­halb kür­zes­ter Zeit eine Fangemeinde erar­bei­ten konn­te, die den bis­he­ri­gen Liebling Sublime Text fast schon ver­ges­sen lässt. Visual Studio Code gibt es nicht nur für Windows, son­dern auch für macOS und sogar für Linux. Damit kannst du platt­form­über­grei­fend mit dem glei­chen Komfort und Funktionsumfang arbei­ten.

VS Code kann mit Extensions bequem funk­tio­nal erwei­tert wer­den. Optische Veränderungen führst du über Themes her­bei, von denen es eben­falls eine brei­te Vielfalt gibt. VS Code arbei­tet direkt mit Github zusam­men und bie­tet nicht nur ein außer­or­dent­lich gutes Syntax-Highlighting für diver­se Sprachen, son­dern auch eine fort­ge­schrit­te­ne Variante der Code-Vervollständigung. Bei der Arbeit mit VS Code habe ich mich schon häu­fig gewun­dert, wie­so Microsoft die­ses Produkt kos­ten­los abgibt. Aber, wol­len wir uns mal nicht beschwe­ren.

VS Code unter­liegt einem vier­wö­chi­gen Update-Turnus. Die Changelogs sind Monat für Monat umfang­reich. Das Produkt wird mas­siv fort­ent­wi­ckelt, wobei Wünsche der Nutzergemeinde ernst­haft ein­be­zo­gen wer­den. Neben den opti­schen und funk­tio­nel­len Erweiterungsmöglichkeiten, wird bei VS Code auch die Unterstützung der Verwender nicht ver­nach­läs­sigt. So steht dir eine umfas­sen­de Dokumentation zur Verfügung und auch die belieb­ten Tutorial-Videos haben die Redmonder am Start.

Link zur Website mit Download

Atom

Atom.io

Beim kos­ten­lo­sen HTML-Editor Atom ist der Name Programm. Denn Atom ist voll­stän­dig modu­lar auf­ge­baut. Um einen mini­mal gro­ßen Programmkern grup­pie­ren sich Open-Source-Kontributionen in rau­en Mengen. Sogenannte Packages sind das, die den Funktionsumfang des Tools aus dem Hause Github fast belie­big erwei­tern kön­nen.

Vom Start weg unter­stützt Atom Node.js so weit­ge­hend, dass du sogar eine Node-Instanz direkt aus Atom star­ten kannst. Atom arbei­tet direkt mit Gibthub zusam­men, so dass die Arbeit mit Versionskontrolle naht­los mög­lich ist. Weitere Features rüs­test du über die bereits erwähn­ten Packages nach, die du im Übrigen auch selbst erstel­len und der Communitly zur Verfügung stel­len kannst.

Seit kur­zem ste­hen für Atom zwei bahn­bre­chen­de Packages bereit, die beson­ders für Entwickler sehr inter­es­sant sein wer­den. Atom kann näm­lich neu­er­dings fast zu einer ech­ten IDE aus­ge­baut wer­den. Damit bist du dann in der Lage, kom­plet­te Projekte zu ver­wal­ten, um etwa fest­zu­stel­len, wel­che Variable wo im Projekt noch vor­han­den ist etc. Zusätzlich lässt sich die IDE mit Sprach-Packages zu jeder belie­bi­gen Programmiersprache befä­hi­gen.

Atom steht für Windows, macOS und LInux zur Verfügung und erfreut sich eben­falls einer sehr regen Fortentwicklung.

Link zur Website mit Download

Bluefish

Bluefish: Programmfenster

Der Editor Bluefish ist ein Open-Source-Projekt unter der GNU/GPL-Lizenz und damit wirk­lich kom­plett frei und ohne Kosten zu jedem Zweck ver­wend­bar. Bluefish wird maß­geb­lich ent­wi­ckelt und koor­di­niert vom Niederländer Olivier Sessink, der sich mit etli­chen Publikationen einen Namen als Experte für die Programmierung siche­rer Computeranwendungen gemacht hat.

Bluefish ist nicht nur ein rei­ner Texteditor mit Unterstützung für Dutzende von Sprachen, dar­un­ter selbst­ver­ständ­lich HTML nebst Syntaxhervorhebung, son­dern bie­tet weit mehr. Das Tool kann Projekt ver­wal­ten und typi­sche Projektaufgaben, wie über­grei­fen­des Suchen und Ersetzen, aus­füh­ren. Der Editor ist in der Lage, Seiten auch ent­fernt zu bear­bei­ten und unter­stützt zu die­sem Zweck eine gan­ze Reihe gän­gi­ger Protokolle, dar­un­ter (S)FTP und WebDAV.

Neben der Autovervollständigung für die meis­ten unter­stütz­ten Sprachen schließt Bluefish offe­ne Tags auto­ma­tisch und sorgt auf die­se Weise für weni­ger Kopfschmerzen durch inten­si­ves Suchen. Das Bluefish-Interface kann in 17 Sprachen bedient und auf den Plattformen Windows, macOS, LInux, FreeBSD, OpenBSD und Solaris glei­cher­ma­ßen instal­liert wer­den.

Link zur Website mit Download

Phase 5

Phase5 HTML-Editor für Windows

Phase5 wird seit 1998 bestän­dig wei­ter­ent­wi­ckelt und ist einer der bekann­tes­ten kos­ten­frei­en Editoren für Windows.

Einige Features von Phase5 sind: Projektverwaltung, Tag-Vervollständigung für HTML-Befehle, ein inte­grier­ter Bildbetrachter, ein Syntax-Debugger, Umlaut-Konvertierung, ein Einrückassistent, pro­jekt­wei­tes Ersetzen von Text und benut­zer­de­fi­nier­te Menüs und Vorlagen.

Der HTML-Editor unter­stützt gän­gi­ge Formate wie PHP, Javascript, HTML, VBScript, JAVA und Pearl. Er besitzt einen Dateimanager zum schnel­len Wechsel zwi­schen den  Dokumenten. Du kannst meh­re­re Dokumente gleich­zei­tig edi­tie­ren und so wei­ter…

Phase 5 läuft unter Windows 7 und 8, Vista, XP, 2000, 98 – 32/64 Bit und auch Server-Versionen.

Link zur Website mit Download

Programmer’s Notepad

programmers-notepad

Das Programmer’s Notepad bie­tet schon mal eine etwas moder­ne­re Oberfläche und kommt mit zwei Themes daher, einem hel­len und dem abge­bil­de­ten dunk­len. Neben Syntax Highlighting beherrscht der Editor den Umgang mit Code Snippets, bie­tet Code Folding (ein Ein- und Ausfalten von Code zur bes­se­ren Übersicht) und ist über PyPN-Scripting und die Nutzung von Add-Ons voll­stän­dig auf die eige­nen Bedürfnisse anpass­bar.

Link zur Website mit Download

SynWrite

SynWrite HTML-Editor für Windows

SynWrite ist ein ganz spe­zi­el­ler Editor mit einer gro­ßen Funktionsvielfalt. Die Idee hin­ter SynWrite war die Vereinigung der guten Ansätze aller auf dem Markt erhält­li­che Editoren in einem Einzigen – und so liest sich auch die Feature-Liste. Dabei lässt sich der Editor jeder­zeit mit eige­nen Plugins – in Phyton geschrie­ben – erwei­tern. Neben den übli­chen Funktionen wie Code-Folding und Auto-Vervollständigung beherrscht SynWrite zum Beispiel auch Multiple-Carrets, sie­he Animation:

MCarets

Diese Funktion kann sich als sehr zeit­spa­rend erwei­sen. Zudem beherrscht SynWrite  das wich­ti­ge Emmet (ehe­mals Zen Coding).

Link zur Website mit Download

PlainEdit.NET

PlainEdit.Net

PlainEdit kann meh­re­re Dateien in Tabs öff­nen, ist eben­falls über Plugins erwei­ter­bar und bie­tet eine Menge Funktionen, dar­un­ter Dokument- und Textvorlagen. Über eine Seitenleiste kön­nen Snippets (Vorlagen, Codeteile oder sons­ti­ge Texte) schnell und ein­fach ein­ge­fügt wer­den. Zudem ver­fügt PlainEdit über eine gute “Suchen und Ersetzen”-Funktion von Texten mit regu­lä­ren Ausdrücken – auch in nicht geöff­ne­ten Dateien. Als Besonderheit soll­te erwähnt wer­den, dass der Editor sogar von einem USB-Stick betrie­ben wer­den kann. PlainEdit ist in einer deut­schen Übersetzung vor­han­den.

Link zur Website mit Download

Notepad++

Notepad++ HTML-Editor für Windows

Notepad++ ist so etwas wie der Klassiker in unse­rer Übersicht. Entstanden ist er aus der Situation, dass der bei Windows mit­ge­lie­fer­te Editor bereits extrem in die Jahre gekom­men war und wich­ti­ge Funktionen nicht bie­tet.

Notepad++ ver­mag meh­re­re Dateien in Tabs zu öff­nen, bie­tet Code-Vervollständigung und gutes Syntax-Highlighting. Ein Makro-Rekorder, mit dem sich häu­fig wie­der­keh­ren­de Befehle auto­ma­ti­sie­ren las­sen, ist eben­falls an Bord. Die Oberfläche ist an per­sön­li­che Bedürfnisse anpass­bar und es ste­hen eine Menge Plugins zur Erweiterung des Featureset zur Verfügung.

Link zur Website mit Download

NoteTab

NoteTab: Hauptfenster

NoteTab ent­stammt der Softwareschmiede Fookes Ltd. aus der Schweiz und gehört eben­falls zu den Urgesteinen in der Branche der Netz-Editoren. Schon seit den Neunzigern nut­zen über­zeug­te Kunden, dar­un­ter die Harvard-Universität und das MIT, den HTML-Editor aus den Bergen.

NoteTab ist ein rei­ner Editor, gemacht für die Bearbeitung von HTML, XML und CSS. Er ver­steht sich als Fortentwicklung des bekann­ten NotePad aus Windows und steht auch aus­schließ­lich für die Windows-Plattform zur Verfügung. Natürlich kannst du auch JavaScript oder PHP mit NoteTab schrei­ben, als rei­ner Text-Editor legt dir die Software da kei­ne Steine in den Weg. Sie unter­stützt dich aller­dings auch nicht wei­ter dabei, etwa mit Syntax-Highlighting oder Code-Bibliotheken.

NoteTab ist in sei­ner Light-Version kos­ten­los, bie­tet aber in der Bezahlvariante für 39,95 Euro deut­lich mehr Funktionen. Dabei fehlt in der Light-Version eigent­lich nur eine Funktion rela­tiv schmerz­lich, näm­lich die Syntax-Hervorhebung für HTML und CSS.

Ansonsten bie­tet NoteTab Light sogar die Einbindung von Twitters Bootstrap, Autocomplete, Code-Bibliotheken oder Projekt-Templates ohne Griff ins Portemonnaie des Users. Das Anlegen und Verwalten dei­ner eige­nen Codeschnipsel-Sammlung kos­tet eben­falls kein Geld.

Die Entwickler von NoteTab legen gro­ßen Wert auf maxi­ma­le Kompatibilität, so dass die Software selbst in der aktu­el­len Version immer noch auf Windows XP lauf­fä­hig ist. Daraus resul­tiert, dass du auf den opti­schen Genuss moder­ner Interface-Komponenten lei­der ver­zich­ten musst.

Link zur Website mit Download

PSPad

PSPad: Hauptfenster

Der Entwickler Jan Fiala aus der tsche­chi­schen Republik pflegt sein kos­ten­lo­ses Tool PSPad mitt­ler­wei­le seit 2001. Im April 2018 gab es das bis dato letz­te Update auf die Version 5.0. Nicht ohne Selbstbewusstsein bezeich­net er PSPad als den ulti­ma­ti­ven Editor für Softwareentwickler und sicher­lich braucht sich der Leistungsumfang des schlan­ken Helfers nicht vor kos­ten­pflich­ti­gen Alternativen zu ver­ste­cken.

PSPad unter­stützt sehr vie­le Programmiersprachen, eben­so wie die Auszeichnungssprachen HTML und CSS. Das Syntax-Highlighting wird durch­gän­gig geleis­tet und kann zudem nach eige­nem Belieben ange­passt oder erwei­tert wer­den. Mit einem ein­fa­chen Tastendruck lässt du dir eine HTML-Vorschau anzei­gen. Das ist natür­lich kom­for­ta­bel. Dabei sind die Fähigkeiten des Programms nicht auf ein­zel­ne Dateien begrenzt.

Vielmehr ver­steht sich PSPad als Projekt-Entwicklungsumgebung und beherrscht als sol­che auch das Suchen und Ersetzen von Code-Stellen über meh­re­re Dateien hin­weg, sowie das Vergleichen ver­schie­de­ner Dateiversionen mit farb­li­cher Kennzeichnung der Unterschiede.

Eine Plugin-Schnittstelle erlaubt es exter­nen Entwicklern, die Leistungsfähigkeit des PSPad zu erwei­tern. An die­ser Stelle fin­dest du eine gan­ze Reihe ent­spre­chen­der Extensions. Wenn du das Tool zum Verfassen von Webseiten-Inhalten ver­fasst, wird es dich freu­en, dass es eine deutsch­spra­chi­ge Rechtschreibprüfung gibt. Ein FTP-Client gehört eben­falls zum Lieferumfang.

PSPad gibt es exklu­siv für das Windows-Betriebssystem. Das Programm ist kos­ten­frei. Es exis­tiert auch kei­ne leis­tungs­stär­ke­re, dann kos­ten­pflich­ti­ge Version.

Link zur Website mit Download

jEdit

jEdit - HTML-Editor für Windows

jEdit kann so ziem­lich jede erdenk­li­che Datei öff­nen, bear­bei­ten und die Syntax ent­spre­chend ein­fär­ben. Das Öffnen meh­re­rer Dateien als Tabs ist eben­falls mög­lich und erleich­tert die Arbeit an einem Projekt unge­mein. Nicht vor­han­de­ne Optionen kön­nen mit­tels Plugins ergänzt wer­den.

jEdit beherrscht aber schon im Auslieferungszustand etli­che wich­ti­ge Funktionen, dar­un­ter Code-Folding, das Markieren zusam­men­hän­gen­der Elemente und Tags, einen Dateimanager und eine gute “Suchen und Ersetzen”-Funktion. Hinzu kommt die Möglichkeit, den Editor anzu­pas­sen und zu erwei­tern, so dass sich jEdit durch­aus nicht hin­ter dem Wettbewerb zu ver­ste­cken braucht.

Link zur Website mit Download

Sublime Text 2 – Das Schweizer Taschenmesser

Sublime Text 2 HTML-Editor für Windows

Kein ande­rer HTML-Editor hat jemals einen sol­chen Siegeszug erlebt wie Sublime Text 2. Innerhalb kür­zes­ter Zeit nach Release erober­te er die Sympathien der pro­fes­sio­nel­len Webentwickler. Das liegt nicht zuletzt an der Tatsache, dass er für Windows, macOS und Linux glei­cher­ma­ßen ver­füg­bar ist.

Seine Stärke ist die Anpassbarkeit durch Erweiterungen und per JSON-Datei vor­zu­neh­men­de Benutzereinstellungen. Grundsätzlich gibt es kaum eine denk­ba­re Anforderung, die man nicht durch Einstellen oder Erweitern zufü­gen könn­te.

Mit Hilfe des “Packet Managers” – der instal­liert wer­den muss – kön­nen im Anschluss sehr kom­for­ta­bel Erweiterungen her­un­ter­ge­la­den und instal­liert wer­den.

Bedingt durch die hohe Verbreitung des Editors gibt es mitt­ler­wei­le eine umfas­sen­de Plugin-Bibliothek; dazu etli­che Plugins, die auf den Websites der Entwickler ange­bo­ten wer­den.

Übrigens hat kaum ein ande­rer HTML-Editor eine so gute und umfas­sen­de (inof­fi­zi­el­le) Dokumentation. Auch Tutorials für Sublime Text 2 wer­den im Internet zuhauf ange­bo­ten, was die erfor­der­li­che Einarbeitungszeit deut­lich ver­kürzt.

Sublime Text 2 ist nicht kos­ten­frei. Allerdings kann der Editor unbe­grenzt eva­lu­iert (getes­tet) wer­den. Bei Gefallen soll­test du der Fairness hal­ber eine Lizenz für 70.- USD erwer­ben.

Seit Ende September 2017 ist Sublime Text offi­zi­ell in der fina­len Version 3 erhält­lich. Aufgrund der jah­re­lang ver­schlepp­ten Entwicklung und der man­geln­den Kompatibilität zu Version 2 hat Sublime Text indes stark an Zustimmung und somit auch an Bedeutung ver­lo­ren. Es bleibt abzu­war­ten, wohin die Reise geht. Ich wür­de der­zeit den Umstieg auf Visual Studio Code oder Atom emp­feh­len, zumal die bei­den genann­ten kos­ten­los sind.

Link zur Website mit Download 

Brackets

brackets-editor-mit-psd-funktion

Brackets ist ein moder­ner, quell­of­fe­ner Editor mit eini­gen inter­es­san­ten Funktionen. Zum Beispiel kann er in Zusammenarbeit mit der Adobe Creative Cloud Extract (= Vorschau) Designdaten wie Farbe, Schriftarten, Verläufe und ähn­li­ches direkt aus einer PSD-Datei lesen und in kor­rek­ten CSS-Code umset­zen. Ebenso las­sen sich Ebenen als Bild extra­hie­ren, Informationen aus der PSD als Variable in einem Präprozessor nut­zen und bequem Abstände und Proportionen von Elementen ermit­teln. Das alles ist mög­lich, ohne den Editor ver­las­sen zu müs­sen.

Bitte beach­ten: Die Nutzung der Adobe Creative Cloud ist kos­ten­pflich­tig. Die Extract-Version kann direkt gemein­sam mit Brackets instal­liert wer­den. Da Brackets Teil der Creative Cloud ist, steht er für Windows und macOS glei­cher­ma­ßen zur Verfügung.

Ein wei­te­rer gro­ßer Pluspunkt an Brackets sind die Erweiterungen, mit denen der Editor auf die eige­nen Bedürfnisse ange­passt wer­den kann. Alle drei bis vier Wochen sol­len neue Erweiterungen dazu­kom­men. Erwähnt wer­den will auch die voll­stän­di­ge Unterstützung von Präprozessoren.

In Brackets kannst du “Schnelles Bearbeiten” sowie “Live-Vorschau” sogar zusam­men mit LESS- und SCSS-Dateien ver­wen­den, was das Arbeiten damit wesent­lich ver­ein­facht. Zusammen mit den rich­ti­gen Erweiterungen und der Adobe Creative Cloud Extract kann die­ser Editor damit die Bedürfnisse von Profis abde­cken.

Link zur Website mit Download

Komodo Edit

Komodo Edit im klei­nen Schwarzen.

Aus dem Hause ActiveState stammt der freie Quelltext-Editor Komodo Edit, eine abge­speck­te Variante der kos­ten­pflich­ti­gen Entwicklungsumgebung Komodo IDE. Komodo IDE ist eine der leis­tungs­fä­hi­ge­ren Entwicklungsumgebungen für Programmierer. Die hat ihre Stärken beson­ders im Bereich der Entwicklung nati­ver Apps durch die INtegration mit Cordova und PhoneGap, aber auch Webentwickler wer­den durch die Integration mit Gulp, Grunt, Yarn oder npm opti­mal unter­stützt.

All das bie­tet Komodo Edit nicht. Das Tool ist tat­säch­lich ein rei­ner Editor, der sich in ver­schie­de­nen Sprachen bedie­nen lässt und nur die wich­tigs­ten Features, etwa Syntaxhighlighting und Autovervollständigung an Bord hat. Auch in der frei­en Version bie­tet Komodo bereits die Projektverwaltung, so dass die Arbeit an dei­ner Website nicht all­zu müh­se­lig wird.

Komodo Edit liegt aktu­ell in der Version 11.1 vor und steht für Windows, macOS und LInux glei­cher­ma­ßen zum kos­ten­lo­sen Download bereit.

Link zur Website mit Download

Aptana Studio 3

Aptana Studio 3 HTML-Editor für Windows

Das Aptana Studio in der aktu­el­len Version 3 ist eine der bekann­tes­ten und umfas­sends­ten Entwicklungsumgebungen für Windows, Mac und Linux. In Version 3 wol­len die Entwickler auch eine der größ­ten Schwachstellen des Aptana Studios besei­tigt haben, näm­lich sei­ne zum Teil extrem unbe­frie­di­gen­de Performance.

Die größ­ten Stärken des Editors sind sei­ne gute Anpassbarkeit und vor allem die Git-Integration sowie das ein­ge­bau­te Terminal. Aptana Studio 3 unter­stützt die neu­es­ten Webstandards wie HTML5 und CSS3. Für Ruby und JavaScript bie­tet Aptana einen inte­grier­ten Debugger an.

Link zur Website mit Download

Arachnophilia

Arachnophilia ist eine Java-Anwendung.

Arachnophilia, aus der Feder des Washingtoners Paul Lutus, ist inso­fern inter­es­sant, als es neben den funk­tio­na­len auch mora­li­sche Aspekte zur Schau trägt. Lutus erstell­te aus dem eins­ti­gen Windows-Programm Arachnophilia in den letz­ten Jahren eine rein auf Java basie­ren­de Version, die uni­ver­sell auf allen Betriebssystemen mit Java- Runtime funk­tio­niert, weil er Microsoft nicht mehr unter­stüt­zen will. Er geht sogar so weit, zum Boykott von Microsoft-Produkten auf­zu­ru­fen.

Arachnophilia ist nicht ein­fach Open Source, son­dern nach Lutus Definition Careware. Voraussetzung für die Nutzung ist es, dass du auf­hörst zu “heu­len” und dir bewusst wirst, wie schön das Leben eigent­lich ist. Doch, das meint Lutus ernst.

Funktional bie­tet Arachnophilia Hausmannskost. Das unver­zicht­ba­re Autocomplete ist aller­dings eben­so an Bord wie eine ansehn­li­che Syntax-Hervorhebung. Das Tool ist in ers­ter Linie für die Webentwicklung kon­zi­piert, unter­stützt jedoch auch gän­gi­ge Programmiersprachen ande­rer Couleur.

Für Windows exis­tiert ein Installationsprogramm, alle ande­ren Nutzer müs­sen das JAR-Archiv ver­wen­den. Wer Java-Anwendungen kennt, weiß, dass die Performance nicht zum Rasantesten gehört, was in der frei­en Wildbahn anzu­tref­fen ist. Wer aber dem mora­li­schen Ansatz des Lutus fol­gen will, kommt kaum an Arachnophilia vor­bei.

Link zur Website mit Download

CoffeeCup

CoffeeCup Html-Editor

CoffeeCup ist ein wei­te­res Produkt, dass es in einer kos­ten­lo­sen und in einer kos­ten­pflich­ti­gen Version gibt. CoffeeCup Free ist ein rei­ner Code-Editor für HTML, Markdown und CSS. Er bie­tet Syntaxhighlighting und Autovervollständigung, sowie den inte­grier­ten Datentransfer auf dei­ne Website per FTP.

Codeschnipsel ver­wal­test du in einer ent­spre­chen­den Bibliothek. Content, den du auf meh­re­ren Seiten dei­ner Website ver­wen­dest, spei­cherst du in der Components Library. Von hier aus kannst du die Inhalte zen­tral aktua­li­sie­ren. Zudem kennt CoffeeCup hun­der­te von Polyfills und JavaScripts, um die Kompatibiltät zu älte­ren Browsern sicher­zu­stel­len.

Das Tool kennt auch in sei­ner kos­ten­lo­sen Version bereits die Verwaltung von Webseiten als Projekt. Die ent­spre­chen­den Abhängigkeiten prüft es aller­dings erst in der kos­ten­pflich­ti­gen Variante, die mit 49 US-Dollar nicht über­mä­ßig hoch bepreist ist. Hier fin­dest du dann wei­te­re Annehmlichkeiten, wie etwa die Validierung oder Bereinigung von Code, sowie den unkom­pli­zier­ten Einbau von Fonts oder Mediendateien.

Über den HTML-Editor hin­aus bie­tet CoffeeCup ein gan­zes Universum wei­te­rer Produkte an. So gibt es auch einen WYSIWYG-Editor mit einer Vielzahl kos­ten­pflich­ti­ger Erweiterungen. Hier kannst du schnell ein paar Hundert US-Dollar aus­ge­ben. Leider wird CoffeeCup im Netz viel­fach als kos­ten­lo­ser WYSIWYG-Editor bezeich­net. Das ist eine Falschaussage, Fake News ;-)

Die CoffeeCup-Produktpalette gibt es aus­schließ­lich für die Windows-Plattform.

Link zur Website mit Download

Du willst auf keinen Fall coden? Dann schau dir Mobirise an

Der Begriff HTML-Editor wird auch von jenen ver­wen­det, die dir damit das Editieren von HTML gar nicht erlau­ben, son­dern dir statt­des­sen eine visu­el­le Umgebung für das Webdesign bie­ten. Solltest du ent­spre­chend auf die­sem Beitrag gelan­det sein, weil du genau einen sol­chen suchst, wirst du inzwi­schen gemerkt haben, dass du am fal­schen Ort bist. Damit du uns nicht kom­plett frus­triert wie­der ver­lässt, will ich dich mit einem Werkzeug bekannt machen, das genau die Fähigkeiten hat, die du suchst.

Mobirise ist eben­falls ein Editor, den du auf dei­ner Festplatte instal­lie­ren musst, er lässt dich aber Seiten nur visu­ell gestal­ten. An den Code kommst du gar nicht ran. Dabei ist Mobirise extrem per­for­mant und ein­fach zu bedie­nen. Wenn du eine respon­si­ve Website schnell benö­tigst, soll­test du dir den kos­ten­lo­sen Editor Mobirise auf jeden Fall näher anse­hen. Er steht für Windows und macOS zur Verfügung.

Fazit

Es gibt eine Menge HTML-Editoren für Windows, doch die guten sind rarer gesät. Für den nicht-täg­li­chen Gebrauch bie­tet sich Notepad++ an, für den täg­li­chen Gebrauch eines pro­fes­sio­nel­len Webentwicklers wird die­ser nicht rei­chen. Da gibt es pro­fes­sio­nel­le­re Lösungen, wie zum Beispiel Sublime Text 2, wel­cher umfas­send an per­sön­li­che Bedürfnisse ange­passt wer­den kann (aber auch muss).

Fans von schlüs­sel­fer­ti­gen Lösungen wer­den womög­lich eher mit Aptana, SynWrite oder Programmer’s Notepad glück­lich. Ich set­ze seit eini­ger Zeit auf Visual Studio Code. Das wird Paul Lutus gar nicht ger­ne hören. Was setzt du ein?

Übrigens: für Mac-Nutzer haben wir einen eige­nen Beitrag zum Thema geschrie­ben. Diesen fin­dest du hier »

 Links zum Beitrag

  1. Visual Studio Code
  2. Atom
  3. Phase5 HTML-Editor
  4. Bluefish
  5. Programmer´s Notepad
  6. SynWrite Editor
  7. PlainEdit.NET
  8. Notepad++
  9. NoteTab
  10. jEdit HTML-Editor
  11. Sublime Text 2
  12. Adobe Brackets
  13. Komodo Edit
  14. Aptana Studio 3
  15. Arachnophilia
  16. CoffeeCup
  17. Mobirise

Dieser Beitrag wur­de am 15. Januar 2015 erst­ver­öf­fent­licht und wird seit­dem regel­mä­ßig aktua­li­siert, zuletzt am 05. Juli 2018.
(Quelle Artikelbild: Depositphotos)

Dieter Petereit

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design.

32 Kommentare

  1. Danke fuer die Hinweise und Tipps!

  2. Servus,
    ich erstel­le ledig­lich Hobby-Webseiten und agie­re dabei aus­schliess­lich mit WYSIWYG Editoren. Das fin­de ich unkom­pli­ziert und kom­for­ta­bel, und ich muss mich dabei nicht von unver­än­der­ba­ren “Themes” ein­engen las­sen.
    War mein Werkzeug in den 90-ern noch “NetObjectsFusion” (auf einem 500mb PC mit WIndows 3,0), als Dreamweaver auf den Markt kam, wech­sel zu Makromedia so bin ich bei der MS Software Frontpage gelan­det und auch geblie­ben, weil sie auf mei­nem heu­ti­gen Rechner immer noch zuver­läs­sig arbei­tet.

    Das mag für vie­le viel­leicht ein wenig “old­school” sein, aber ich lie­be es .…

  3. Sehr aus­führ­li­che Zusammenstellung, da ist für jeden etwas dabei.
    Meine ers­te Webseite habe ich mit Phase 5 erstellt und dabei gleich­zei­tig Webentwicklung gelernt. Dann bin ich auf WordPress umge­stie­gen, da die Welt dort ein­fa­che­rer für nor­ma­le Blogs ist.
    Aktuell ver­wen­de ich für ein HTML-Projekt Brackets und bin damit zufrie­den
    Für Lokale Arbeiten, ohne alles hoch­la­den zu müs­sen, nut­ze ich dabei Xampp.
    Sublime Text 2 hat­te ich nur kurz aus­pro­biert, wer­de es mir jetzt aber noch ein­mal aus­gie­big anschau­en.

  4. Nutze eben­falls nur Notepad++, wie schon in den Kommentaren vor mir geschrie­ben, ist das Tool unver­zicht­bar für alle die was mit css, html oder php machen, weil man ganz ein­fach und farb­lich die Struktur ange­zeigt bekommt.

  5. EditPlus fehlt lei­der – der ist so schön schlank und anpass­bar…

  6. Vielen Dank Herr Petereit für die­sen umfas­sen­den Artikel. Gerade weil sie im letz­ten Absatz noch einen rein visu­el­len Editor erwähnt haben, wür­de ich Pinegrow als Hybriden, der sowohl per Drag and Drop als auch per inte­grie­tem Code Editor arbei­ten lässt, nicht uner­wähnt las­sen.

  7. Vielen Dank für die Auflistung. Ich bin tat­säch­lich gera­de auf der Suche und arbei­te zur­zeit mit Notepad++ aber über­le­ge die gan­ze Zeit ob ich mir einen kos­ten­pflich­ti­gen Editor anschaf­fe. Ich hat­te Dreamweaver bzw. die Adobe Creative Cloud ins Visier genom­men. Oder gibt es da ver­gleich­ba­re kos­ten­lo­se Lösungen zu?

    • Als kos­ten­pflich­ti­ge Alternative kann ich WebStorm (bzw für PHP Entwicklung dann PhpStorm) von Jetbrains emp­feh­len. Kannst ja mal 30 Tage kos­ten­los schau­en obs dir gefällt. Sonst fin­de ich VisualStudio Code als kos­ten­lo­se Alternative gut, hat auf jeden Fall mehr Komfort als Notepad++

      • Kostenpflichtige Alternativen sind kei­ne Mangelware. Meiner Meinung nach braucht es aller­dings für die HTML-Entwicklung mit rei­nem Code kei­ne kos­ten­pflich­ti­ge Variante.

  8. Phase5 kann aber nach wie vor kein “UTF-8 ohne BOM” – rich­tig? Deshalb bin ich auf Notepad++ umge­stie­gen. Mit sinn­vol­len Erweiterungen wie dem Datei-Explorer und WebEdit ist das ein sehr leis­tungs­fä­hi­ges Werkzeug für HobbyanwenderInnen. Die Suche-(und Ersetzen-)Funktion lässt kei­ne Wünsche offen und dass es das Ganze auch noch “für unter­wegs” gibt, ist das Sahnehäubchen.

    Wer Wert auf gutes Werkzeug legt und dabei auf über­flüs­si­gen Schnickschnack ver­zich­ten kann, ist mit Notepad++ aller­bes­tens ver­sorgt.

  9. Gestartet habe ich mit Notpad++. Als dann PHP dazu­kam, bin ich auf Aptana Studio 3 umge­stie­gen, wel­ches ich zusam­men mit XAMPP sehr lan­ge ver­wen­det habe. Aktuell nut­ze ich Visual Studio Code und einen Buildprozess zusam­men mit Browsersync.io

  10. Diese gra­tis-Editoren sind ja schön und recht. Hab grad den pha­se 5.6 instal­liert. Was mir am meis­ten fehlt, ist ein wisi­wig-Editor mit Live-Vorschaufenster. Ich arbei­te­te vie­le Jahre mit Macromedia Dreamweaver MX6, wo ich z.B. Bilder ein­fach in die Tabelle zie­hen kann. Doch jetzt ist mei­ne Lizenz futsch und lässt sich unter Win7-64bit nicht mehr instal­lie­ren.
    –> Gibt es auch unter den Gratiseditoren (oder auch Low-Cost) eine ver­gleich­ba­re Alternative? M-D kann man sich ja nicht mehr leis­ten als Hobby Designer…

    • Klare und unum­wun­de­ne Antwort: Nein.

      • Hallo Dieter
        Ja doch, gibt es: Hab mir (nach mei­nem post heu­te Abend) den «Microsoft Expression Web 4» instal­liert. Ist ja auch gra­tis. Und ich arbei­te schon den gan­zen Abend damit, es ersetzt bei­na­he den Dramweaver! Für mei­ne Zwecke als wisi­wig Editor reicht mir das, allen ande­ren Schnickschnack (Javascrips etc.) baue ich dann im Apdana-Studio ein. Dieses ist eh immer offen wegen mei­ner hun­der­ten PHP-Seiten.

        Also nichts für ungut für mei­ne doo­fe Anfrage. Für mich hat sich’s vor­ab erle­digt.
        Und vie­len Dank auch!

      • Ahem, Expression Web. Frontpage reani­miert.

      • Hallo Dieter

        Ohhh. ist das pein­lich. Ich hat­te das Unding vor über 15 Jahren mal benutzt: Für ein ein­fa­ches «Hello World» wur­den 70 Zeilen Overhead gene­riert. Mein M-Dreamweaver lief auch bis vor 2 Wochen, bis mir das verd… Win10 über Nacht drauf­ge­spühlt wur­de. Da ging nur die Hälfte, Rückgängig zu Win7 hats auch nicht mehr hin­ge­kriegt. Also Partition neu ange­legt und zurück auf Feld 1, alles neu inst. (Win7-64bit) – und seit dem bekomm ich den M-D nicht mehr hin.
        Aber ich hab mir jetzt eine Virtual Machine (Oracle) mit Win7-32bit ein­ge­rich­tet, und da läuft er wie­der…
        Obermühsam, man soll­te Microsoft wegen Nötigung anzei­gen!!!!

        Vielen Dank für dei­nen wert­vol­len Tipp!
        Gruss, Hugo

  11. Ich frag mich aller­dings wie­so Sublime Text 2 als kos­ten­los gelis­tet wird?

  12. Unglaublich dass hier “die bes­ten” feh­len: https://www.jetbrains.com/webstorm/

  13. Ich bin genau aus die­sem Grund von eclip­se zu net­be­ans und dann zu sub­li­me text 3 gewech­selt.

    Bei sehr gro­ßen Projekten ist das Springen zu den Deklarationen in den ers­ten zwei IDEs lang­sam, klemmt manch­mal und nervt.

    In sub­li­me text gibt es mit Goto Anywhere eine Funktion, die unglaub­lich viel Zeit spart. Ansehen und aus­pro­bie­ren!

  14. Notepad++ ist ein unver­zicht­ba­res Tool. Vor allem für klei­ne­re Projekte oder ini bzw. con­fig-Files. Bei grö­ße­ren Angelegenheiten ver­brennst du dei­ne Zeit damit, ewig und immer wie­der die Funktionen zu zu klap­pen. Das geht mit Dreamweaver um eini­ges bes­ser. Während sich mit Dreamweaver indi­vi­du­ell gan­ze Zeilen unab­hän­gig von Klammern zuklap­pen las­sen, schwä­chelt Notepad++ beim Ausblenden von HTML.

  15. Es gibt noch Atom. Geht in die Richtung von Brackets.

  16. Ach ja, und die­se Kommentarfunktion hier löscht alles raus was irgend­wie an HTML erin­nern könn­te. Dadurch wur­de mein Text oben kas­triert.

  17. Was hier nicht zu Wort kommt, das sind die Fähigkeiten der Editoren, ein kom­plet­tes Projekt zu erfas­sen, teils mit hun­der­ten oder tau­sen­den Dateien.
    Ich arbei­te bei grö­ße­ren Projekten nach wie vor ger­ne mit Eclipse. Dort zeigt es mir z.B. mit Farbhinterlegung an, wo über­all eine Variable im Dokument auf­taucht, und auch, wo in wel­chem ande­ren Dokument sie defi­niert wur­de (z.B. bei Includes).
    Solche Programme erfas­sen die Zusammenhänge in einem Projekt, das funk­tio­niert bei vie­len Editoren gar nicht oder nur rudi­men­tär.

    Und das Syntax-Higlighting gibt es auch in ver­schie­de­nen Qualitätsstufen.
    z.B. bricht ein halb­gu­ter Editor bei preg_match_all(”) ab, und zwar wegen die­sem ?>. Der Rest des Codes ist dann grau.
    Gute Editoren erken­nen die Programmfunktion.

    • Danke für den Kommentar. Sollten noch­mals HTML-Editoren vor­ge­stellt wer­den, dann legen wir auch unse­re Aufmerksamkeit auf die Projektverwaltung, dass ist eine gute Anregung.

      Ob die­se dann jedoch auch mit hun­der­ten oder gar tau­sen­den Dateien umge­hen kön­nen oder nicht, kann von uns schlecht getes­tet wer­den. Das Syntax-Highlighting kön­nen wir jedoch pro­blem­los tes­ten. Also, Anregungen sind ange­kom­men.

Schreibe einen Kommentar

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