Quelles sont les dimensions de pixels correctes pour une pomme-touch-icon?

voix
69

Je ne suis pas sûr de ce que la taille correcte devrait être.

De nombreux sites semblent répéter que la pomme-touch-icône doit être pixels 57x57 mais cite un lien cassé comme source.

Hanselman 's et playgroundblues commentaires de différentes tailles , y compris suggèrent 163x163 et 60x60.

Propre d'Apple icône apple.com est 129x129!

Voir ma question connexe: Comment puis-je donner mes sites web une icône pour iPhone?

Créé 04/08/2008 à 22:17
source utilisateur
Dans d'autres langues...                            


11 réponses

voix
40

Il semble que les directives d'Apple au 3 Août, 2010 comprennent maintenant les images « haute résolution » (pour iPhone 4) dans leur « nécessaire » la taille des icônes.

On dirait que nous devons fournir à la fois un 57x57 et une image 114x114 maintenant, ainsi qu'une image de titre 640x960.

Voir une icône personnalisée et création d' image directives (Javascript requis) , qui fait partie d'un document complet:

Créé 16/08/2010 à 07:15
source utilisateur

voix
5

À partir du cache Google d' Apple a Developer Connection - Web Apps Dev Center - La conception de contenu ...

Création d'un clip Web Signet Icône

iPhone et iPod touch permettent à un utilisateur d'enregistrer un signet Clip Web à votre site sur leur écran d'accueil.

Pour spécifier une icône de signet pour toutes les pages d'un site Web, placez une image PNG nommé « pomme-touch-icon.png » dans le répertoire racine de votre serveur Web - similaire à la « favicon.ico » pour les icônes du site.

Pour remplacer l'icône du signet du site sur une page Web spécifique, insérer un élément <link> similaire à <link rel = "apple-touch-icon" href = "/ customIcon.png" /> dans l'élément <head> de la page .

Les dimensions de l'icône de signet doivent être 57x57 pixels. Si l'icône est une taille différente, il sera mis à l'échelle et recadrée pour s'adapter.

Safari composite automatiquement l'icône avec la norme overlay « vitreux » il ressemble à une application iPhone intégré ou iPod.

Créé 07/08/2008 à 00:13
source utilisateur

voix
3

Dépend de la quantité de détails que vous voulez qu'il ait, il a besoin d'avoir le rapport d'aspect de 1: 1 (en gros - il doit être carré)

J'irais avec Apple propre 129 * 129

Créé 04/08/2008 à 22:36
source utilisateur

voix
2

Dans le cadre de leur guide de contenu Web Safari, Apple a fait une page public appelée « Spécification d' une icône de page web pour Web Clip » (Javascript est nécessaire) qui couvre toutes les résolutions et leur mise en œuvre.

Créé 22/01/2011 à 13:53
source utilisateur

voix
2

Je ne peux pas citer une source pour les tailles car la référence officielle est sous clé de l'ADC.

Cependant, la plupart des sites non-NDA ont les tutoriels sur la façon de créer les icônes. Par exemple ici:

Créé 07/08/2008 à 00:06
source utilisateur

voix
1

Spécifications d' Apple spécifient de nouvelles tailles pour iOS 7:

  • 60x60
  • 76x76
  • 120x120
  • 152x152

Alors que de vieilles tailles pour iOS6 et avant sont les suivants:

  • 57x57
  • 72x72
  • 114x114
  • 144x144

Soit dit en passant, les icônes précomposés sont déconseillés.

Par conséquent, pour soutenir, mais de nouveaux périphériques (sous iOS 7) et plus (iOS6 et avant), ces 8 images doivent être présents et le code générique est:

<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png">    
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">

De plus, vous devez créer une image 152x152 nomméeapple-touch-icon.png .

Vous voudrez peut - être savoir que ce générateur de favicon peut générer toutes ces images à la fois. La divulgation complète: Je suis l'auteur de ce site.

Créé 15/01/2014 à 23:04
source utilisateur

voix
1

La taille officielle est 57x57. Je recommanderais d' utiliser la taille exacte simplement en raison du fait qu'il prend moins de mémoire lorsqu'il est chargé (moins qu'Apple met en cache la représentation à l' échelle). Cela dit, Rex est juste que toute taille carrée fonctionnera

Créé 06/08/2008 à 05:10
source utilisateur

voix
0

Vous n'avez pas à se soucier de la taille correcte plus. Si vous avez fichier graphique itune (ie fichier de 1024 * 1024 taille) de votre icône, puis je l' ai créé cette application qui vous fournira toutes les icônes en fonction des informations fournies ici . Obtenez l' application à partir d' ici , et suivez les instructions dans le fichier Lisez - moi pour créer toutes les icônes nécessaires pour l' application iOS.

Créé 20/04/2014 à 21:43
source utilisateur

voix
0

liste mise à jour Octobre 2014, iOS8

Liste pour iPhone et iPad avec et sans rétine

<link rel="apple-touch-icon" href="touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="76x76" href="touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="120x120" href="touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad-retina.png">
<link rel="apple-touch-icon" sizes="180x180" href="touch-icon-iphone-6-plus.png"> 

Mise à jour 2014 iOS 8:

Pour iOS 8 et iPhone 6 Plus

<link rel="apple-touch-icon" sizes="180x180" href="touch-icon-iphone-6-plus.png"> 

Iphone 6 utilise le même 120 x 120 px comme image iphone 4 et 5 le reste est le même que pour iOS 7

Mise à jour 2013 iOS 7:

Pour iOS 7 les résolutions recommandées ont changé:

  • pour iPhone Retina de 114 x 114 pixels sur 120 x 120 px
  • pour iPad Retina de 144 x 144 pixels sur 152 x 152 px

L'autre résolution sont toujours les mêmes

  • 57 x 57 px par défaut
  • 76 x 76 px pour iPads sans rétine
Créé 12/11/2013 à 17:06
source utilisateur

voix
0

Le lien de NilObject m'a conduit au grand blog Rattrapage sur l' icône à makentosh.com

... Bien sûr, tout cette incohérence a dû être traité par la suite, non? Eh bien 2.0 traité dans de belle façon! Enfin 57x57 signifiait réellement 57x57.

... chaque pixel ... rendu parfaitement.

Créé 07/08/2008 à 00:36
source utilisateur

voix
0

Je ne pense pas qu'il y ait une « bonne taille ». Depuis l'iPhone est vraiment en cours d'exécution OSX, l'icône système de rendu est assez robuste. Tant que vous donnez une image de haute qualité avec le ratio d'aspect et une résolution au moins aussi élevée que la production réelle sera, le système d'exploitation très proprement downscale. Mon site utilise un 158x158 et l'icône ressemble pixel parfait sur l'écran de l'iPhone.

Créé 04/08/2008 à 22:22
source utilisateur

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more