Apple Touch Icons nutzen

Datum: 17. Oktober 2012
Autor*in: Bastian Schwarz


Ich habe mal ein wenig recherchiert und möchte hier das Ergebnis mitteilen.

Die Apple Touch Icons können generell benutzt werden um Apps oder Webseiten auf z.B. den Startbildschirm zu pinnen. Ist bei der Webseite dann ein solches Icon hinterlegt wird das „Lesezeichen“ mit ihm hinterlegt und man erhält so einen schönen Wiedererkennungswert.

Generell sollten die Icons in einem transparenten PNG umgesetzt werden.

Es gibt aktuell 4 Größen in denen man die Icons zur Verfügung stellen sollte.

  • 57×57 – IPhone
  • 72×72 – IPad
  • 114×114 – IPhone (4)
  • 144×144 – IPad

Für das Icon gibt es dann noch 3 Effekte die häufig genutzt bzw. automatisch hinzugefügt werden.

Schlagschatten

Der Schlagschatten wird von Apple entweder hinzugefügt oder nicht, beeinflussen kann man das aber nicht. Ist wohl vom Gerät / iOS abhängig.

Abgerundete Ecken

Die abgerundeten Ecken dagegen muss man selber zur Verfügung stellen. Nachfolgend die Größen + kurze Erklärung:

Der Radius für die Ecken beträgt die Icongröße / 6.4. So ergeben sich folgende Größen:

  • 57 Icon — 9 px radius
  • 72 Icon — 11 px radius
  • 114 Icon — 18 px radius
  • 144 Icon — 22 px radius

Scheineffekt

Der Schein auf dem Icon wird von Apple standardmäßig reingezeichnet außer man stellet ein sog. precomposed Logo zur Verfügung. Das kann man also beeinflussen, muss man aber nicht.


Kommentare

Selber kommentieren:






Weitere Beiträge zum Thema Projekte


Augmented Reality trifft TYPO3: POIs neu erleben

Autor*innen: Verena Schmuck, David Kelemen


infomax   //   Projekte   //   Technologie   //   Über den Tellerrand


Wie bringt man POIs auf mobilen Geräten intuitiv und platzsparend zur Anzeige? Diese Frage stand am Anfang von Davids Abschlussprojekt der Ausbildung zum Fachinformatiker Anwendungsentwicklung und wurde mit einer innovativen Lösung beantwortet: dem imx.ARBrowser, einer TYPO3-Erweiterung zur Darstellung von POIs in einer Augmented-Reality-Ansicht.


Beitrag lesen
29
JUL
25

Erkenntnisse der IPC 2011

Autor*in: Benjamin Hofmann


Projekte // Technologie // User Experience & Design


Bevor ich lange im Developer Meeting etwas erzähle, was dann sowieso nur wieder in Vergessenheit gerät, dachte ich mir meine Erkenntnisse von der IPC 2011 in Mainz einfach hier niederzuschreiben. Dauerhaft für alle von uns sichtbar und mit einer Möglichkeit Fragen zu stellen. Hier also meine Top 7 (unsortiert) der Dinge, die ich interessant fand …


Beitrag lesen
08
DEZ
11

Nordstrand – Mien Insel an Land

Autor*in: Elke Leffers


infomax   //   Projekte


Seit September ist die Website von Nordstrand live! Das Besondere dabei: Die technische Basis liefert das Framework der Nordsee Tourismus Service GmbH.


Beitrag lesen
22
OKT
20

Messung Dokumentgröße

Autor*in: Bastian Schwarz


Projekte // Technologie


Seit kurzem scheint die Anzeige der Dokumentgröße über die Web Developer Toolbar im Firefox nicht mehr korrekt zu funktionieren. Es wird häufig die Komprimierung von Scripten / Stylesheets nicht mehr korrekt erkannt.  Alternative Google Chrome – Developer Tools  Kurzanleitung Über Tools – Entwicklertools öffnen, auf „Network“ Tab wechseln, Seite mit Strg+F5 neuladen. Jetzt sieht man …


Beitrag lesen
16
APR
13