Ich bin immer auf der Suche nach schönen Webseiten, die mich inspirieren (… dabei aber auch funktionieren). An dieser Stelle möchte ich gerne nach und nach eine Sammlung aufbauen. Selbstverständlich werden Vorschläge gerne entgegen genommen.

• ashesandsnow ist eine auf Flash basierende eindrucksvolle Webseite. Möglichst die linke Auswahl treffen (Enhanced), etwas Zeit mitbringen, den Menü-Punkt ‘Vision’ nicht vergessen und den Ton einschalten … einfach schön!
• Die Seite von paul kroening wurde anscheinend schon länger nicht mehr bearbeitet. Optisch jedoch eine klein aber fein gestaltete Webseite.
• flowingtide war eine der ersten Seiten, die mir positiv aufgefallen war.

… weitere folgen …

In den letzten Tagen nach Erscheinen der neuen WordPress-Version häuften sich in den Blogs die Artikel zum Thema Speichererhöhung in Verbindung mit der Fehlermeldung

Fatal error: Allowed memory size of … bytes exhausted …

WordPress Deutschland hat dazu am 16. Juni 2009 eine gute Erklärung in den FAQ veröffentlicht. Besonders der Trick mit der Sprachdatei ist interessant (senkt bei mir den Speicherverbrauch um 13%).
Am gleichen Tag wurde dazu ebenfalls ein kleiner Beitrag auf bueltge.de veröffentlicht.
Beide weisen auf das Plugin „WP-Memory-Usage“ von Alex Rabe hin, das

• die Version
• den verfübaren Speicher
• sowie den aktuellen Speicherbedarf der WordPress-Installation

anzeigt.
Dieses Plugin ermittelt mit den PHP-Funktionen memory_get_usage() den aktuellen Speicherverbrauch und mit ini_get(’memory_limit’) die Lokal zugewiesene Speichergröße.

An dieser Stelle möchte ich Ihnen gerne einen tieferen Einblick in die Materie bieten.

Der Arbeitspeicher (memory_limit) für die einzelnen Hosts auf dem Webserver wird an 2 Stellen festgelegt. Die erste allumfassende Einstellung erfolgt durch den Webhoster in der php.ini.
In dieser wichtigen Konfigurationsdatei sind sämtliche Einstellungen für den PHP-Server hinterlegt. Verständlicherweise unterbinden Web-Hoster den Zugriff auf diese Datei, da sich viele Benutzer einen Server teilen. Mietet man sich einen sogenannten Root-Server sieht das natürlich anders aus.
Dort wird (unter vielen anderen Einstellungen) der memory_limit eingestellt, welcher dann als sogenannter master value für den gesamten Server und den darauf befindlichen einzelnen Hosts die maximal zur Verfügung stehende Speichergröße für PHP-Scripte vorgibt.

Dieser Wert bzw. die gesamte php.ini kann mit der PHP-Funktion phpinfo() ausgelesen werden. Wenn Sie das gerne machen möchten, dann führen Sie folgende Schritte aus:

• Legen Sie im Backend-Bereich von Wordpress eine neue Seite mit dem Titel Backend und einem kurzen Text an
• Stellen Sie die Sichtbarkeit rechts oben in der “Veröffentlichen-Box” auf Privat (dadurch kann die Seite erstens nur von Ihnen und zweitens nur wenn Sie eingeloggt sind aufgerufen werden. Die php.ini sollte aus Sicherheitsgründen nur von Ihnen einsehbar sein)
• Fügen Sie nach dem Speichern der Seite folgendes in die page.php unterhalb des “Loop” Ihres Theme-Ordners ein:

   /* .../wp-content/themes/ihr_theme/page.php */
  <?php
  if(is_page('backend')){
  phpinfo();
  }
  ?>
   /* Speichern nicht vergessen!
  Anmerkung: Anstatt die page.php zu verändern,
  kann diese auch kopiert und umbenannt werden
  (backend.php).
  Diese kann dann als Template beim Neuanlegen
  der Seite ausgewählt werden.
  Dadurch halten Sie die page.php "sauber"
  und können in Zukunft noch weitere php-Scripte
  einfügen ...*/
  

• Rufen Sie nun die zuvor angelegte Seite auf, in dem Sie deren Permalink (z.B. http://ihre_domain/backend) in die Adresszeile Ihres Browser eingeben. Dazu müssen Sie sich wie schon erwähnt vorher eingeloggt haben (der Browser speichert das als Cookie ab).

Nun sollte die Seite mit der gesamten php.ini angezeigt werden. Suchen Sie dort (STRG+F) nach memory_limit. Es werden 3 Spalten angezeigt:

• Directive –> gibt den Namen an
• Local Value –> gibt den lokal verfügbaren maximalen Speicher an (… der Ihrer WordPress-Installation in Ihrem Host-Verzeichnis zur Verfügung steht)
• Master Value –> gibt den durch Ihren Webhoster freigegebenen bzw. vorgegebenen maximalen Speicher an (dieser Wert gildet auf dem gesamten Server für alle Hosts)

Somit wären wir auch schon bei der zweiten Einstellungsmöglichkeit, dem local value. Local value … master value? Etwas verwirrend, oder?! Ging mir zuerst genauso. Vor allem das Zusammenspiel bzw. die Abhängigkeit brachte mich etwas ins Grübeln.

Wenn der Webhoster das maximale Speicherlimit für alle Hosts auf dem Server schon durch den master value in der php.ini festgelegt hat (auf die ich keinen Zugriff habe), kann ich diesen Wert etwa Lokal in meinem eigenen Verzeichnis hochschrauben und mir so mehr Speicher zuschieben, als alle anderen zur Verfügung haben?

Richtig, genau so ist es!

Aber nür, wenn der Webhoster das auch zuläßt.
Dazu gibt es verschiedene Möglichkeiten. Eine wäre, in der wp-config.php die globale Variable WP_MEMORY_LIMIT neu zu setzen und ihr einen Wert zuzuweisen, der höher liegt als die Grundeinstellung von 32 MB (definiert in der wp-settings.php).

<?php
...
define('WP_MEMORY_LIMIT', '64M');
...
?>

Wobei die 65 MB nur ein Beispiel sind, ich konnte den Wert bei mir auch höher schrauben, …

… was mich etwas stutzig machte. Also habe ich mal bei meinem Webhoster nachgefragt und bekam folgende Antwort, die ich nur in Auszügen veröffentliche:

Hallo,

erst einmal möchte ich Ihnen mitteilen, dass ich bisher sehr zufrieden bin.
Und nun eine kleine Frage:
Ist es von Ihnen gewollt, dass der ‘memory_limit’ in der ‘php.ini’ lokal per htaccess oder ini_set() überschrieben werden kann?

Gruß
Jörg Mathuszczyk

Darauf kam folgende Antwort:

Hallo Herr Mathuszczyk,

vielen Dank für Ihre Anfrage.

Dies ist gewollt, da einige Scripte dies benötigen. Wenn sich dadurch jedoch feststellt, das besagter Kunde damit den Server überlastet müssen wir einschreiten.

Bei weiteren Fragen stehen wir Ihnen gern zur Verfügung.

…

An dieser Stelle noch mal vielen Dank an den Support für die (sehr) schnelle Antwort.

Kommen wir nun zu einer weiteren Möglichkeit, den memory_limit hochzusetzen.
Dazu benutzen wir die PHP-Funktion ini_set() und fügen diese an Stelle der zuvor genannten WP_MEMORY_LIMIT in die wp-config.php ein.

<?php
...
ini_set('memory_limit', '65M');
...
?>

Auch dies funktionierte bei mir ohne Probleme. Ist auch logisch, denn beim Setzen von WP_MEMORY_LIMIT wird haargenau die gleiche Funktion benutzt, um den memory_limit festzulegen. Dies geschieht per Zuweisung in der wp-settings.php.

<?php
/**
 * Used to setup and fix common variables and include
 * the WordPress procedural and class library.
 *
 * You should not have to change this file and allows
 * for some configuration in wp-config.php.
 *
 * @package WordPress
 */

if ( !defined('WP_MEMORY_LIMIT') )
	define('WP_MEMORY_LIMIT', '32M');

if ( function_exists('memory_get_usage') && ( (int) @ini_get('memory_limit') < abs(intval(WP_MEMORY_LIMIT)) ) )
	@ini_set('memory_limit', WP_MEMORY_LIMIT);

 ...

Eine dritte Möglichkeit ermöglicht das Speicherlimit in der .htacces-Datei festzulegen, indem dort folgendes eingefügt wird:

php_value memory_limit 65M

# BEGIN WordPress

RewriteEngine On
...

Dieser Weg war bei mir ebenfalls möglich, muss aber wiederum durch den jeweiligen Webhoster zugelassen werden.

Auch wenn es verlockend klingt, den Wert gleich um ein vielfaches hochzusetzen, rate ich davon dringend ab. Ein schlecht programmiertes oder fehlerhaftes Script (Plugin, …) könnte so den gesamten zur Verfügung stehenden Arbeitsspeicher “in Beschlag nehmen”, was den gesamten Server beinträchtigen würde. Aus diesem Grund empfehle ich einen eher kleinen Wert mit etwas Spielraum nach oben (65 MB sollten bei einem WordPress-Blog dicke ausreichen).
Ansonsten würde ich nach Plugins Ausschau halten, die “mächtig Hunger haben”. Eine schnelle Senkung kann durch die oben bereits angesprochene Deaktivierung der deutschen Sprachdatei in der wp-config.php erzielt werden.

define ('WPLANG', 'de_DE');
 /* hier 'de_DE' entfernen */
define ('WPLANG', '');

Durch diese Maßnahme wird das Backend von WordPress zwar wieder in Englisch angezeigt (Grundeinstellung), senkt aber den Ressourcenverbrauch um einiges. Wenn Sie nicht erst seit kurzem mit WordPress arbeiten, sollte das nicht weiter stören.

Bietet Ihr Webhoster von Haus aus nur wenig Arbeitspeicher und das Limit kann auch nicht lokal durch die genannten Maßnahmen erhöht werden, wäre ein Wechsel anzuraten. Dadurch treten auch in Zukunft solche Probleme gar nicht erst auf.

Auf vielen Blocks befindet sich im Kommentarbereich eine Zeile mit Smileys.

…

Durch Anklicken können diese dann schnell und einfach in einen Kommentar eingebunden werden. So etwas wollte ich meinen Besuchern natürlich auch bieten und habe für Euch etwas recherchiert. Folgender Javascript-Block, den ich noch XHTML-Strict validiert habe, muss in Eurer comments.php unter (oder über) der <textarea></textarea> eingefügt werden.

<div class="smileys">
  <script type="text/javascript">
  /*<![CDATA[*/
    function SJB_appendSmiley(text) {
        var comment=document.getElementById('comment');
        comment.value=comment.value+' '+text;
    }

document.write('<a href="javascript:SJB_appendSmiley(\':wink:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_wink.gif" alt=":wink:" class="wp-smiley" title=":wink:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':-|\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_neutral.gif" alt=":-|" class="wp-smiley" title=":-|" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':-x\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_mad.gif" alt=":-x" class="wp-smiley" title=":-x" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':twisted:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_twisted.gif" alt=":twisted:" class="wp-smiley" title=":twisted:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':)\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_smile.gif" alt=":)" class="wp-smiley" title=":)" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\'8-O\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_eek.gif" alt="8-O" class="wp-smiley" title="8-O" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':(\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_sad.gif" alt=":(" class="wp-smiley" title=":(" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':roll:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_rolleyes.gif" alt=":roll:" class="wp-smiley" title=":roll:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':-P\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_razz.gif" alt=":-P" class="wp-smiley" title=":-P" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':oops:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_redface.gif" alt=":oops:" class="wp-smiley" title=":oops:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':-o\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_surprised.gif" alt=":-o" class="wp-smiley" title=":-o" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':mrgreen:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_mrgreen.gif" alt=":mrgreen:" class="wp-smiley" title=":mrgreen:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':lol:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_lol.gif" alt=":lol:" class="wp-smiley" title=":lol:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':idea:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_idea.gif" alt=":idea:" class="wp-smiley" title=":idea:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':-D\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_biggrin.gif" alt=":-D" class="wp-smiley" title=":-D" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':evil:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_evil.gif" alt=":evil:" class="wp-smiley" title=":evil:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':cry:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_cry.gif" alt=":cry:" class="wp-smiley" title=":cry:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\'8)\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_cool.gif" alt="8)" class="wp-smiley" title="8)" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':arrow:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_arrow.gif" alt=":arrow:" class="wp-smiley" title=":arrow:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':-?\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_confused.gif" alt=":-?" class="wp-smiley" title=":-?" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':?:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_question.gif" alt=":?:" class="wp-smiley" title=":?:" />');
document.write('</a> ');
document.write('<a href="javascript:SJB_appendSmiley(\':!:\')">');
document.write('<img src="http://einmal-am-tag.de/wp-includes/images/smilies/icon_exclaim.gif" alt=":!:" class="wp-smiley" title=":!:" />');
document.write('</a> ');
/*]]>*/
</script>

<noscript><p>Wenn du Javascript aktiviert hättest, würden hier klickbare Smileys stehen <br /> You could see clickable smiley faces here if you had JavaScript activated.</p></noscript></div>

Über das div mit der Klassenbezeichnung (class=”smileys”) könnt Ihr die Zeile in Eurem Stylesheet positionieren (falls gewünscht).

Der Pfad zu jedem einzelnen Smiley-Bild muss noch durch Eure eigene Domain ersetzt werden.

document.write('<img src="http://deine_domain/wp-includes/images/smilies/icon_exclaim.gif" alt=":!:" class="wp-smiley" title=":!:" />');

Wenn Ihr das nicht händig machen wollt, empfiehlt sich die Bearbeitung in einem Editor. Notepad++ bietet für solche Vorgänge unter Suche (STR+F) die Option Ersetzen.
Damit lassen sich auch in größeren Scripten einzelne Zeichen schnell und problemlos durch andere austauschen.

In allen Zeilen des beginnenen a-Tags müssen zudem die Hochkommata escaped werden.

document.write('<a href="javascript:SJB_appendSmiley(\' ... \')">');

Die Smileys (wie auch am Pfad erkennbar) befinden sich in dem Ordner …/wp-includes/images/smilies/…, der direkt im Root-Verzeichnis (1. Ebene) Eurer WordPress-Installation liegt. Werft dort einfach mal einen Blick hinein.
Den dort könnt Ihr auch weitere bzw. andere Smilies einfügen. Dazu einfach etwas im Netz stöbern. Eventuell kreiert jemand ja auch einen Satz eigener Smileys und stellt diese dann anderen zur Verfügung.

Sobald Ihr dort eigene Smileys hinzugefügt habt, müssen diese dem WordPress-System noch “bekannt” gemacht werden:

• Öffnet dazu bitte ebenfalls im wp-includes-Ordner die functions.php
• Drückt dort die Tastenkombination “STRG+F”, so dass sich das “Suchen”-Fenster öffnet und gebt dort $wpsmiliestrans = array ein
• Dadurch gelangt Ihr zu einem Array, in dem allen einzelnen Smiley-Images (aus dem zuvor angesprochenen smilie-Ordner) ein individueller Text zugeordnet wird.

  

• Der gleiche Text wird beim Anklicken eines Smileys an die Funktion SJB_appendSmiley übergeben und in den Kommentarbereich eingefügt.
  
  

  document.write('<a href="javascript:SJB_appendSmiley(\':-|\')">');
  

• Wordpress tauscht diesen Text dann durch das jeweilige im $wpsmiliestrans-Array zugewiesene Smiley aus
• Für jeden Eurer eigenen Smileys, die Ihr zuvor im smilie-Odner abgespeichert habt, legt Ihr hier nun nach dem gleichen Shema eine eigene Zeile an:
  
  

  ...
   ':neuer_smiley:' => 'neuer_smiley.gif',
  ':neuer_smiley2:' => 'neuer_smiley2.gif',
  ':neuer_smiley3:' => 'neuer_smiley3.gif',
  ...
  

• Der Javascript-Block in der comments.php muss natürlich um jedes neu hinzugefügte Smiley erweitert werden:
  
  

  document.write('<a href="javascript:SJB_appendSmiley(\':neuer_smiley:\')">');
  document.write('<img src="http://eure_domain/wp-includes/images/smilies/neuer_smilie.gif" alt=":-x" class="wp-smiley" title=":neuer_smilie:" />');
  document.write('</a> ');
  

Jetzt sollte klar geworden sein, wie es funktioniert.

Mich persönlich sprechen diese ‘manto-smileys’ besonders an, die nur noch mit GIMP (oder Photoshop) auf eine akzeptable Größe reduziert werden müßten.
Als ich diese das erste mal gesehen habe, dachte ich nur:”Wie geil ist das denn!”. Allerdings sagt die Seite nichts über die Lizenzbestimmungen des chinesischen Designers aus …!

In der Programmierung, besonders bei größeren Projekten/ Scripten, wird der Quellcode schnell unübersichtlich und schwer wartbar. Wer schon einmal ein Programm/ Script mit mehr als 1000 Zeilen geschrieben hat, wird mir da sicherlich zustimmen. Aus diesem Grund empfiehlt es sich, den Quellcode zu kommentieren und übersichtlich einzurücken. Zu dem können if/else-Kontrollstrukturen und Datenbankabfragen verkürzt dargestellt werden. In diesem Tutorial möchte ich Ihnen dazu einige Beispiele bieten.

Kommentare einsetzen
In der Programmierung sind Kommentare (Comments) meiner Meinung nach das Salz in der Suppe. Sie ermöglichen es uns auch noch nach Monaten, jeden Abschnitt des jeweiligen Quellcodes besser und somit schneller zu verstehen. Dies ist besonders wichtig, wenn fremder (nicht von uns selbst programmierter) Code vorliegt. Ich habe mir angewöhnt, besonders komplexe Passagen direkt mit einem Kommentar zu versehen. In PHP gibt es dazu zwei Möglichkeiten:

/*Einzeiliger Kommentar*/
// einzeilige Kommentare können mit ’//’ (zwei Backslashes) in den Quellcode eingefügt werden

/*Mehrzeiliger Kommentar*/
/* mehrzeilige Kommentare werden mit einem
* beginnenden ’/*’ (Slash und folgendem Sternchen)
* eingeleitet und mit ’*/’ (also umgekehrt)
* wieder abgeschlossen.
* In jeder neuen Zeile empfehle ich ein
* Sternchen als Einleitung einzufügen
*/

Auch wenn Kommentare Mehrarbeit bedeuten, möchte ich Ihnen nahelegen, davon ausgiebig Gebrauch zu machen. Spätestens wenn ein älteres Projekt verändert/angepasst werden muss, werden sie dies zu schätzen wissen. Zudem wird der Lerneffekt verstärkt, da Sie sich mit dem erstellten Quellcode intensiver auseinandersetzen.

Quellcode einrücken
Genau wie beim Kommentieren erfordert das durchgehende Einrücken des Quellcodes zunächst mehr Aufwand (obwohl es bei mir eigentlich schon automatisch erfolgt). Aber neben der verbesserten Lesbarkeit wird durch diese Maßnahme vor allem die Fehlersuche enorm erleichert. Dabei haben sich folgende zwei Möglichkeiten/ Stile etabliert (Einrückunsstile)

/* Stil 1 */
if($ausruf == 'Hallo') {
	echo "Er hat 'Hallo' gerufen";
} else  {
	echo "Er hat nichts gerufen";
}

/* Stil 2 */
if($ausruf == 'Hallo')
{
	echo "Er hat ‘Hallo’ gerufen";
}
else
{
	echo "Er hat nichts gerufen";
}

Die Einrückungstiefe kann dabei getrost selbst bestimmt werden. Einige nehmen einen ganzen ‘Tab’, andere nur zwei oder drei Leerzeichen. Ich denke, dabei kommt es auf die Verschachtelungstiefe an.

Ich persönliche ertappe mich regelmäßig dabei, dass ich Mal den einen und Mal den anderen Einrückungsstil verwende. Den ersteren Aufgrund meiner Java/C++-Erfahrung (der etwas mehr Platz spart) und den zweiten hinsichtlich PHP (den ich als etwas übersichtlicher empfinde). Des Weiteren achte ich darauf, dass z.B. Gleichheitszeichen bei Zuweisungen ordentlich untereinanderstehen.

$string    = 'Hallo Welt';
$boolean   = true;
$int       = 5;
...

Entscheiden Sie selber, wie Sie Ihren Quellcode überschaubarer gestalten! Viele Editoren besitzen bereits eine automatische Einrückung oder das sogenannte Syntaxhighlighting, wodurch dieser Schritt vereinfacht wird.

Quellcode verkürzen
Dies ist ein heikles Thema und es gehört viel Erfahrung und eine Menge Grips dazu, Algorithmen oder einfacher gesagt die Programmierlogik zu verkürzen. Während der ersten Schritte, in denen man sich die Basics der Programmierung aneignet, kommt es meistens zu ausufernden Konstrukten, um z.B. eine Anweisung zu programmieren.
Ausgiebiger Gebrauch von verschachtelten if/else-Kontollstrukturen führen zwar letztendlich ebenfalls zum Ziel, sind jedoch fehleranfälliger und verlangsamen das Programm/ Script (mal ganz abgesehen von der bereits zuvor angesprochenen schlechteren Übersichtlichkeit).

Während diverser Weiterbildungen war es ein beliebter „Wettbewerb“ unter den Teilnehmern, alles möglichst kurz zu programmieren. Die Königsklasse hierbei war der legendäre „Einzeiler“: Unter Verwendung der ausgeklügelsten Techniken (Stichworte: Modulo, Reguläre Ausdrücke, …) wurde mehrzeiliger Code zu einer einzigen Zeile komprimiert.

Ich habe dabei ein ums andere Mal große Augen bekommen, mir dies aber möglichst nicht anmerken lassen !
Doch neben genug Gehirnschmalz und Erfahrung gibt es auch ein paar Techniken, die leicht erlernbar sind und den Quellcode ebenfalls kürzer und überschaubarer gestalten.
Eine Möglichkeit besteht darin, einfache if/else-Kontrollstrukturen in einer einzigen Zeile auszuführen:

/* Lange Version */

if(isset($_POST['color']))
{
	$backgroundcolor =  $_POST['color'];
}
else
{
	$backgroundcolor =  'white';
}

/* Kurze Version */
$backgroundcolor = (isset($_POST['color'])) ? ($_POST['color'] : 'white';

Das Beispiel ist aus der Luft gegriffen und bezieht sich auf PHP. Eine ähnliche Syntax gibt es auch für Java und C++ (…). Es handelt sich hierbei um die sogenannten ‘Ternary Operators’ (engl. Dreifach-Operatoren). Am Anfang etwas gewöhnungsbedürftig, möchte man sie später (einmal verinnerlicht) nicht mehr missen.
Mit dem PHP-Befehl sprintf läßt sich der Quellcode ebenfalls oftmals verürzt und übersichtlicher darstellen.

/* Beipiel herkömmliche Schreibweise */
<?php
$query = "SELECT telefon
          FROM kunde
          WHERE vorname = '".addslashes($vorname)."'
          AND name = '".addslashes($name)."'
          AND strasse = '".addslashes($strasse)."'";
$result = mysql_query($query);
...
/* Nicht sehr übersichlich, oder?!
Dann schauen Sie sich mal dieses Beispiel an*/

$query = sprintf("SELECT telefon
                  FROM kunde
                  WHERE vorname= '%s'
                  AND name = '%s'
                  AND strasse = '%s'",
                  addslashes($vorname),
                  addslashes($name),
                  addslashes($strasse));
$result = mysql_query($query);
?>

Hierbei werden im Quellcode Platzhalter (Literale) eingesetzt, die anschließend in der gleichen Reihenfolge durch die angefügten Parameter ersetzt werden.
Ein %s bedeutet hierbei, dass an dieser Stelle ein String gesetzt wird. Es können auch Dezimalzahlen (%d) oder Zahlen vom Typ float (%f) übergeben werden. Zudem lassen sich neben anderen Angaben auch Ausrichtung und Länge einfügen, auf die ich hier aber nicht weiter eingehen werde (weiterführende Informationen).

Tun Sie sich (und eventuell anderen) einen Gefallen und schreiben Sie lesbaren Quellcode!

Do you know TWITTER ?
Viele haben schon davon gehört, einige wissen aber nicht genau, was es mit diesem “Online-Tagebuch” auf sich hat.
Neben Wikipedia dürfte dieses Video vom “elektrischen Reporter” die meisten Fragen zum Thema “Zwitschern” beantworten.
(Einfach auf das Bild klicken)

Ich für meinen Teil halte nicht viel von diesem ganzen “Zwitscher”-Kram, in dem Leute alle Nase lang mitteilen, was sie gerade machen, wie sie sich momentan fühlen oder weiss der Geier.

Allerdings muss ich zugeben, dass einige Aspekte interessant sind. Neben den (wohl wenigen brauchbaren) Informationen finde ich die Aussage in dem Video erwähnenswert, wo der Gründer im hinteren Teil das Beispiel mit Amsterdam beschreibt: Jemand fährt dorthin, “twittert” es und könnte so prompt von jemand anderes aus Amsterdam z.B. zu einem Drink eingeladen werden. Oder, wie es der Zufall manchmal will, befindet sich just in diesem Augenblick ein Bekannter ebenfalls vor Ort.
Andererseits sollten vielleicht nicht zu viele Informationen preisgegeben werden. Nicht das nachher noch jemand an der “Zwitscher”-Leitung hängt bzw. mitliest, der weniger gute Absichten hegt …

Der eine oder andere hat doch bestimmt früher auch mal ‘Familienduell’ geguckt. Hier ein Video mit einigen lustige Antworten, ich könnte mich kringeln. Aber vor laufender Kamera unter Zeitdruck … ui ui ui … da würde bei mir bestimmt auch das eine oder andere Mal etwas ähnliches rauskommen.

“Nennen Sie ein Tier, das Stacheln hat!” … “Stachelbär!?”
“Nennen Sie ein Spiel im Casino!” … “Roy Black!?”
Schaut es Euch an … für das erste Schmunzeln am Tag!

Der noch recht unbekannte Comedian Bodo Wartke singt am Klavier ein Liebeslied in den verschiedensten Sprachen. Das müsst Ihr Euch unbedingt mal reinziehen … echt Klasse gemacht. Sowas unterstütze ich gerne, Daumen hoch!

Hier der Link zum Video: Liebeslied
Homepage: Bodo Wartke

Am Liebsten hätte ich es direkt eingebunden, aber die Urheberrechte von Künstlern sollten bewahrt werden.

Web 2.0 ist in aller Munde. Nachrichten werden zwischen einzelnen Webseiten ausgetauscht (Stichwort Abonnementdienste wie RSS/Atom). Weblogs schießen wie Pilze aus den Boden. Dynamische Webseiten (DHTML) sowie DOM-Scripting sind in der heutigen Zeit zum Standard geworden. Menüs klappen auf, Texte werden eingeblendet, Seiteninhalte lassen sich einfach verschieben … überall bewegt sich etwas.

Es werden Techniken eingesetzt, die Web-Anwendungen wie Desktop-Anwendungen aussehen lassen (Stichwort Ajax). Rein statische Seiten fristen in den Weiten des Internet nur noch ein Schatten-Dasein.
Und wenn wir ehrlich sind, haben wir uns daran gewöhnt.

Wir erwarten, das Webprogrammierer -und Designer die Seiten so gestalten, das sie attraktiv und „usability“ daher kommen. Das Webseiten auch körperlich beeinträchtigten Menschen zugänglich sind (Stichwort Barrierefreiheit) und nach Möglichkeit in jedem Browser … zumindest einigermaßen … ähnlich aussehen.

Es können Videos und Fotos betrachtet, Musik gehört und Spiele gespielt werden. Animationen, erstellt mit Java, Flash, Javascript oder als GIF-Bild, lassen Webseiten „leben“ (wenn sie uns nicht gerade stören).

Und da ich von diesen Dingen einfach fasziniert bin, habe ich mich daran gesetzt, dem Stylesheet meines Blogs mit Hilfe von PHP ebenfalls etwas Dynamik einzuhauchen.

Anleitung dynamisches Stylesheet
Zuerst muss die Endung der normalen Stylesheet-Datei …

style.css

… durch …

style.css.php

… ersetzt werden.
Eingebunden wird die neue dynamische Stylesheet-Datei wie gewohnt im Head-Bereich der Seite:

<!DOCTYPE html PUBLIC …
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="pfad_zur_datei/style.css.php" />
  </head>
  <body>
  ...
  </body>
</html>

Nun wird im neuen Stylesheet innerhalb eines PHP-Blocks der Content-type angegeben, da der Server beim Parsen sonst davon ausgeht, dass es sich hierbei um eine gewöhnliche HTML-Datei handelt. Dazu wird im Kopf der css.php-Datei folgendes deklariert:

<?php
  header('Content-type: text/css');
   /*
    An dieser Stelle wird der Quellcode eingefügt.
    Mehr dazu später …
   */
?>

/* Begin Typography & Colors */

body {

	font-size: 62.5%; /* Resets 1em to 10px */

	font-family: Arial, Helvetica, Sans-Serif;

	background: #063164; 

	color: #999;

	text-align: center;

	}
…

Nun „weiß“ der Server Bescheid, gibt die PHP-Datei als CSS-Datei an den Browser und dieser kann die Datei anschließend richtig interpretieren.

Erklärung

<?php
 …
?>

Da mir diese Webseite neben dem Bloggen auch als „Bastelstube“ dient (siehe auch mein Kolophon), um Webtechniken anzuwenden, hatte ich mir überlegt, die Hintergrundfarbe beim ersten Aufruf der Seite zufällig aus einem Pool von Hintergrundgrafiken generieren zu lassen. Diese sind bereits als PNG-Dateien auf dem Webspace hinterlegt und werden über den Name eingebunden.

   bg_hellgruen.png
   bg_blau.png
   bg_beige.png
   ...

Dazu legte ich zunächst ein Array an, in das die Namen derjenigen Grafiken einfügte wurde, die später angezeigt werden sollen.

$farben = array('weiss', 'schwarz', 'blau', 'gruen',
        'beige', 'hellblau', 'hellgruen', 'rose',
        'sand', 'grau_gruen');

Aus diesem wird ein zufälliges ausgewählt

 $zufall = array_rand($farben, 1);/* ... die 1 kann bei einem
Wert auch weggelassen werden */
 $zufalls_farbe = $farben[$zufall];

und danach in einem switch-Kontrollblock die Textfarbe an die jeweilige Hintergrundfarbe angepasst, um einen ausreichenden Kontrast zu garantieren.

switch ($zufalls_farbe) {
    case 'weiss':
     $_SESSION['textcolor'] = '#222';
        break;
    case 'beige':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'hellblau':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'oliv':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'rose':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'hellgruen':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'sand':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'grau_gruen':
      $_SESSION['textcolor'] = '#222';
        break;
    default:
      $_SESSION['textcolor'] = '#aaa';
        break;
  }

Anstatt des switch-Kontrollblocks kann natürlich auch eine if-Abfrage eingesetzt werden. Ich habe dies lediglich auf diese Art gelöst, um wieder mal mit der switch-Syntax zu arbeiten. Hinsichtlich der Geschwindigkeit dürften sich beide Möglichkeiten (auch bei größeren Datenmengen) nicht wesentlich unterscheiden (unter Programmierern führt dieser Aspekt gern zu ausufernden Diskussionen –> kürzer, schneller …).

Um die einmal ausgewählte Hintergrundfarbe während des Besuchs beizubehalten, wird noch eine Session-Variable erstellt. In dieser wird beim ersten Einlesen der css.php-Datei ebenfalls die zufällig generierte Hintergrundfarbe gespeichert.

 $_SESSION['color'] = $zufalls_farbe;

Dies wurde für die Textfarbe bereits schon im switch realisiert.
Normalerweise legt der Browser die CSS- Datei (und noch einige andere Dateien, z.B. Grafiken) im eigenen Cache-Speicher ab und ein erneutes Einlesen ist bei Seitenwechsel nicht mehr nötig. Dadurch kann die Webseite nach dem ersten Aufruf schneller geladen werden.

Da dies aber nicht garantiert ist (was mir meine Erfahrungen auch bestätigen), wird bei jedem Einlesen überprüft, ob diese Session-Variable existiert. Sollte dies der Fall sein, erfolgt keine erneute Auswahl der Hintergrundfarbe, sondern es wird dann der gespeicherte Wert der Session-Variable verwendet. Dafür wird der gesamte Quellcode in eine Abfrage eingeschlossen, welche direkt überprüft, ob die Session-Variable bereits existiert.

if(!isset($_SESSION['color'])) {
...
}
/* Nur wenn die SESSION-Variable noch nicht (!)
existiert, wird eine neue Farbe ausgewählt
*/

Nun werden die gefüllten Variablen an den jeweiligen Stellen im normalen Stylesheet-Bereich eingefügt und mit dem echo-Befehl ausgegeben.

#header {
	background: transparent url('images/layout/bg_<?php
        if(isset($_SESSION['color'])) echo $_SESSION['color'];
        else echo 'bg_weiss'; ?>.png') repeat-y top center;
        /* Der else-Block dient nur als Beispiel
        und dürfte nicht ausgeführt werden*/
	}
...

#content {
	font-size: 1.35em;
        color:<?php if(isset($_SESSION['textcolor'])) echo $_SESSION['textcolor']; else echo '#222'; ?>;
	}
...

Durch diese Maßnahme bekommt jeder Besucher der Seite beim ersten Aufruf eine zufällige Hintergrundfarbe, die auch bei Seitenwechsel erhalten bleibt (es sei denn, es wird ein anderer Hintergrund über den Einstellungen-Button gewählt).

Aber anstatt der Hintergrundfarbe könnte auch der body-Hintergrund geändert werden. In dem PHP-Bereich kann das ganze Potenzial dieser Scriptsprache eingesetzt werden, um das Stylesheet den eigenen Bedürfnissen dynamisch anzupassen.
Auch eine Darstellung, welche an die jeweilige Tageszeit angepasst wird bzw. von dieser abhängig ist, kann so leicht realisiert werden (time-Funktion von PHP).

 /* H - Stunde im 24-Stunden-Format (00-23 ) */
if (date("H")>8 && date("H")<20){
$background = "#ffffff";
    $color = "#000000";
  } else {
    $background = "#000000";
    $color = "#ffffff";
  }

Doch es traten auch Probleme auf. Die Stylesheet-Anpassungen für die -Browser der Redmonder habe ich direkt im Stylesheet stehen und nicht wie sonst üblich über eine Browserweiche (Conditional Comments ) als zusätzliches Stylesheet eingebunden.
Die Separierung erfolgt über die “Holzhammer-Methode” mit dem !important-Hack:

/* Beispiel */
.navigation {
	display: block;
	text-align: center;
        /* 'Normale' Browser führen diese Zuweisung aus ... */
	margin-top: 10px !important;
        /* ... während der IE !important nicht kennt und diese
        Zuweisung interpretiert */
        margin-top:0px;
        /* Dies wird dann wieder von allen ausgeführt */
	margin-bottom: 60px;
	}

Diese Art, IE-Bugs zu beheben, sollte eigentlich nicht verwendet werden ( … um das Grund-Stylesheet sauber zu halten). Da ich jedoch bisher nicht viele Anpassungen vornehmen mußte, habe ich es auf diese (nicht besonders elegante Weise) gelöst.
Nach Umänderung meines Stylesheets zu einer PHP-CSS-Datei mit Content-Type-Deklaration wurde ich auch sofort bestraft und der Hack funktionierte aus mir unerklärlichen Gründen nicht mehr. Als Folge wurde meine Seite 3 Tage lang etwas “zerissen” im IE angezeigt, bis ich es als Firefox-Nutzer endlich gemerkt hatte. Dadurch wurde ich mal wieder daran erinnert, dass in der Programmierung umfangreiche Tests unabdingbar sind.
Nun hätte ich mein Grund-Stylesheet ändern und die IE-Anweisungen auslagern können. Ich entschied mich aber dafür, den PHP-Teil in eine separate Datei zu schreiben und zusätzlich in die Seite einzufügen. So können zukünftige weitere Schritte überschaubarer realisiert werden.

Ich hoffe, diese Einführung in dynamische Stylesheets war hilfreich für eigene Projekte.

Hier noch mal der gesamte Quellcode

<?php
session_start(); /* ... muss am Anfang eingefügt werden */
/* error_reporting(E_ALL)  und ini_set('display_errors', 'On') zur Fehlersuche */
error_reporting(E_ALL);
ini_set('display_errors', 'On');
header('Content-type: text/css');

/* Zufallshintergrund */
if(!isset($_SESSION['color'])) {

  $farben = array('weiss', 'schwarz', 'blau', 'gruen', 'beige', 'hellblau', 'hellgruen', 'rose', 'sand', 'grau_gruen');
  $zufall = array_rand($farben, 1);/* ... die 1 kann bei einem Wert auch weggelassen werden */
  $zufalls_farbe = $farben[$zufall];

  switch ($zufalls_farbe) {
    case 'weiss':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'beige':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'hellblau':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'oliv':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'rose':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'hellgruen':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'sand':
      $_SESSION['textcolor'] = '#222';
        break;
    case 'grau_gruen':
      $_SESSION['textcolor'] = '#222';
        break;
    default:
      $_SESSION['textcolor'] = '#ccc';
        break;
  }
  $_SESSION['color'] = $zufalls_farbe;
}
?>

#header {
	background: transparent url('images/layout/bg_<?php
             if(isset($_SESSION['color']))
                 echo $_SESSION['color'];
             else
                 echo 'bg_weiss'; ?>.png') repeat-y top center;
	}

#container_inside {
	background: transparent url('images/layout/bg_<?php
             if(isset($_SESSION['color']))
                 echo $_SESSION['color'];
             else
                 echo 'bg_weiss'; ?>.png') repeat-y top center;
	}

#content {
	font-size: 1.35em;
        color:<?php
            if(isset($_SESSION['textcolor']))
               echo $_SESSION['textcolor'];
            else
               echo '#222'; ?>;
	}

Auch wen die Information nicht mehr ganz neu ist!
Das neue Coldplay Album “LeftRightLeftRightLeft” kann nach wie vor kostenlos anlässlich der Nordamerika-Tour von der Coldplay-Seite herunterladen werden.

Auf der Download-Seite lediglich eine e-Mail-Adresse eingegeben (das Häckchen in Bezug auf den Newsletter entfernen) und das Album runterladen. Leider ist “Coldplay – Life In Technicolor ii” nicht dabei (das Video dazu finde ich sehr gelungen!), aber auch so eine nette Geste.
Viel Schbass …

In den letzten Tagen war es auf meiner Seite ziemlich ruhig geworden. Ab heute könnt ihr sehen, warum. Das gesamte Wochenende wurde programmiert und einige neue Funktionalitäten flossen in die Seite ein.
So wurde die ’starre’ Stylesheet-Datei mit einer dynamischen PHP-Version erweitert. Nun wird beim ersten Laden der Seite aus einem Pool von Hintergrundfarben eine zufällig ausgewählt und in einer Session-Variable gespeichert (so dass diese bei Seitenwechsel nicht neu generiert wird). Ihr habt aber weiterhin die Möglichkeit, einen Hintergrund nach eurem Geschmack auszusuchen.
Des Weiteren wurde eine komplett neue Seite integriert. Durch diese erhält man Zugriff auf eine Fußballdatenbank und kann sich die Ergebnisse und Tabellen der 1. und 2. Bundesliga anzeigen lassen. Die Anwendung wurde komplett eigenständig programmiert und beinhaltet folgende Bereiche:

• Datenbank, welche mehrere Tabellen enthält (Vereine, Spieler, Tabelle, Spieltage und Spielereigenschaften)
• Backend-Script (ca. 1250 Zeilen Code), mit dem Daten geholt und nach Auswahl in der Datenbank gespeichert werden können
• Frontend-Script (ca. 450 Zeilen Code), durch das die gewünschten Daten angezeigt werden

Die Erstellung dauerte ca. 14 Tage (~ 120 Std.) und ermöglicht die Ausgabe von Tabellen und Spieltage der 1. und 2. Bundesliga der vergangenen 2 Saisons (eigentlich noch mehr, siehe mein Webside-Tagebuch). Leider hatte ich nicht bedacht, das Backend cron-jop-tauglich zu erstellen, so dass noch etwas “Handarbeit” nötig ist. Bei Gelegenheit werde ich mich aber noch mal dran setzen. Entweder werden die Daten dann per Cron-Job aktualisiert oder aber der erste Besucher eines Tages müsste kurz warten …! Momentan ist mir die Lust aber vergangen, meine Birne ist weichgekocht und ich werde mich jetzt wieder dem Schreiben von Artikeln widmen. Über die Beseitigung verschiedener Fehler zu schreiben, die aufgetaucht sind, bietet da genug Stuff und wird bestimmt dem einen oder anderen bei seinen Problemen als Hilfe dienen können. Oder aber ich widme mich meiner momentanen Lieblingsbeschäftigung … Layout-Arbeiten. Denn so ganz gefällt mir die Seite noch nicht. Und da diesbezüglich kein Feedback kommt, werden wohl noch einige Veränderungen (warum kann dieser IE6 kein PNG –> Stichwort Schatten) vorgenommen werden.
Ich hoffe, Ihr habt Spaß mit den Neuerungen …!