Windows Tile Generator

Datei hinzufügen

Was sind Windows-Tile-Icons?

Benutzer von iPhone oder iPad können Webseiten als Shortcut auf ihrem Homescreen ablegen. Sie können für Ihre Webseite sogenannte Touchicons definieren. Diese werden dann als Icon auf Homescreen des Benutzers angezeigt.

So sieht das Ganze aus:

Wie man sieht, ist das Icon prinzipiell einfarbig. Mehrfarbige Icons sind zwar möglich, aber einfarbige Icons integrieren sich besser in das System. Erstellen Sie am Besten die Ausgangsgröße als transparentes PNG. Die Ausgangsgröße sollte größer als die höchste Auflösung (310x310 Pixel).

Größen und Bildformat

Die Windows-Tiles haben verschiedene Größen: 70x70, 150x150, 310x150 und 310x310 Pixel.

Einbinden in die Webseite

Mit dem folgenden HTML-Code binden Sie die Icons in Ihre Webseite ein:

Titel der Webseite:

<meta name='application-name' content='Mein Titel' />

Hintergrundfarbe der Kachel (Tile):

<meta name='msapplication-TileColor' content='#CCCCCC' />

PNG Tile Image (Standard 150x150 Pixel):

<meta name='msapplication-TileImage' content='150.png' />

Link zur Webseite:

<meta name='msapplication-starturl' content='http//www.ekiwi.de' />

Optionale Größen:

Kleine Kachel - 70x70 Pixel:

<meta name="msapplication-square70x70logo" content="70.png"/>

Mittlere Kachel - 150x150 Pixel:

<meta name="msapplication-square150x150logo" content="150.png"/>

Breite Kachel - 310x150 Pixel:

<meta name="msapplication-wide310x150logo" content="310x150.png"/>

Große Kachel - 310x310 Pixel:

<meta name="msapplication-square310x310logo" content="310.png"/>

Entfernen Sie Icon-Größen, welche Sie nicht benötigen und passen Sie ggf. den Bildpfad an.