Archiv für die Kategorie „Webentwicklung“

Jahresangabe im Footer mit PHP ändern

Alle Jahre wieder wird das Jahr hochgezählt, nur in den meisten Website Footern und Impressum Angaben nicht. Dabei gibt es eine sehr einfache PHP Lösung.

Wer eine Website betreibt hat oft eine Copyright Angabe oder ähnliches im Footer, meist mit Angabe des aktuellen Jahres. Oft sind diese Angaben allerdings per Hand in das HTML Template eingefügt. Für weniger detailorientierte Menschen ist das vielleicht eine Kleinigkeit und nicht schlimm, wenn den ganzen Januar oder länger noch das alte Jahr im Footer steht, für mich ist das allerdings unprofessionell.

Mein Footer sieht zum Beispiel so aus:

© 2005-2009 Visualhype Webentwickler Blog

Datumsangabe mit PHP

Mit PHP lässt sich das Problem sehr einfach mit der date() Funktion lösen. Voraussetzung dafür ist, dass die Serverzeit der aktuellen Zeit entspricht, was bei den meisten Servern der Fall ist.

Konkret wird mit diesem Codestück das aktuelle Jahr ausgegeben:

<?php echo date('Y'); ?>

An der entsprechenden Stelle im Footer einfügen und das wars. Es ist tatsächlich so einfach, trotzdem ist das Jahr im Footer vieler Websites hard gecodet und muss erst vom Betreiber der Website geändert werden.
Noch ist Zeit diese kleine Änderung vor dem Jahreswechsel zu implementieren ;)

Share

Chrome Experiments – JavaScript is awesome

Chrome Experiments

Chrome Experiments ist eine Plattform mit faszinierenden Case Studies zum Thema JavaScript und modernen Webtechniken. Kreative Entwickler mit beeindruckenden JavaScript Skills beteiligen sich an dem Projekt und nutzen modernste Webtechniken wie HTML5, Canvas, SVG und verzichten somit komplett auf Flash (und Silverlight). JavaScript erlebt durch AJAX derzeit eine richtige Renaissance. Mit Hilfe von HTML5 wird sogar noch ein Schritt mehr möglich.

Chrome Experiments beschreibt sich folgendermaßen:

We think JavaScript is awesome. We also think browsers are awesome. Indeed, when we talk about them, we say they are the cat’s meow – which is an American expression meaning AWESOME.

In light of these deeply held beliefs, we created this site to showcase cool experiments for both JavaScript and web browsers.

These experiments were created by designers and programmers from around the world using the latest open standards, including HTML5, Canvas, SVG, and more. Their work is making the web faster, more fun, and more open – the same spirit in which we built Google Chrome.

Die Demos laufen am besten in Google’s Browser Chrome, aber auch die neuste Safari Version unterstützt die meisten Experimente. Bis diese Spielereien allerdings im Internet Explorer funktionieren, können allerdings noch einige Jahre vergehen. Microsoft hängt mit der Unterstützung von modernen Webstandards wir immer weit hinterher. Solange es keine zuverlässige und schnelle Unterstützung durch die meist benutzten Browsern gibt, wird man in der Praxis nicht wirklich viel von HTML5 etc. anwenden können. Leider.

Trotzdem sind die Projekte auf Chrome Experiments mehr als schön anzusehen und geben einen möglichen Einblick auf die Zukunft des Internets.

Check it out: http://www.chromeexperiments.com/

Share

Transparente PNG-Grafiken im Internet Explorer 6

Transparente PNG-Grafiken im Internet Explorer 6

Manchmal benötigt man trotz der Möglichkeit transparente Bilder durch das GIF-Format darzustellen auch transparente PNG-Grafiken, da erst diese über Alphatransparenz verfügen und so ein sauberes Anti-Alaising ermöglichen.

Leider ist eine Darstellung von transparenten PNG Dateien im geliebten IE6 standardmäßig nicht möglich. Da trotz des Versuches von Microsoft mit einem Zwangsupdate auf den Internet Explorer 7 noch viele mit der alten Version im Internet unterwegs sind muss man sich etwas überlegen.

Im Internet kursieren ein paar Ansätze um dieses Problem zu beseitigen. Allerdings nur in Form von Javascript Lösungen, die meist umständlich einzubauen sind oder das konkrete Problem nicht richtig erfassen.

Meine Lösung um transparente PNG-Grafiken im alternden Internet Explorer 6 anzuzeigen funktioniert mit CSS. Nehmen wir an, wir wollen ein transparentes PNG als Hintergrundbild eines Layers definieren.

Vor dem Hack kommt zuerst der Code für andere Browser, die transparente PNG Files unterstützen. Anschließend wird über einen CSS-Hack der IE6 Code eingebunden:

<style type="text/css">
#layer {
background-image:url(bild.png);
}
</style>
<!--[if IE 6]>
<style type="text/css">
#layer {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='bild.png', sizingMethod='scale');
background:none;
}
</style>
<![endif]-->

Den Code kann man natürlich auch in eine externe CSS Datei auslagern. In meiner Lösung muss man zusätzlich background:none; setzen, das liegt am zuvor definierten background-image.

Die von mir verwendete Methode mit dem AlphaImageLoader wird offiziell von Microsoft auf einer Support Seite empfohlen. Wer mehr über den AlphaImageLoader erfahren möchte, der sei auf das Internet Explorer Developer Center im MSDN verwiesen.

Leider ist dieser IE 6 Hack nicht standardkonform und wird im CSS Validator durchfallen. Wer allerdings noch eine signifikante Anzahl an IE6 Besuchern hat, sollte den Hack auf jeden Fall benutzen oder notfalls auf transparente GIFs zurückgreifen. Bei mehreren PNG Dateien auf einer Website kann das Einfügen dieses Codes lästig sein, in dem Fall würde ich zu einer globalen Javascript Lösung greifen.

Share