CSS Editoren (Freeware)
Kürzlich wurde auf pixelgraphix.de diskutiert, ob die Pre-CSS-Ära mittlerweile überwunden ist und wir mitten drin sind, statt nur dabei. Durch die rasante Verbreitung von Weblog-Software alá WordPress, Textpattern & Co., ist es auch für Quer- und Neueinsteiger bei weitem nicht mehr so schwierig, standardkonforme, valide, barriereärmere Webseiten zu kreieren. Oder zumindest etwas ähnliches. Die heutigen Skripte bringen alles notwendige mit. Verfügbare Templates liegen in der Regel schon im XHTML-Markup vor und die Trennung des Designs vom Inhalt wird in großen Teilen auf Cascading Stylesheets ausgelagert. The way it should be.
Natürlich ist nicht alles W3C-Edelmetall was glänzt, aber wenn man sich in Support-Foren wie z.B. auf wordpress.de umschaut, sind auch und gerade Newcomer willens, sich den kleinen Problemen des CSS-Alltags zu stellen. Da nicht jeder sofort mit Klassen, Selektoren usw. auf Du und Du steht und das Editieren von CSS-Dateien oft der klassischen »Trial & Error» Technik gleicht, ist zumindest am Anfang der Einsatz eines CSS-Editors keine schlechte Lösung. Allerdings ist die Auswahl an kostenlosen Editoren auf diesem Gebiet recht begrenzt. Wer Zugriff auf kommerzielle Software wie Dreamweaver, GoLive u.ä. hat, möge sich an den integrierten Programmen versuchen, wobei mir die dortige CSS-Unterstützung nie wirklich smart erschien. Auch der »CSS-Editor« in NVU ist m. E. kompliziert gelöst. Aus diesem Grund stelle ich hier mal einige Freeware-Editoren vor, die über ein einfaches Syntax-Highlighting hinausgehen:
TopStyle Light
Die mittlerweile von Newsgator übernommene Software TopStyle dürfte die bekannteste und wohl auch beste Applikation auf diesem Gebiet sein. Als Vollversion kostenpflichtig, ist nebenher auch TopStyle Light verfügbar, eine im Umfang zwar reduzierte Version, die sich jedoch durchaus sinnvoll zum Erstellen von Stylesheets verwenden läßt. Das dreigeteilte Programmfenster zeigt gleichzeitig den CSS-Quelltext (mit Syntax-Hervorhebung!), die verfügbaren Attribute und (das Wichtigste an dieser Art Editoren) ein formatierte Vorschau des aktuellen (X)HTML-Elements. Ein sehr smartes Programm und auf diesem Gebiet wohl erste Wahl. (englisch)
CSS Editor
Auch in deutschen Landen hat man sich über eine einfache Bearbeitung der Stylesheets Gedanken gemacht. Ausfluß dessen z.B. der CSS-Editor von Thomas Rudolph. In der Aufmachung ähnelt er TopStyle, ist sehr durchdacht aufgebaut und auch der CSS-Neuling findet sich bei dieser Software schnell zurecht. Das Stylesheet kann auch hier auf einfachste Weise zusammengeklickt werden, ein eingebauter Parser weist auf etwaige Fehler hin und im unteren Bereich des Programmfensters erhält man eine Vorschau des betreffenden (X)HTML Elements. Der CSS-Editor ist für den privaten Gebrauch kostenlos, beim Programmstart erscheint jedoch für 10 Sekunden ein Info-Fenster mit der Bitte um Registrierung. Mit 5 Euro sind sie dabei und unterstützen den Autor bei der Weiterentwicklung der Software. (deutsch)
StyleAssistant
Von Dr. Thomas Meinike wurde der StyleAssistant programmiert, der jedoch mittlerweile nicht mehr weiterentwickelt wird. Nicht ganz so komfortabel wie die vorgenannten Anwendungen, eignet er sich u.U. für absolute Newbies, die noch mit dem Verständnis für border-style, line-height & Co. kämpfen. Alle gängigen CSS-Attribute sind auf einen Blick ersichtlich und per One-Click lassen sich die Formatierungen in einer Browser-Vorschau betrachten. (englisch)
Balthisar Cascade
Balthisar Cascasde ist ein sehr umfangreiches und etwas komplizierter zu bedienendes Programm, also eher dem tippfaulen CSS-Kenner zu empfehlen. Balthisar bietet zwar keine direkte Vorschau des formatierten Elements, enthält dafür aber den vollen Befehlsumfang von CSS 2 und nach etwas Einarbeitung läßt sich sehr zügig damit arbeiten. Im mittleren Bereich des (fixen) Programmfensters sind die Layout-Attribute unter Karteireitern geordnet, links werden die formatierten Elemente aufgelistet und rechts erhhält man einen Preview auf den CSS-Quelltext Balthisar Cascade war augenscheinlich mal als Entwicklungstufe einer kommerzieller Software geplant, wird aber seit 2001 nicht mehr weiterentwickelt. (englisch)
Simple CSS
Vielen Dank an Manuela für den Tipp! Simple CSS ist für Windows und Mac erhältlich und äußerst komfortabel zu bedienen. Nach einen erstem Test gefällt mir dieser Editor sogar am besten. Im linken Bereich können die Selektoren aus einer Liste gewählt werden, im rechten Hauptbereich werden die Attribute aus Dropdown-Feldern ausgewählt und im unteren Teil zeigt wiederum eine Vorschau das Ergebnis der Formatierungen an. Ein sehr eleganter Editor, der mir durchaus alltagstauglich erscheint und eine echte Alternative zum reinen »coding by hand« zu sein scheint. (englisch)
CssEd
Diesen Tipp von isinkwa (Danke!) habe ich noch nicht getestet, aber die Screenshots und die Beschreibung des Funktionsumfangs verheißen einiges. CssEd läuft unter Linux und Windows, benötigt beim letzteren allerings die GTK-Library. Auch hier ist eine Auswahl der Attribute möglich und den Quelltext des Stylesheets kann man nach Elementen zusammen klappen (Folding), was die Übersichlichkeit erhöht. (englisch)
- - -
Für weitere Tipps bezüglich kostenloser CSS-Editoren bin ich dankbar und nehme sie gerne in diese Liste auf.
Artikel: CSS Editoren (Freeware)
Datum: Wednesday, 24. May 2006, 18:00 Uhr
Kategorien: Software, Webdesign
Feed zum Beitrag: RSS 2.0 · Trackback: Trackback-URL
Diesen Artikel kommentieren.
Journal (Artikel)
24. May 2006
@ 21:21
Hallo John,
vielen Dank für die prima Übersicht!
Ich habe mich bisher mit CSS-Editoren noch nicht so richtig anfreunden können bzw. wohl bisher noch nicht so ganz verstanden, wie man die gewinnbringend einsetzt …
Ich werd wohl mal ein wenig mit TopStyleLight experimentieren. (den Du ja wärmstens empfohlen hast)
Mit welchem Editor arbeitest Du denn?
Liebe Grüße
Franziska
24. May 2006
@ 22:43
Hallo Franziska,
das dürfte ich eigentlich gar nicht verraten. *g Ich nehme nur einen reinen Texteditor für alles, also XHTML, PHP, CSS usw. (SciTE).
Allerdings denke ich, daß die vorgestellten speziellen Editoren besonders für Anfänger sinnvoll sind, die die CSS-Befehle noch nicht verinnerlicht haben oder die Maßeinheiten bestimmter Attribute. Generell ist es sicher eine Gewohnheitsfrage. Ich habe am liebsten die volle Kontrolle über den Quelltext, deshalb werde ich wohl bei meinem kleinen Texteditor bleiben. :-)
Aber TopStyle ist wirklich ziemlich ausgereift. Probiers einfach mal. ;-)
Liebe Grüße,
John
25. May 2006
@ 11:07
Vielen Dank für die Zusammenstellung. Unter CSS-Editoren im Vergleich hatte ich auch schon mal einen Vergleich angestellt. Allerdings waren auch Editoren dabei, die nicht kostenfrei sind. In den Kommentaren finden sich jedoch sehr interessante Tipps. Freeware für Win und Mac ist z.B. Simple CSS.
25. May 2006
@ 11:29
Hallo,
ich möchte diesen Artikel hier noch um einen weiteren CSS-Editor erweitern.
Es handelt sich hierbei um den cssed.
Er läuft unter Windows sowie unter Linux und ist Freie Software.
Gruß, isinkwa
26. May 2006
@ 12:47
Danke Manuela und isinkwa. Ich guck mir alles mal in Ruhe durch und füge dann die weiteren Editoren noch hinzu. Kann aber ein paar Tage dauern, weil jetzt erst mal Urlaub angesagt ist. :-)
Liebe Grüße
John
28. May 2006
@ 13:51
auf
? :D hrhrhr
ich hab mit den editoren keine erfahrung, vllt. ist aber für einen suchenden auch etwas in der liste der online-generatoren (oder als bookmark-datei für mozilla-brauser), die im dr.web weblog jüngst erschien. da ist “gerade für newcomer” auch das ein oder andere sicherlich hilfreiche tool dabei. mfg
4. June 2006
@ 19:43
Ich finde den CssED nicht schlecht, nur nerven mich zwei Dinge ziemlich.
Zum einen, wenn man ; drückt erfolgt ein Zeilenumbruch und es klappt der Befehl-Auswahldialog auf. Bei TopStyle finde ich das besser gelöst.
Zum anderen lassen sich im Moment scheinbar die PlugIns nicht installieren. Und das FileBrowser-PlugIn sollte meiner Meinung nach kein PlugIn sein, sondern zum Hauptprogramm gehören.
Ich hoffe, dass sich dieser Editor noch verbessert, bis dahin nutze ich TopStyle Lite, der dank wine auch unter Linux funktioniert.
27. March 2008
@ 22:02
Auf der suche nach einem freeware CSS editor kam ich auch hier vorbei, meine suche wird bestimmt durch Joomla CMS, wo CSS ein grosser teil der homepage ist.
Leider hab ich noch keinen editor gefunden der auch index.PHP dateien aufnemen / laden kann, in der vorschau.
Biss heute kann ich auch “A Style” als CSS editor empfehlen.
http://www.athlab.com/
Gruß, Stef
16. April 2008
@ 13:30
Hallo aus Dortmund…
... und vielen für die Info. Versuche mich auch gerade an CSS und mag es am liebsten pur im reinen texteditor. Werde mir aber mal die Tipps ansehen. Vielleicht läßt sich das Arbeiten ja etwas erleichter. Gerade mitg einer Vorschaufunktion könnte ich mich doch sehr anfreunden.
Frohes Schaffen und Gruß
Carsten
29. May 2008
@ 13:58
Alle die bisher Ihre CSS Dateien per Hand gecoded haben, sollten sich mal den http://iStylr.com anschauen. Meiner Meinung nach eine echte Alternative!