ProCSSor – Der CSS Prettifier

Sagen wir mal so: Es existieren für verschiedene Sprachen durchaus Standards, wie Quelltext auszusehen hat, aber keiner hält sich dran. Für das Zend Framework zum Beispiel existieren sehr strikte Regeln, interessiert keinen – geschweige denn das ich das schon einmal in einem Tutorial oder einem Buch gefunden hätte. Bewegen wir uns jetzt im Bereich des Web, wird die „Qualität“ des Ganzen, sind wir mal nett: grottig.

Screenshot des Code Prettifiers ProCSSor

Mein absoluter Favorit in dem Bereich sind die Leute, die (warum auch immer) jedem Selector in einer CSS immerhin eine ganze Zeile spendieren. Da Editoren die dumme Angewohnheit besitzen, so etwas wie Wrapping zu besitzen wird dies erstmal ausgeschaltet und man sieht man Ende nicht mehr, was am Anfang steht. Das Resultat: doppelte Anweisungen. Die Tatsache das man in CSS auch Kommentare setzen könnte lasse ich an dieser Stelle mal unerwähnt – ich wäre ja froh, wenn man ab und an mal Javascript kommentieren würde  ;)

Tja, was ich mich so aufrege? Ich hab hier mal wieder eine Webseite übernommen, die so grottenschlecht ist, dass man am liebsten alles wegwerfen würde – das wiederum zahlt ein Kunde nicht (er hat ja eine Webseite die ihm gefällt) und dann kommen wir zum eigentlichen Problem: CSS in lesbare Form bringen bezahlt einem keiner – und wenn man es dann nicht schafft, schnell die gewünschte Lösung zu bringen, sieht es beim Kunden so aus, als ob man keine Ahnung hätte (immerhin hat das Vorgänger-Genie seinen Chaos voll durchblickt).

Was hilft? Ein Code Prettifier wirkt hier wahre Wunder. Er nimmt ein verhunztes Stück Quelltext und bringt es in eine von Menschen lesbare Form – manche können bei dieser Gelegenheit sogar noch schwachsinnige Anweisungen entfernen und helfen so ungemein weiter.

Im Bereich des CSS nutze ich den ProCSSor (dessen Name an sich schon einfach genial ist!) um CSS zumindest so anschauen zu können, dass ich keine Scroll-Arie vor mir habe. Das Ding eignet sich übrigens auch hervorragend um diverse Tab-Orgien des CSS-Erstellers zu bekämpfen. Alles in allem ein sehr nettes Tool, das man einmal eine fremde CSS gibt, um diese dann anschließend zumindest ohne Kopfschmerzen bearbeiten zu können.

Ähnliche Beiträge

jFontSize – dynamische Font-Size mittels jQu... Ich entwickele zur Zeit einen Magento-Shop für Silver Surfer. Natürlich gibt es da besondere Ansprüche, und eine davon ist die klare Lesbarkeit der Se...
CSScomb – Sortieren einer CSS-Datei Die Übernahme von komplexen Seiten dritter ist kein Spaß, aber leider Alltag. In der Regel sieht dieses Szenario bei mir so aus: irgendein Hobby-Frick...
Individuelle Checkboxen ohne JavaScript Schuster bleib bei deinen Leisten ist nicht immer eine gute Idee! Vor allem dann, wenn man seine Stiefel anstatt gegen die Version aus Gummi auszutaus...
Landkarten als Font – Map Glyphs Wer den Blog schon länger verfolgt weiß durchaus, das ich mich sehr viel mit der Darstellung von Objekten auf Landkarten und Umkreissuchen beschäftige...

4 Antworten auf „ProCSSor – Der CSS Prettifier“

  1. Zu den Codingstandards muss ich dann auch mal widersprechen. Diese interessieren sehr wohl, gerade dann, wenn man im Team arbeitet. Gute IDEs können entsprechend konfiguriert werden und wenn im Unternehmen Continuous Integration Tools wie phpUnderControl oder Hudson eingesetzt werden, dann kann z.B. PHP CodeSniffer automatisch die Codingstandards für PHP, JS und CSS prüfen, damit sich auch jeder im Team dran hält. Da kann man dann sogar noch viel schönere Sachen zur Qualitätskontrolle einsetzen.

    Siehe dazu: http://phpundercontrol.org/ bzw. http://pear.php.net/package/PHP_CodeSniffer

  2. Also ich hab Eclipse PDT und damit kann man auch CSS-Dateien formatieren. Und das schöne ist, man kann sogar konfigurieren, wie das aussehen soll. =)

    Und zum Coding-Standard: Also bei uns in der Firma und auch im privaten Bereich hat sich ein Coding-Standard etabliert. Dafür haben wir direkt den Zend-Standard übernommen. Leider benötigt man für Eclipse PDT ein Plugin, damit man den Formatter mal sinnvoll einrichten kann. Ansonsten habe ich noch keine sinnvolle IDE gefunden wo man das einstelen konnte. (Außer phpStorm sieht noch gut aus, hab ich aber noch nicht getestet und die kostet auch Geld ;))

  3. Pingback: Linkhub – Woche 39-2010 | pehbehbeh

Schreibe einen Kommentar

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