Are Apple touch icons bigger than 60x60 supported, and if so, what dimensions should I use for the iPad and iPhone 4?
+2
A:
Yes. If the size does not match, the system will rescale it. But it's better to make 2 versions of the icons.
- iPad — 72x72.
- iPhone (≥4) — 114x114.
- iPhone ≤3GS — 57x57 — If possible.
You could differentiate iPad and iPhone by the user agent on your server. If you don't want to write script on server, you could also change the icon with Javascript by
<link ref="apple-touch-icon" href="iPhone_version.png" />
...
if (... iPad test ...) {
$('link[rel="apple-touch-icon"]').href = 'iPad_version.png'; // assuming jQuery
}
This works because the icon is queried only when you add the web clip.
(There's no public way to differentiate iPhone ≥4 from iPhone ≤3GS in Javascript yet.)
KennyTM
2010-06-08 13:06:50
The iPhone 4's resolution is apparently scaled up from the iPhone 3's by a factor of two, so 114x114 would probably be a good choice for icon size for that.
JAB
2010-06-08 13:09:53
@JAB: There are borders added to the icon so the actual icon size on iPhone ≤3GS is 59x60. If that's the case 114x114 could be a bit off.
KennyTM
2010-06-08 13:12:21
Are the borders on the iPhone 4+ not scaled by the same amount, resolution-wise (so that size-wise they appear to be the same width)?
JAB
2010-06-08 13:17:33
@JAB: It should be. I didn't check.
KennyTM
2010-06-08 13:24:34
Thanks for all your ideas/advice. If i make 3 versions how do I target each device with the relevant size?Unless I'm missing something and PNG is a container format that I can put the different sizes in?
Harry
2010-06-08 15:43:31
@Harry: You store them into multiple images, e.g. `Icon.png`, `[email protected]`, `Icon~iPad.png`, and put them in the `CFBundleIconFiles` array in your Info.plist.
KennyTM
2010-06-08 17:42:32
+1
A:
I think this question is about web icons. I've tried giving an icon at 512x512, and on the iPhone 4 simulator it looks great (in the preview) however, when added to the home-screen it's badly pixelated.
On the good side, if you use a larger icon on the iPad (still with my 512x512 test) it does seem to come out in better quality on the iPad. Hopefully the iPhone 4 rendering is a bug.
I've opened a bug about this on radar.
EDIT:
I'm currently using a 114x114 icon in hopes that it'll look good on the iPhone 4 when it is released. If the iPhone 4 still has a bug when it comes out, I'm going to optimize the icon for the iPad (crisp and no resize at 72x72), and then let it scale down for old iPhones.
Chris Drackett
2010-06-10 20:31:28
+4
A:
The icon on Apple's site is 129x129 pixels.
http://www.apple.com/apple-touch-icon.png
hope that answers your question.
abe
2010-07-26 20:44:32