Trotz der Krise

Nach einiger Zeit der Pause, nehme ich doch den zweiten Teil meiner Anleitung in Angriff. Im ersten Teil ging es darum, wie man git bei einem webhoster installieren kann. Nun geht es ans Eingemachte und wir werden die grundlegenden Arbeitsweisen von git kennenlernen. Auch wenn git ziemlich umfangreiche Funktionen bietet, braucht man im Alltag nicht viel zu wissen. Erst wenn man direkt in das Repository (das heisst den Snapshot der gespeicherten Dateien) eingreifen will, muss man teils recht knifflige Befehle eingeben. Da aber git prinzipiell “out-of-the-box” funktioniert, kann man mit einfachen Funktionen beginnen und später, wenn man dann unbedingt etwas bestimmtes bewerkstelligt haben will, das Netz nach Antworten durchforsten.

An dieser Stelle möchte ich allen wärmstens das kostenlose ebook “Pro Git” empfehlen:

http://progit.org/book/de/

Bevor wir loslegen können, müssen wir git natürlich erst einmal lokal installieren. Dazu gibt es verschiedene Möglichkeiten:

Weiter lesen

Seit einer Woche arbeite ich nun mit git. Was ist git und warum bin ich so angetan davon?

git ist ein Versions-Kontroll-System, das heisst, wann immer man eine Datei speichert, kann davon ein Backup gemacht werden – einfach gesagt. Wir alle kennen Backup-Systeme, oder sollten zumindest eines kennen. Zu schnell sind wichtige Daten gelöscht oder nicht mehr auffindbar. git kann aber noch viel mehr, als bloss ein Backup erstellen. Es erstellt quasi einen “Snapshot” aller Dateien und Ordner zu einem gewissen Zeitpunkt. Man kann also immer wieder zu einem Zustand in der Vergangenheit zurück kehren. Das kennen wir Mac Benutzer seit TimeMachine auch schon, doch kann git gezielt eingesetzt werden, um verschiedene Versionen zu managen.

Insbesondere kann man genau sagen, was passieren soll, wenn ich etwas mache. Also zum Beispiel, lade alle neue Dateien auf den Webserver hoch, sobald ich mit einem Zustand zufrieden bin. Da git nun nur die Änderungen kopiert und diese noch verpackt, ist dies in kürzester Zeit gemacht. Es gibt kein manuelles Hochladen per FTP mehr. Auch kann man zuerst alle Dateien genauestens lokal überprüfen. Ein Klick und alle Dateien sind auf dem Server gespiegelt.

Und wenn irgend etwas schief geht, dann geht man einfach zu einem Zustand vorher zurück. Natürlich funktioniert dies auch in sehr kurzer Zeit.

Dies ist bloss eine der vielen Anwendungen von git. In der Regel ist git dazu gedacht, in einem Team an gemeinsamen Projekten zu arbeiten. Dies ist jedoch schon sehr ausführlich dokumentiert und ich möchte in diesem Post (wird wohl in diverse Serien unterteilt werden) auf meinen Workflow für das Administrieren von Webseiten eingehen.

Weiter lesen

Man ist sich als Webdesigner schon einiges vom InternetExplorer gewöhnt, doch das Problem, mit welchem ich letzthin zu Kämpfen hatte, war mir neu. Ich entwickelte für RapidWeaver eine Erweiterung, welche die Google Suche in eine Webseite einbaut. Bei meinen Tests funktionierte dies in allen Browsern problemlos. Die einzige Ausnahme war der InternetExplorer 8 (frühere Versionen habe ich gar nicht getestet). Ich durchsuchte mein Script auf alle mögliche Fehler, bis ich durch den Debugger der Developer Toolbar des IE8 auf etwas gestossen bin:

In meinem Skript verwendete ich eine Variable “wrapper”. IE8 meldete mir stets, dass dieses Objekt keine Zuweisung eines DOM-Elements gestattet. Kurzerhand habe ich die Variable in “theWrapper” umgetauft und siehe da: jetzt funktioniert das Script auch problemlos im IE8. Es scheint so, als benutzt der Explorer die Variable “wrapper” intern für irgendwas.

Was ich dabei gelernt habe: ich werde ab jetzt meine Variablen immer mit “the” beginnen, also z.B. “theContainer” oder “theElement”.

Eines der tollsten Neuigkeiten von CSS3 ist die Möglichkeit, RGBA Farbwerte zu bentuzen. RGBA steht für RGB mit Alpha-Kanal. So ist es möglich, direkt einer Schrift oder einem Hintergrund eine halb-transparente Farbe zuzuordnen. Wir kennen schon schöne solcher Effekte von PNG-24 Bildern: Webseiten erhielten dadurch auf einfache Weise Tiefenwirkung. Auch die CSS-Regel “opacity” wurde für genau diese Zwecke eingeführt, doch ist RGBA der opacity-Regel meist vorzuziehen, denn opacity bezieht sich immer auf das ganze Objekt. Das heisst, auch die Schriften, welche im Block enthalten sind, werden transparent und somit schlechter leserlich. Mit RGBA ist es möglich, nur einem Hintergrund eine Transparenz zuzuweisen, ohne die Inhalte selber zu ändern. Wow!

Hier ein Beispiel, bei welchem RGBA-Werte für Textschatten eingesetzt werden:

Solche Dinge sind mit “opacity” kaum machbar.

Aber kommen wir zum eigentlichen Problem: Browsersupport bzw. der Internet Explorer. Firefox kann damit seit Version 3 und Safari seit Version 3.2.1 umgehen. Doch erst der IE9 kennt RGBA und viele Besucher benutzen noch eine ältere IE-Version.

Nun kann man entweder sagen “Selber Schuld” oder aber einen Weg suchen, RGBA auch in älteren Browsern zu unterstützen. Dazu gibt es einige Möglichkeiten, wobei insbesondere das Projekt CSS3 Pie zu erwähnen ist.

Doch leider klappte das bei einem meiner Projekte nicht. Das liegt wahrscheinlich daran, dass Inhalte per AJAX nachgeladen werden und so bestimmte Skripte nicht ausgeführt wurden. So machte ich mich daran, und erstellte von Grund auf eine eigene Lösung des Problems.

Weiter lesen

Alle meine Produkte werden über das Internet vertrieben. Daher ist es für mich wichtig, ein Shopsystem zu benutzen, welches:

a) enorm einfach in der Handhabung ist
b) flexibel ist
c) schön aussieht!

Ich habe schon einige Systeme verwendet, angefangen von e-junkie über WordPress und kleine Javascript Shopping carts. Jedes System hat ihre Tücken bzw. Vor- und Nachteile. Weiter lesen