Webkrauts Logo

Webkrauts Webkrauts Schriftzug

- für mehr Qualität im Web

CSS-Editoren im Vergleich

Wir haben noch nicht alle älteren Artikel nachbearbeitet. Das bezieht sich in der Regel nur auf die Codebeispiele, die noch nicht optimal dargestellt werden.

CSS-Editoren im Vergleich

Wer Websites programmiert, nutzt in den seltesten Fällen einen simplen Text-Editor. Spezielle Programme erleichtern Ihnen die Arbeit, indem sie zum Beispiel HTML-Tags einfärben oder Text/Code-Schnipsel in mehreren Dateien suchen und ersetzen können. Manuela Hoffmann stellt Ihnen acht Editoren vor, die speziell darauf ausgerichtet sind, Cascading Style Sheets zu bearbeiten.

Für die Entwicklung von Stylesheets lassen sich alle Text-Editoren verwenden. Komfortabler geht es natürlich mit speziellen Editoren, von denen dieser Artikel acht Programme für Windows und Mac OS X in Bezug auf ihre CSS-Fertigkeiten näher unter die Lupe nimmt. Da es wenige reine CSS-Editoren gibt, werden die heute vorgestellten Editoren auf ihre Tauglichkeit der Arbeit mit Stylesheets hin vergleichen. Nicht im Test vertreten sind Editoren, die vornehmlich auf die Entwicklung von (X)HTML oder PHP abzielen oder WYSIWYG-Editoren wie Macromedia Dreamweaver oder Adobe GoLive.

Die acht Editoren, die nebeneinander gestellt werden, sind: HTMLPad, Rapid CSS, TopStyle, StyleMaster, Simple CSS, CSSEdit, SkEdit und TextMate. Verglichen werden Eigenschaften, die für die tägliche Arbeit mit Stylesheets unerlässlich sind, wie das Suchen und Ersetzen in mehreren Dateien, FTP, Codeschnipselverwaltung, Validator-Integration, Syntax-Highlighting, Code-Vervollständigung und UTF-8-Unterstützung, die jedoch nur unter Windows eine Aufgabe darstellt.

Programme für Windows

HTMLPad

HTMLPad ist ein Editor für HTML, CSS, JavaScript und XHTML, der für den Bereich CSS schnell und umfangreich ist. Syntax-Highlighting, Code-Vervollständigung und auch die Arbeit in UTF-8 werden komplett unterstützt. Als Anwender kann man in mehreren Dateien suchen und ersetzen, ein Undo nach dem Speichern ist möglich. Vorlagen werden geliefert und können gespeichert werden. HTMLPad erlaubt es, Sites zu verwalten und Dateien per FTP zu senden. Eine Integration in Dreamweaver und Co. ist nicht vorgesehen. Leider unterstützt HTMLPad keine CSS-Tidy-Aktionen zur Säuberung und Komprimierung von Stylesheets. HTMLPad ist Shareware und kostet momentan $25.85.

Rapid CSS

Der Rapid CSS Editor ist der kleine Bruder von HTMLPad, der nicht über die umfangreichen Fähigkeiten zur HTML-Erstellung verfügt. PHP, Javascript, ASP, SII werden nicht unterstützt, die CSS-Funktionen sind gleichwertig zu denen von HTMLPad. Rapid CSS ist Shareware und kostet momentan $19.85.

TopStyle

TopStyle wurde von Nick Bradbury, der durch den HTML-Editor Homesite bekannt wurde, entwickelt. TopStyle bietet neben Syntax-Highlighting und Code-Vervollständigung die Möglichkeit der Einbindung in eine große Palette von Web-Editoren. Sowohl HTML-Tidy als auch CSS-Tidy stehen zur Verfügung. Der StyleSweeper lässt sich individuell zur Formatierung und Komprimierung von Stylesheets konfigurieren. TopStyle kann dateiübergreifend suchen und ersetzen und erlaubt Undo auch nach dem Speichern. Fehlerhafte Eingaben für Deklarationen und Attribute mahnt TopStyle sofort an. FTP-Funktionalitäten bringt das Programm leider nicht mit, ebenso sucht man die Unterstützung von UTF-8 leider vergebens. TopStyle ist Shareware und kostet momentan $79.95.

Programme für Windows und Mac OS

Style Master

Style Master ist ein reiner CSS-Editor und sowohl für Windows als auch für Mac OS X verfügbar und ein reiner CSS-Editor. Syntax-Highlighting und Code-Vervollständigung sind für CSS vorhanden und Dateien können online editiert werden. Eine Siteverwaltung bringt Style Master nicht mit dafür aber verschiedene Assistenten für die Erstellung von Stylesheets, Navigationen oder ganzen Layouts. Die Überprüfung eines Designs vereinfacht das Programm durch X-Ray, den so genannten Röntgenblick. Style Master ist Shareware und momentan für $59.99 erhältlich. Im Paket ausßerdem kostenlos integriert ist ein umfassendes CSS-Nachschlagewerk in englischer Sprache.

Simple CSS

Simple CSS ist, wie der Name schon sagt, ein einfacher CSS-Editor für Windows, Mac OS X und Linux, der die nötigsten Basisfunktionen mitbringt. Stylesheets können importiert und über das GUI bearbeitet werden. Ein Quellcode-Editor mit Highlighting und Vervollständigung steht nicht zur Verfügung. Das Programm eignet sich eher für Einsteiger, die bestehende Stylesheets untersuchen oder anpassen möchten. SimpleCSS ist Freeware.

Programme für Mac OS

CSSEdit

CSSEdit ist ein umfangreicher CSS-Editor, der vor kurzem in einer komplett überarbeiteten Fassung erschienen ist. Die Bearbeitung von Gruppen und einzelnen Stilen ist überaus intuitiv gelöst, so dass sich auch Einsteiger schnell zurecht finden werden. Syntax-Highlighting beherrscht CSSEdit für CSS, die Code-Vervollständigung funktioniert nur für Tags und nicht für deren Attribute. Für die Vorschau von Layouts können wahlweise lokale Dateien oder URLs verwendet werden. Der X-Ray Röntgenblick erleichtert die Fehlersuche ungemein. Das Programm ist Shareware und kostet momentan $29.95.

skEdit

skEdit ist ein umfangreicher HTML- und CSS-Editor für Mac OS X. Neben einer kompletten Siteverwaltung inkl. FTP und WebDAV bietet das Programm Such- und Ersetzfunktionen über mehrere Dateien, Undo nach dem Speichern, Vorlagen- und Codeschnipsel. skEdit bietet Syntax-Highlighting für CSS, (X)HTML, PHP usw. und Code-Vervollständigung. Stylesheets können automatisch aufgeräumt werden. Das Programm ist auch in Deutsch verfügbar und kostet momentan $24.95.

TexMate

TextMate ist ein komfortabler Editor für OS X. Was den Editor zu einem wahren Tipp für jeden Webworker macht, sind die so genannten »Bundles«. Diese ermöglichen eine besonders gute Integration einer Sprache in den Editor und so lässt sich auch im Falle von CSS vieles schneller und effizienter erledigen als in anderen Editoren. Textmate bietet Syntax-Highlighting aber keine Autovervollständigung. Die Eingabe der Tags und Attribute wird über Shortcuts erheblich vereinfacht. Diesbezüglich hat der Autor mehrere sehenswerte Video-Tutorials veröffentlicht. TextMate ist Shareware und ist momentan für €39 erhältlich.

Zusammenfassung und Ausblick

Der Beitrag hat acht Editoren näher beleuchtet. Die Wahl des passenden Editors hängt von persönlichen Vorlieben und Ansprüchen ab und so kann ich keine abschliessende Empfehlung geben. Alle sind eine große Arbeitserleichterung im Umgang mit Stylesheets und auf jeden Fall einen Test wert. Ich persönlich habe mich für TopStyle am PC entschieden, obwohl ich die UTF-8-Unterstützung schmerzlich vermisse. Am Mac ist TextMate meine erste Wahl. Wer weitere Programme sucht, sollte sich auch BBEDIT, PSPad und jEdit anschauen.

Kommentare

pierro
am 09.12.2006 - 13:34

diese recht kurz auf/ ausgefuehrte liste waere um ein weites ausbaufaehiger .
denn der editoren gaebe es weitaus mehr.

zum beispiel:
Xylescope ;
http://www.culturedcode.com/xyle/index.html

oder meinet wegen auch :
http://solareclipse.sourceforge.net/

Permanenter Link
Manuela Hoffmann

Manuela Hoffmann (Autor)
am 09.12.2006 - 14:06

Ich denke, es ist klar, dass ein solcher Artikel nicht alle Editoren vergleichen kann, die auf dem Markt sind.

Meiner Meinung nach ist Xyle scope allerdings kein CSS-Editor. Xyle scope hilft wie auch Firebug für Firefox hervorragend bei der Analyse von Stylesheets, zum Erstellen und Verwalten ist das Werkzeug nicht geeignet. Auch solareclipse zielt nicht allein auf die Gestaltung von Stylesheets ab.

Als Zusatz möchte ich hinzufügen, dass Style Master 4.03 der MacLife 12/2006 als Vollversion beiliegt.

Permanenter Link

Edoardo
am 09.12.2006 - 17:29

Und wie sieht es mit PSPad aus? Oder Weaverslave. Beide kosten nichts und können viel. Nur Weaverslave konnte ewig kein UTF-8, weiß nicht, ob sich das geändert hat.

Stylesheets werden doch gar nicht programmiert … *indietischkantebeiß*

Permanenter Link
Manuela Hoffmann

Manuela Hoffmann (Autor)
am 09.12.2006 - 17:54

PSPad ist oben gelistet und zu Weaverslave kannst Du gern Informationen beitragen, da ich den nicht verwende/kenne.

Die »Programmierung« ist geändert.

Permanenter Link

Christian
am 10.12.2006 - 21:33

Gute Liste! Schade allerdings, dass die Editoren mehrheitlich kostenpflichtig sind.
Da begnüg ich mich doch weiterhin mit meinem ganz normalen HTML/PHP Editor ;)

Permanenter Link

.carsten
am 10.12.2006 - 22:18

Nach den ersten Wochen mit Dreamwaever 8 bin ich eigentlich gerade im Beuzug auf CSS sehr zufrieden. Läßt sich alles wunderbar anpassen, ein Blick in den Designmode läßt gleich erahnen, wenn was im IE schief gehen könnte, ein verlinktes CSS ist editierbar, ohne die Datei öffnen zu müssen... Zwischen MX und 8 liegen hier zum Glück Welten.

Permanenter Link

derCobold
am 11.12.2006 - 11:34

So wie es aussieht gehöre ich zur Minderheit, die zur Webprogrammierung noch einen guten alten Texteditor benützt, der mir in Sachen HTML, CSS und PHP außer Syntaxhighlighting nichts bietet; was aber auch daran liegt, dass ich noch immer mit Schrecken an die ersten HTML-Editoren zurück denke, die teilweise sogar fehlerhaften HTML-Code erzeugten. Vielleicht schaue ich mir nun aber doch mal den einen oder anderen Editor aus der Liste an.

Permanenter Link

andreas
am 11.12.2006 - 14:31

Ich hatte einen Vergleichstest der Editoren (Vor/Nachteile/Handling ect.) erwartet. Habe ich wohl falsch verstanden.

Webweaver kann immer noch kein UTF-8 und wäre hier auch in der Liste fehl am Platze, da er ein Code-Editor für div. Sprachen ist und die CSS-Features sind bei Webweaver rudimentär. Der Autor redet seit über 1.5 Jahren von Updates die nicht erscheinen.

Mir fehlt in der Liste noch ein Hinweis auf die Sprachunterstützung. Der HTMLPad klingt für michi interessant. Sieht aber so aus als ob der keine Language-Files anbietet.

andreas

Permanenter Link

Guido
am 13.12.2006 - 14:18

Besten Dank für die Liste! Habe den StyleMaster getestet, der ist zwar um einiges schöner zu bedienen (dank X-Ray) als Simple CSS, doch leider ist er mir für meine Ansprüche ein wenig zu teuer.

Guido

Permanenter Link

ThP
am 21.12.2006 - 14:36

Ein recht guter CSS-Editor für Linux ist der GTK2-basierte "cssed", zu finden unter http://cssed.sourceforge.net/. cssed taugt in Maßen auch als allgemeiner Editor; wer will schon für zwei code-basierte Tätigkeiten zwei verschiedene Programme aufhaben?

Permanenter Link

Björn
am 02.01.2007 - 20:51

Und was ist mit dem durchaus recht vielversprechenden Aptana?

Permanenter Link

John
am 03.01.2007 - 00:20

So wie es aussieht gehöre ich zur Minderheit, die zur Webprogrammierung noch einen guten alten Texteditor benützt...

Ich weiß nicht, ob es eine Minderheit ist. Ich nutze seit Jahren SciTE und werde wohl auch dauerhaft nie was anderes nehmen.

Aber unter anderem für CSS-Newcomer sind die o.g. Editoren sicherlich sinnvoll, da man nicht zwangsläufig schon jedes kleine Stylesheet-Attribut kennen muß um einen Erfolg zu sehen. Und wenn CSS schon eine weite Verbreitung finden soll, dann sollte man Lernwillige nicht unbedingt mit Orgien von Speichern / F5 / Editieren / Speichern / F5 usw. abschrecken. :)

Außerdem funktionieren die so produzierten Stylesheets i.d.R. problemlos. Im Gegensatz zu vielen (auch modernen) (X)HTML-Editoren. ;-)

Permanenter Link

Niko
am 09.01.2007 - 14:47

Ein wirklich guter Editor, welcher viele Syntax beherscht (unter anderem auch CSS) ist das Notepad++

Link

Mein absoluter favorit wenn es um programmierung von Webseiten geht.

er kann Tabs, syntaxhighlighting, macros autovervollständigung etc. und er ist freeware wird im schnitt alle 1-2 Monate aktuallisiert.....

Permanenter Link

woop
am 15.01.2007 - 15:06

Ich benutze nvu und bin sehr zufreiden.

http://www.nvu.com

Permanenter Link

okapi
am 01.02.2007 - 12:28

Mein persönlicher Favorit unter Windows ist seit Jahren HTMLPad.
Unter Linux (KDE Desktop) ist es Quanta. In der aktuellen Version ist CSS ein Vergnügen!

Permanenter Link

Markus Heisterberg
am 13.04.2007 - 06:35

PSPad kommt fast etwas zu kurz: Der Editor ist kostenlos, fast vollständig konfigurierbar und lässt nichts vermissen, was das Programmiererherz begehrt!
Mein absoluter Favorit und täglich im Einsatz, - Ich empfehle nichts mehr anderes.

Permanenter Link

Peter Weilig
am 11.09.2007 - 19:47

Mein absoluter Favorit ist
Jellyfish-CSS relativ neu, hat aber sehr viel Features die aich bei anderen vermisse

Permanenter Link

Die Kommentare sind geschlossen.