Le apple-touch-icon est un petit icône spécifique d’accès au site web utilisé par l’iPhone, l’iPod Touch et l’iPad d’Apple.
L’apple-touch-icon-precomposed sera utilisé comme tel, alors que /apple-touch-icon subira une transformation : arrondis des coins arrondis et effet de brillance.
pour éviter une erreur 404, vous devrez créer 2 png en plus : apple-touch-icon-precomposed.png avec effet et apple-touch-icon.png sans effet.
Soit vous les mettez à la base de votre site, soit vous les mettez dans un autre répertoire et dans ce cas vous devez faire une redirection.
ou en url rewriting :
RewriteRule ^apple-touch-icon-precomposed.png$ /images/apple-touch-icon-precomposed.png [R=301,L]
RewriteRule ^apple-touch-icon.png$ /images/apple-touch-icon.png [R=301,L]
Si vous n’êtes pas en mesure de mettre un .htaccess et que vous ne voulez pas d’erreur 404 sur les apple-touch-icon lors mettez les apple-touch-icon à la base de votre site.
La taille de l’apple-touch-icon est de 57 x 57 px pour iPhone et de 114 x 114px pour iPhone 4+ et 72 x 72px pour l’iPad, sur Aple le apple-touch-icon est de 129 x 129px, doncje vous conseille de faire du 129 x 129px si vous ne devez qu’en faire un. Si la taille du /apple-touch-icon diffère c’est dû aux différences de résolution.
Mais si vous avez fait plusieurs tailles d’apple-touch-icon vous pouvez spécifier au navigateur quelle image prendre.
Pour cela on utilise la balise link dans la balise html head de votre page :
Si vous voulez cibler les apple-touch-icon-precomposed.png mettre la valeur de relà apple-touch-icon-precomposed
Template psd pour iOS icône
