Golb Slexa ::

Alle Jahre wieder…
Meine elektronische Weihnachtskarte ist online.

Die Karte hat als Motiv das Bundeshaus in Bern - was mir nicht neutral genug erschien, um es als versendbare Karte zu gestalten.
Aber mit dem Weihnachtsgruss von 2012 ginge dies (s. Link unten “Der schnellste Weihnachtsmann der Welt”).

Weiterhin gibt es eine Weihnachtskarte rein in Papierform:

Weiterführende Links

1. Weihnachtsgruss 2013 - Anm.: diese e-Card wurde vom Server gelöscht
2. Weihnachtsgruss 2012 Der schnellste Weihnachtsmann der Welt
3. Axels Blog Der schnellste Weihnachtsmann der Welt

Wie sowas entsteht?
[Weiterlesen…]

Ein paar Kleinigkeiten verbessert man immer mal wieder hier und da …

1) Microdata eingeführt

Naja, zumindest einmal rudimentär. Vielleicht können Suchmaschinen dann etwas genauer die Bloginhalte analysieren.
Die Anpassung erfolgte in den Template-Files unter
[Flatpress-Root]/fp-interface/themes/[Theme-Name]/*.tpl
anhand des Links [01] (s.u.).

2) Filtertyp und Wert anzeigen
Wenn man im Archiv Monat/ Jahr wählte oder aber eine der Kategorieen, so war funktionell die darauffolgende Ansicht korrekt, aber es wurde in Flatpress nicht ausgegeben, dass und welche Filteraktion gerade greift. Nun wird der Anzeigemodus eingeblendet:

[Weiterlesen…]

Bei meinem letzten Layouts hatte ich in der Haupt-Navigation einen Effekt verwendet: Der aktive Navigationspunkt sah wie eine Aussparung aus:

Wie man zu diesem kommt, erkläre ich schrittweise.
[Weiterlesen…]

Wieder einmal rechtzeitig: Meine animierte Osterkarte mit Sound ist am Wochenende fertig geworden.

Osterkarte anzeigen

Alle Jahre wieder … male ich zu div. Anlässen meine Karten. Und erstelle elektronische, animierte Varianten mit HTML.

In diesem Jahr entstand die nachfolgende Weihnachtskarte:

Zunächst aber entstand die animierte Version. Brainstorming zur Animation und eine erste Skizze auf Papier erfolgte im Zug nach München sitzend.

Einzelgrafiken sind von Hand gezeichnet, dann gescant und in der Bildbearbeitung zugeschnitten und - ganz wichtig - mit Transparenzen versehen.
Die Animation erfolgte per Javascript - es wäre vielleicht auch mit CSS3 gegangen, aber ich war mit jQuery schneller am Ziel.

Ach, ich mache später mal ein ausführlicheres “Making of” und beleuchte dann das Technische genauer.

Schaut es euch an:

Link: Der schnellste Weihnachtsmann der Welt

Wer mag, kann diese Karte mit einer eigenen Grussbotschaft versehen an Freunde weitersenden.

Per CSS 3 lassen sich mit Webfonts andere Schriftarten als die Systemschriften einbinden. Bis dato musste man bei der Wahl der Schriftart darauf achten, dass dies Systemschriften von Windows / Mac / Linux sind. Auch all diese Tricks mit Image-Replacements (Fahrner Image Replacement [FIR]; Scalable Inman Flash Replacement [sIFR], Malarkey Image Replacement [MIR] oder Definitive Solution to Image Replacement [DIR]) - kann man in Zukunft vergessen.

Eine Quelle für Webfonts sind die Google Web Fonts .. s. Link [01] .. (es gibt ganz sicher weitere Quellen - bitte immer auf die zur Schriftart angegebene Lizenz achten).

Zwar gibt Google unter “Quick-use” einen funktionierenden Code für Copy & Paste vor, um die Schrift auf seiner Webseite einzubinden … aber es gibt bei dann jedem Seitenaufruf der eigenen Webseite immer einen dynamischen Request zu Google.
Um dies zu vermeiden und Daten nur vom eigenen Server zu holen und nicht zuletzt auch, um Daten effektiv cachen zu können, kann man die Schriftart auch auf seinen Webserver kopieren und von dort einbinden.

[Weiterlesen…]

Malen wir mal ein Ei. Aber ohne eine Grafik zu verwenden.

Demo-Seite: https://www.axel-hah … -ei-und-html5-audio/

[Weiterlesen…]

Im Laufe der Zeit sammeln sich mehr und mehr kleine Skripte und CSS-Dateien an, die um Einbindung in den Header bitten. Bei mir wurde das Arsenal auch immer grösser:

Javascript:
Ich hatte mehrere Dateien mit eigenen Javascript-Funktionen (wobei die ein oder andere nur im Fall der Verwenung nachgeladen wurde). Hinzu kommen ein Javascript Framework (jQuery) und diverse jQuery Plugins und sonstige Javascripts von Fremdanbietern.

CSS:
Ich verwende 2 CSS-Dateien für die Darstellung auf Bildschirmen und eine CSS Datei für Druckausgabe. Weitere Dateien kommen CSS-Dateien von jQuery-Plugins und sonstigen PHP-Skripten.

[Weiterlesen…]

Nun ist der IE 9 also fertig. Nicht dass es mein persönlicher Favourit ist…, aber ich würde es begrüssen, wenn meine Webseite auf allen Browser etwa gleich daherkäme.

Also habe ich die 64-Bit Installation gewählt. Dieses Setup hat sowohl die 64 Bit als auch die 32 Bit Version des Internet Explorer eingerichtet.

Nach der Installation meine Webseite aufgerufen … und es sah aus, wie auch im IE8. Es benötigt in der Webseite eine kleine Zeile speziell für den IE 9, damit dieser weiss: ich darf hier mehr Funktionen ausreizen. [Weiterlesen…]

Grossmundig werden Standards, wie HTML5, CSS3, and JavaScript genannt. Alles basiert auf offenen Standards, um das von Apple ungeliebte Flash zu verbannen. Und tolle Demos gibts im Showcase dazu. Aber nicht alle Browser unterstützen diese, aber eben der “Superbrowser” von Apple. Bewundern darf man das im HTML5 Showcase.

Oder auch eben nicht.

http://www.apple.com/html5/ (Anm.: Seite wurde entfernt - der Link wurde daher dekativiert)
[Weiterlesen…]