Stefan Kendlbacher | priv. Website

Variablen in CSS-Datei verwenden – 2010

admin — Thu, 04 Mar 2010 08:42:28 +0000

Letztes Jahr hab ich bereits auf eine Möglichkeit hingewiesen, wie man Variablen in CSS-Dateien verwenden kann.
Nettuts (bzw. die Bezahlversion) wies nun auf einen neue Möglichkeit hin.
Anthony Short hat mit Hilfe von PHP ein CSS-Framework entwickelt mit dem man nicht nur Variablen (@constants), sondern auch Funktionen (@mixins) definieren kann.
Es gibt bereits Standardfunktionen die mit dem Framework mitgeliefert werden und sofort verwendet werden können. Wie z.B. verschiedene CSS-Grids ( Blueprint, 960gs ) oder CSS-Hacks (Clearfix).

Jeffrey Way, ein Author bei Nettuts, spricht bereits von: This Will Change the Way you Code your CSS

Kann ich nichts hinzufügen.

Quer-durch-asien.de – Panorama

admin — Wed, 24 Feb 2010 11:08:02 +0000

jQuery Plugin ist hausgemacht.

Ein Algorithmus lernt dazu

admin — Tue, 23 Feb 2010 14:47:57 +0000

Ein sehr interessanter Artikel über den Suchgiganten google. Steven Levy beschäftigt sich vor allem damit, wie sich der grundlegende Suchalgorithmus basierend auf dem PageRank im Laufe der Jahre weiterentwickelte und vor allem von Suchanfragen lernte bzw. dadurch angepasst wurde.
Jahr für Jahr werden Änderungen durchgeführt, die der Benutzer nur indirekt mitbekommt (indem die Ergebnisse besser werden). Allein für dieses Jahr werden ~ 550 Modifikationen durchgeführt.
Jahr für Jahr wird also der Kamm, der das Internet durchsucht feiner und größer. Passt sich außerdem der Kopfhaut an und liegt immer besser in der Hand.

Lesen! Exclusive: How Google’s Algorithm Rules the Web

Dazu fällt mir außerdem ein:

Comb the desert! (digital quality)

Quer-durch-asien.de – Bildlink #8

admin — Mon, 22 Feb 2010 09:09:13 +0000

Quer-durch-asien.de – Bildlink #7

admin — Sat, 20 Feb 2010 10:56:35 +0000

Quer-durch-asien.de – Bildlink #6

admin — Fri, 19 Feb 2010 15:06:55 +0000

Quer-durch-asien.de – Bildlink #5

admin — Thu, 18 Feb 2010 08:24:48 +0000

Farben

Quer-durch-asien.de – Bildlink #4

admin — Wed, 17 Feb 2010 14:59:05 +0000

Farben

Quer-durch-asien.de – Bildlink #3

admin — Fri, 05 Feb 2010 12:24:11 +0000

Farben

quer-durch-asien.de – Update

admin — Wed, 03 Feb 2010 20:08:43 +0000

Es ist mittlerweile schon über ein Jahr her, dass wir uns zu Viert aufmachten, russische Züge und tibetische Höhenpässe zu erkunden. Trotzdem hab ich mich nochmal daran gemacht, die Website komplett zu überarbeiten. Brotlose Kunst in Reinform.

Im Endeffekt störte mich an der alten Version die Geschwindigkeit und der fehlende Zusammenhang zwischen einzelnen Bildern.

Um die Geschwindigkeit zu verbessern, verabschiedete ich mich zunächst von meinem guten Bekannten Wordpress und setzte voll und ganz auf CodeIgniter. Nicht nur weil ich dieses Framework während meiner Diplomarbeit schon verwendet hatte, sondern auch um die geplanten Änderungsmaßnahmen wesentlich einfacher durchführen zu können. Auf der anderen Seite hieß das aber auch, dass die Seitenstruktur komplett neu erarbeitet werden musste. Ergo ging viel Zeit flöten.

Der Zusammenhang der Bilder sollte über Farbwerte und Stichworte hergestellt werden.

Farben

Das mit den Farben war schwieriger als zunächst angedacht. Allein die RGB-Farbwerte auszulesen war mich nicht genug, sondern es musste der HSV-Farbraum werden. Nein, nichts mit Fussball. H = Farbton ( 0° – 360°), S=Farbsättigung und V=Hell/Dunkel (grobgesagt). Mit diesen Werten war es für mich einfacher einzelne Bilder zu vergleichen. Außerdem war der Farbregler besser zu gestalten. Für das Auslesen der Farbwerte war der Eintrag von Mikko (Color Analysis) sehr hilfreich.

Im Endeffekt kam in die Datenbank ein Red, Green, Blue, Hue, Saturation, Value und Websafe Wert. Zu jedem Bild 10 Werte auslesen lassen, bis der Rechner qualmte. Machte am Schluss 24,221 Farben (bei 2,551 Bildern … ja genau, doppelte Werte sind rausgeflogen).
Für die Farbauswahl musste natürlich ein selbst gebastelter Farbwähler her.
Beispiele:

R(100)G(50)B(250)R(23)G(10)B(100)R(227)G(57)B(4)R(98)G(179)B(89)

Stichworte

Das Filtern der Bilder sollte außerdem mit Hilfe von Stichworten erleichtert werden. Anders als bei den Farbwerten war das Setzen der Stichworte hier ein nicht zu unterschätzender Arbeitsschritt . Allerdings war diese Aufgabe mit Hilfe von Adobe Bridge relativ einfach durchzuführen.

Danach konnten die zugewiesenen Stichworte, die als Metadaten an die Bilder angehängt wurden, ausgelesen werden (Sprich PHP liest EXIF). Ich häts mir sicher auch einfacher machen können, aber naja … Die Außwahl an sich, sollte dem Benutzer außerdem den Zusammenhang zwischen den Stichworten darstellen. Am besten anschauen, dann wirds deutlicher:

Beispiele:

Von der Funktionalität her, sind das die zwei wesentlichen Neuerungen, die die Website aufzuweisen hat. Neben dem vermehrten Einsatz von AJAX (siehe das Tagebuch oder eine Einzelbildseite), graphischen Überarbeitungen, Auslesen der Geokoordinaten der Bilder, Darstellung der Reiseroute, Firlefanz wie Ausblenden einzelner Seitenblöcke …

Nachdem die Seite online zu begutachten ist, werden hier keine weiteren Screenshots folgen.

»Quer durch Asien

Eingesetzte Technik (u.a.):

CodeIgniter (1.7.2)
jQuery (1.4.2)