CSS-Editoren im Vergleich
Für die Entwicklung und Programmierung von Stylesheets lassen sich alle Text-Editoren verwenden. Komfortabler geht es natürlich mit speziellen Editoren, von denen dieser Artikel sieben Programme für Windows und Mac OS X näher unter die Lupe nimmt. Nicht dabei sind Editoren, die vornehmlich auf die Entwicklung von (X)HTML abzielen oder WYSIWYG-Editoren wie Macromedia Dreamweaver oder Adobe GoLive. Die vorgestellten Editoren lassen sich größtenteils in diese Web-Editoren einbinden um CSS komfortabler zu entwickeln.
Die sieben Editoren, die nebeneinander gestellt werden, sind: HTMLPad, Rapid CSS, TopStyle, StyleMaster, Simple CSS, CSSEdit und SkEdit. 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 mehr.
Alle Ergebnisse sind übersichtlich in einer Tabelle zusammengefasst als HTML oder PDF abrufbar.
HTMLPad
HTMLPad ist ein HTML- und CSS-Editor für Windows, der schnell und umfangreich ist. Syntax-Highlighting und Code-Vervollständigung werden komplett unterstützt. Der Anwender kann 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 $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 $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 an. FTP-Funktionalitäten bringt das Programm leider nicht mit. TopStyle ist Shareware und kostet €70.60.
Style Master
Style Master ist 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. Das Programm ist Shareware und für $59.99 erhältlich.
Simple CSS
Simple CSS ist ein einfacher CSS-Editor für Windows, Mac OS X und Linux, der 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.
CSSEdit
CSSEdit ist ein umfangreicher CSS-Editor, in dem wahlweise über das Interface oder über den Quelltext formatiert werden kann. Das Programm liefert keine (X)HTML-Gestaltungsmöglichkeiten. Syntax-Highlighting beherrscht CSSEdit für CSS, die Code-Vervollständigung funktioniert nur für die Deklarationen und nicht für deren Attribute. CSSEdit erlaubt die Extraktion von Stilen aus online Stylesheets. Das Programm ist Shareware und kostet $24.99.
skEdit
skEdit ist ein umfangreicher HTML- und CSS-Editor für Mac OS X. Neben einer kompletten Siteverwaltung inkl. FTP 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 $20.
Komplette Screenshots aller Programme bietet diese Übersicht.
Dieser Vergleich wird künftig weiter ausgebaut. Tipps zu weiteren Editoren oder Testkriterien sind erwünscht und können per Mail oder in den Kommentaren hinterlassen werden.
Werbeunterbrechung
Kommentare und Feedback (35)
Werbung
Vorheriger Artikel: Wo finde ich was in meiner Blogsoftware?, nächster Artikel: Kam ein Stöckchen geflogen ...
24.10.2005, 01:36
Interessant finde ich den Notepad-Ersatz Notepad2 von Florian Balmer (http://www.flos-freeware.ch).
Er kennt Highlighting für PHP, CSS, XML, Java,Diff-Dateien und mehr.
Somit ein kleiner Alrounder für diejenigen die mal eben eine Datei überarbeiten wollen, keine Codevervollständigung oder ähnlichen “Schnick-Schnack” benötigen. Deshalb ist er klein und läd sehr schnell.
24.10.2005, 02:59
Ich nutze skEdit nur für HTML & Co.
Für CSS nutze ich CSSEdit.
Zusammen sind sie (meiner Meinung nach) top. Ich kann sie beide nur empfehlen.
Ich bin aber auch kein Profi.
24.10.2005, 04:46
Der einzige Nachteil von TopStyle ist zum Beispiel der Tabulator, welcher gar nicht stimmt. Um das zu sehen öffne man im Notepad ein mit TopStyle erstelltes Stylesheet und man sieht die Fehler.
Sind zwar nur Schönheitsfehler, nervt mich aber trotzdem.
24.10.2005, 08:21
Ab und an nutze ich CSSed unter Linux. Evtl. klappt es auch unter Win das Programm ans laufen zu bekommen. Das Programm ist recht simpel, verfügt zwar u.a. über Highlighting (auch für XHTML, PHP,…) und Tidy, aber sonst nicht über so viele Features, es lässt sich aber erweitern und so den eigenen Bedürfnissen anpassen.
OSS
24.10.2005, 09:12
Klasse Übersicht. Mein Favorit ist und bleibt TopStyle von Nick Bradbury. Da du interessiert an Tipps bist, so hat mein vor kurzem geschriebener Beitrag – “Vergleich von Online CSS Optimizer” in meinem Block ( unter CSS ) eventuell noch ein paar nützliche Infos für dich.
24.10.2005, 09:56
Wirklich eine gute Übersicht, mit den Vor- und Nachteilen der verschiedenen Editoren.
Wie ich in meinem Beitrag in meinem Blog (Solin.ch » CSS Editoren im Vergleich ) schon geschrieben habe, würde ich einen kleinen Test über Eclipse mit CSS Erweiterung sehr begrüssen.
24.10.2005, 10:55
Ich benutze seit einiger Zeit HTMLPad 2005 und bin sehr zufrieden. Das Preis/Leistungsverhältnis ist ausgezeichnet und Editor läßt sich sehr gut den individuellen Bedürfnissen (Layout, Shortcuts, Clip-Library, etc) anpassen.
Der Entwickler kümmert sich in einem eigenen Forum sehr gut um den Support und Verbesserungsvorschläge der User werden regelmäßig in neue Programm-Updates integriert.
Kleines Manko: Die Einstellungsmöglichkeiten beim Syntax-Highlighting sind bei TopStyle umfangreicher.
24.10.2005, 10:58
Damals war TopStyle auch mein Favourite für die Entwicklung von CSS. Inzwischen denke ich, dass ich die meisten Befehel auswendig kenne. So brauche ich keine Codevervollständigung mehr und schriebe CSS dann direkt in Zend Studio, mit dem ich meine php- und XHTML-Seiten programmiere. Dennoch: Danke für die Übersicht, toller Überblick für Einsteiger!
24.10.2005, 11:44
Mmh, gefällt mir; gut übersichtlich — aber was mir dabei noch fehlt: BBEdit – und um das Ganze abzurunden vielleicht noch ein Hinweis auf Xyle scope . Randnotiz: Habe eine WebToolBox Link-Liste auf meiner Seite zusammengestellt
24.10.2005, 12:24
Ich bevorzuge immernoch den (leider nicht kostenfreien) macromedia dreamweaver mx 2004. dort sind alle vorgänge gut die ich so mache gut unterstützt: php, (x)html, css, … highlighting, fehlerprüfung, auto-vervollständigen etc.
25.10.2005, 04:24
TopStyle Pro ist auch mein Favorit. Allerdings kann der leider (wie auch viele andere Editoren) noch kein Unicode und ist daher nicht mehr für alle Projekte zu gebrauchen. In dieser Hinsicht ist PSPad wirklich sehr zu empfehlen. Die aktuelle Beta der kommenden Version 4.5.0 läuft auch schon sehr stabil und bietet extrem viele Funktionen.
25.10.2005, 05:23
Bei TheStyleWorks gibt es einen sehr schönen (deutschsprachigen) Überblick von CSS-Editoren, bei dem u.a. die Vor- und Nachteile von TopStyle und StyleMaster etwas ausführlicher beschrieben werden: Vergleich CSS-Editoren bei TheStyleWorks.de
25.10.2005, 06:31
Sehr schöne Auflistung. Ein Maceditor wird für mich ja evtl. in der näheren Zukunft in Frage. Für Windows favorisiere ich derzeit Crimson Editor.
25.10.2005, 08:45
Es geht doch nichts über hand-coden. Ich habe früher immer GoLive CS2 als Editor genutzt und muss zu meiner Schande zugeben, dass man durch Editoren, die zuviel Arbeit abnehmen CSS verlernt. Also nichts gegen Autocomplete u.ä., aber über eine Maske zusammenklicken ist seeehr böse ;)
Jetzt nutze ich TextMate (OSX) und JEdit (PC). Und sieh an, dann fallen einem die CSS Tags auch mal einfach so ein…
26.10.2005, 08:47
Vielen Dank für die vielen hilfreichen Kommentare! Die genannten Editoren werde ich mir für die nächte Runde anschauen.
Meine Favoriten sind TopStyle am PC und TextMate am Mac. TextMate bringt zwar keine Code-Vervollständigung mit, ist aber schnell und zuverlässig. Vor allem geniesse ich es, Dateien gleich auf dem Server zu editieren. Diese Möglichkeit bietet TopStyle leider nicht.
27.10.2005, 03:04
Ich brauche für die tägliche Arbeit Editoren, die UTF-8 verstehen. Das sind TextPad (Shareware) und unterwegs vom USB-Stick Scite – der kann übrigens auch Autovervollständigung (selbst anpassbar) und Codeabschnitte einklappen (Folding).
TextPad hat dafür ein echtes MDI und Sidebars, die sich nach Gutdünken positionieren und selbst erstellen lassen, um beispielsweise häufig verwendete Codeschnipsel beliebiger Länge zu verwalten. Genau wie beim Browser also.
Solch eine Verwaltung eigener Codeschnipsel bietet Scite zwar auch, aber da ist das etwas umständlicher.
Oh, Suchen und Ersetzen mit und ohne RegEx beherrschen beide natürlich auch.
Beide sind daher hervorragende CSS-Editoren, auch wenn sie nicht eigens dafür entwickelt werden.
Kriterien wie einen Validator (so etwas halte ich bei CSS für eine unmögliche Sache) oder FTP finde ich hingegen eher unwichtig. Dafür gibt es eigene Tools, die ihre Arbeit auf jeden Fall besser erledigen und bei Bedarf aus dem Menü des Editors heraus aufgerufen werden.
27.10.2005, 06:46
Ich habe skEdit – sehr cool…
27.10.2005, 10:09
vielen dank für diesen artikel! hat mich daran erinnert, dass ich schon ewig mal style master testen wollte und ich finde das teil super, weil ich damit per doppelklick ganz schnell an die betreffende stelle im stylesheet finde, zu schweigen von den abrufbaren infos zu browserkompatibilität etc. genau das richtige für textscheue grafiktussen, chchch. wozu wollte ich nochmal dreamweaver..?
27.10.2005, 11:39
Sehr schöne Übersicht.
Favorisiere zur Zeit auch TopStyle!
Aber da ein Umstieg auf Mac in naher Zukunft ansteht, werde ich sicher mal TextMate probieren.
28.10.2005, 09:41
Hallo Manuela,
ich schaue mir gerade TextMate an. Er hat zwar keine Code-Vervollständigung, aber dafür Snippets. In einer PHP-Datei einfach if eingeben und Tab drücken bringt die komplette if-Struktur. Für CSS gibt es allerdings wenig fertige Snippets, man kann sie aber erweitern.
Wer immer hier TestMate als erster erwähnt hat: Danke! Der macht bei mir möglicherweise das Rennen.
29.10.2005, 10:01
Ich verwende auch Topstyle; das einzige Manko ist die fehlende utf-8 Unterstützung.
Wie sieht es da mit denanderen Editoren aus?
30.10.2005, 09:09
Was ich bislang bei noch keinem CSS-Editor gefunden habe (PC oder Mac) ist eine einziehbare Metaebene für meine Definitionen. Denn außer dem Klassen- oder ID-Namen einer Definition bietet kein Editor ein Strukturierungsinstrument mit, mit dem ich mir z. B. alle Definitionen für einen bestimmten Bereich meiner Website oder
seite anzeigen lassen kann. Auch das Filtern von CSS-Definitionen, wie z. B. alle Bildoder Absatzdefinitionen vermisse ich. Manchmal wünsche ich mir ein eigenes CMS für meine CSS-Dateien, so unübersichtlich sind die.05.12.2005, 06:46
@Manuela
> Dateien auf dem Server editieren und TopStyle
Nick Bradbury hat in seiner FAQ dazu WebDrive empfohlen.
[…] Another nice option is WebDrive, which maps a drive letter to an FTP server – enabling you to access your FTP server just like any other drive, including from TopStyle. […]
05.12.2005, 06:57
Danke für den Tipp, Peter. Das werde ich auf jeden Fall ausprobieren.
09.12.2005, 06:51
Hier noch drei weitere CSS Editoren: Cascade Light, Xyle scope und CSS Optimizer X, alle für Mac OS X.
07.01.2006, 07:11
ich benutzte hauptsächlich Proton und mag ihn, gerade weil er so simpel gehalten ist und auf viel Schnickschnack verzichtet
30.03.2006, 15:28
An Yves: In CSS Edit kann man eine eigene Ordnerstruktur anlegen. Ist bei komplexem CSS enorm praktisch und erhöht die Übersichtlichkeit enorm. Manchmal hakt die Funktion zwar etwas, aber ich bin sehr zufrieden.
09.05.2006, 11:58
ich arbeite sehr gerne mit notepad++ diesen editor kann ich nur empfehlen. mit notepad++ bearbeite ich jegliche art von dateien aber hauptsächlich html und css. notepad++ ist übrigens opensource!
http://notepad-plus.sourceforge.net/de/site.htm
08.06.2006, 14:05
Dreamweaver entwickelt sich immer mehr zu einem konkurenzfähigen CSS Editor.
@ Heiko: Du hast den Link vergessen… hier isses
28.08.2006, 13:45
Vielen Dank für die wertvollen Tipps, habe genau sowas gesucht.
17.03.2007, 12:12
Das ist genau der vergleich denn ich gesucht habe. Ich wolte auf Mac umsteigen und bin stark an css interessiert. Da ich seit ca. 18 Jahren Windors-leidende-benutzer bin, hilft mir dieser Überblick wirklich sehr, bei der auswahl der Software.
30.08.2007, 01:11
Eine tolle Aufstellung gerade für einen Einsteiger.
Läuft CSSedit auf Windows?
17.02.2008, 14:52
Alle Ergebnisse sind übersichtlich in einer Tabelle zusammengefasst als HTML oder PDF abrufbar.
Irgendwie bin ich zu blöd um auf den link für das pdf zu klicken.
Wo ist den das pdf?
29.05.2008, 12:56
Ich nutze seit kurzem http://istylr.com. Dieser Online CSS Editor hat alles was ich für die tägliche Arbeit brauche (WordPress Export Support inklusive)
31.05.2008, 16:36
hmmmm habe es mir durchgelesen was ihr so von euch gegeben habt und muss sagen das topstyle auch immer mein favourite war, doch ich benutze dafür zusätzlich editplus, sehr schlankes freewareprogramm mit ner riesigen auswahl an erweiterungen ;) läuft 1A nur zu empfehlen!!!