XML-Ecke

Struktur in den Content!

Der kleine Kachelmacher: Gehversuche auf dem Windows 8 Desktop

Auf dem Startbildschirm von Windows 8 lassen sich auch Webseiten im Kacheldesign ablegen. Dabei erscheint standardmäßig das Symbol des Internet-Explorers:

Windows 8

Mit drei Zeilen HTML-Code im Header der Webseite lässt sich das Kachelbild individuell anpassen:

<meta name="application-name" content="albiflora orchids"/>

<meta name="msapplication-TileColor" content="#FFFFCC"/>

<meta name="msapplication-TileImage"content="designimages/albifront.png"/>

In der ersten Zeile wird der Name der “Anwendung” bestimmt – das kann die Adresse der Webseite oder ein beliebiger anderer Text sein. In der zweiten Zeile wird die Hintergrundfarbe der Kachel festgelegt – hier ein klassisches Badezimmerkachel-Gelb. Die dritte Zeile gibt eine Grafik an, die auf der Kachel gezeigt werden soll – 144 mal 144 Pixel groß und im png-Format gespeichert. Wird die Webseite mit diesen Meta-Informationen im Header aufgerufen kann man sie über einen im Internet Explorer 10 unten rechts angezeigten Button mit einer Stecknadel anpinnen:

Windows 8

Hier ist bereits der festgelegte Applikationsname zu sehen. Sobald die Webseite “an Start angeheftet” ist, wird die neue Kachel auf dem Desktop platziert:

Windows 8

Mit ein bisschen XML kann die Kachel auch dynamische Informationen anzeigen, etwa wenn eine Webseite aktualisiert wird. Dazu wird eine Mini-XML-Datei angelegt:

<?xml version="1.0" encoding="utf-8" ?>

<badge value="5" />

Als Wert wird die Anzahl der neu hinzugekommenen Einträge etwa in einem Blog festgelegt. Stattdessen können bei diesen “Live Badge Notifications” auch Symbole, sogenannte Glyphen angezeigt werden. Eine Meta-Information “msapplication-badge” im Header enthält den Link zur XML-Datei sowie optional den Zeitraum, wie oft die Webseite überprüft werden soll. Zusätzlich ist noch etwas JavaScript erforderlich, um die Darstellung in der Kachel auszugeben.

Posted in Im Lauf der Zeit, Tutorials | Tagged | 2 Comments

2 Responses to Der kleine Kachelmacher: Gehversuche auf dem Windows 8 Desktop

  1. Fabian S. says:

    Danke für diesen Artikel. Könntest Du genauer beschreiben, wie man die .xml Datei mit einer Update Anzeige für Blogeinträge (WordPress) einbindet?

    Gruß, Fabian

  2. Peter Zschunke says:

    Hi Fabian, leider habe ich noch keine Antwort, bin aber weiter am Suchen, habe auch Microsoft gefragt. Ich denke, es wird für diese Aufgabe bald ein passendes WordPress-Plugin geben. Gruß, peter

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>