Peter Kröner, Webdesigner & Frontendentwickler - Weblog und Portfolio von Peter Kröner, einem Webdesigner und Frontendentwickler aus Westerkappeln bei Osnabrück.

Es sieht so aus, als hätte ich nächsten Monat extrem viel zu tun. Es gibt in diesen Tagen schlimmere Schicksale als zu viel Arbeit, aber trotzdem … es drohen bei langfristiger Überarbeitung RSI und Konsorten. Und wenn man in Photoshop und/oder der IDE versunken ist, übersieht man schon mal die Uhr. Was tun?

Workrave ist ein Open-Source-Programm für Linux und Windows, das der recovery and prevention of RSI dient, indem es sich als eine Art Pausen-Manager betätigt. Es gibt Mikropausen, die alle paar Minuten für wenige Sekunden zur Ruhe auffordert, ein Maximalpensum für den Tag und längere Ruhepausen, für die das Programm diverse Dehn- und Augenübungen vorschlägt. Die Pausen lassen sich natürlich auch ignorieren, überspringen oder aufschieben. Alle Zeiten sind konfigurierbar und mehrere Rechner mit Workrave lassen sich sogar untereinander vernetzen, damit man keine Pause verpasst. Wenn man außerplanmäßig die Finger von der Maus lässt, hält das Programm die Zeit an.

Das Programm mit seinen diversen Meldungsfenstern und dem Zeitzähler im Systray sieht (zumindest bei mir unter Linux) auch sehr angenehm aus.

Der einzige Haken an diesem Tool ist vielleicht, dass die weniger Konzentrationsfähigen unter uns sich vielleicht von Workrave und insbesondere den Mikropausen genervt fühlen könnten … aber das kann man sich dann ja so konfigurieren, wie man es tolerierbar findet.

Ubuntu Linux hat Workrave in der Universe-Paketquelle, für Windows gibt es eine Exe zum Download und Sourceforge ist ja auch noch da.

Wie sortiert man CSS-Deklarationen? Eins der Themen im neuesten Beitrag von Pisto. Autor Andreas Dölling sortiert sein CSS in Gruppen.

Da steht dann layoutänderndes Verhalten wie float, display und position am Anfang und Dinge wie background und color kommen an das Ende.

Nico Brünjes hingegen sortiert alphabetisch:

Ich persönlich finde beide Ansätze recht seltsam. Was die Gruppierungs-Methode bringen soll, erschließt sich mir nicht so recht und die Einteilung erscheint mir recht subjektiv. Und bei der bürokratischen ABC-Ordnung könnte ich mir allenfalls vorstellen, dass sie dann zu etwas gut ist, wenn man mit einer Vielzahl von Leuten zusammenarbeiten muss, die etwas anderes nicht kapieren. Der Preis ist dann, dann man Dinge, die logisch eigentlich zusammen gehören (z.B. position und z-index) auseinander reißt. Nicht so toll.

Das Patentrezept habe ich freilich auch nicht und mein Vorgehen entspricht vielleicht einer typischen Einzelkämpfer-Sortierung, aber mir hilft sie.

Ich frage mich immer: Wie wahrscheinlich ist es, dass in näherer Zukunft mal Eigenschaft X geändert werden muss? Sehr wahrscheinlich (Farben, Textgröße)? Ab an den Anfang. Sehr unwahrscheinlich (Layout, Position)? An das Ende. Ein einfaches Beispiel:

div.foobar { color:#CC0000; text-decoration:underline; position:relative; }

Während ich die Seite baue wird die Farbe des Links mit absoluter Sicherheit das eine oder andere Mal einem Tuning unterzogen werden. Dass der Link aber unterstichen sein soll, ist etwas, das wird sich im Designprozess nicht gar so oft ändern. Deswegen kommt text-decoration an das Ende. Und das Layout ist von Anfang an geplant und wird nach Möglichkeit auch durchgezogen, also versammeln sich Dinge wie position, margin und Konsorten am Ende. Innerhalb dieser Einteilung ist es ganz sinnvoll zusammenhängende Eigenschaften auch zusammenzuhalten (z.B. font-size, line-height und text-align).

Damit kann ich flott arbeiten, weil einem die Eigenschaften, an denen man die meiste Arbeit zu verrichten hat, gleich am Anfang einer Deklaration entgegen springen. Meine Meinung.

Wenn man wirklich etwas tun will, um einen Stylesheet für die Allgemeinheit lesbarer zu machen, muss sich vor allem für eine Sortierungsmethode entscheiden und diese Methode dann auch durchziehen. Ich hab schon so manche seltsame Sortierung gesehen, aber verzweifelt bin ich immer nur, wenn überhaupt kein Muster erkannt habe. In alles, was eine Art System hat, kann man sich reinkämpfen und ganz loswerden kann man die WTFs nie.

Wenn es darum geht, eine Website aus dem Nichts komplett neu zu erstellen, braucht man eigentlich ein Grundgerüst. Damit meine ich keine Frameworks für Webentwicklung wie CakePHP o.Ä. und auch nicht diese seltsamen CSS-Frameworks auf die in letzter Zeit alle so scharf sind. Die sind vielleicht in Einzelfall zu gebrauchen, aber sonst nicht. Ein Framework, das irgendein Heini am anderen Ende der Welt zusammenkloppt, kann unmöglich genau für den Auftrag passend sein, den man gerade von einem Kunden aus der Nachbarstadt bekommen hat. Andere haben das auch schon ausführlicher bearbeitet.

Eine Art Framework benutze ich aber trotzdem. Es ist im Wesentlichen ein Haufen (großteils leerer) Dateien und Verzeichnisse, die ich aber wirklich bei so gut wie jedem Projekt brauche. Ich nenne es immer mein Starterkit. Und das sieht so aus:

Kompletten Artikel lesen

Kennt ihr Leute, die gerne stundenlang überdetaillierte Website-Entwürfe mit gefühlten 300 unbenannten Ebenen in Photoshop bauen? Gebt ihnen Pencil Project. Denn das ist ein praktisches Tool speziell zum Basteln von Prototypen. Per Drag&Drop kann man bunte Boxen malen, Texte tippen, Bilder importieren und Formularelemente im (unter anderem) nativen Look von Windows XP einbauen.

Das Ganze basiert auf Mozillas XULRunner und ist natürlich Open Source. Die Bedienung ist kinderleicht und neben geschriebenen Tutorials stehen auch Screencasts bereit. Zu haben ist Pencil Project als Stand-Alone-Programm oder als Firefox-Extension –wobei letztere Variante bei meinem Test eine nicht besonders gute Performance bot.

Gefunden bei WebAppers.