Submit Hint Search The Forums LinksStatsPollsHeadlinesRSS
14,000 hints and counting!

High-resolution bookmark icons in iOS 4 iOS devices
Many websites use special 'Apple touch icon' image files that allow home screen bookmarks to look good alongside app icons. However, Apple’s original specification of a 59 x 59 pixel icon now looks rather low-resolution on an iPad screen or an iPhone 4 Retina Display.

Perhaps Apple themselves were aware of the need to future-proof icon sizes, or perhaps they updated their files while developing higher-resolution iOS device screens, but the Apple site has a larger, 129 x 129 pixel home screen icon that looks much better than the smaller versions. With the help of an old hint from the time of the first iPhone, you can create your own high-res home screen icons too.

There are a few steps to carry out before you can set the icon. First, you need to bookmark the Set Touch Icon bookmarklet found on this page in Safari on your iPad or iPhone 4.

Next, create a 129 x 129 pixel PNG icon for the site you want to bookmark. Most sites use a version of their own logo, so it should be easy to find an image of the logo that fits and get it down to size in Preview or Photoshop.

Finally, upload the file to a service that allows direct linking to your image file, and copy the URL to the clipboard on your iOS device. A good free solution is http://tinypic.com (I have no affiliation with this site). You can upload the image on your computer and mail yourself the URL so that it can be copied on your device. You can, of course, also just type the URL in.

Now you’re ready to set the icon. On your iOS device, navigate to the site to be bookmarked, then open the Set Touch Icon bookmarklet. Paste or type the image URL and touch OK. Nothing will appear to happen; this is normal. Now touch the + icon and select Add to Home Screen. The site thumbnail should be replaced with your high-res touch icon. Edit the bookmark name if necessary and touch 'Add' and you’re done! If you already bookmarked the low-res version of the icon, you should instantly see what a difference it makes. Find a comparison for one site here, the high-res version I created is much better than the official one.

[crarko adds: I haven't tested this one.]
    •    
  • Currently 2.13 / 5
  • 1
  • 2
  • 3
  • 4
  • 5
  (23 votes cast)
 
[16,381 views]  

High-resolution bookmark icons in iOS 4 | 4 comments | Create New Account
Click here to return to the 'High-resolution bookmark icons in iOS 4' hint
The following comments are owned by whoever posted them. This site is not responsible for what they say.
High-resolution bookmark icons in iOS 4
Authored by: marook on Jul 06, '10 09:35:31AM

So the hint is:
Websites, please update your Apple Touch Icon to 129x129px.. Please.. ;-)

---
/Marook



[ Reply to This | # ]
High-resolution bookmark icons in iOS 4
Authored by: barefootguru on Jul 06, '10 02:23:23PM
New icon image won't stay
Authored by: hamz01 on Jul 06, '10 03:23:44PM

The hint works, but after I launch the bookmark from the home screen, the image resets to the icon officially listed on the web site. I've given the bookmark different names, moved pages, rebooted at different times, tried different sites, but no matter what the image resets on launch. Not sure if this is a bug or a "feature". I'm on iPhone 4.

---
MacBook Pro 2.4GHz/2GB/256MB/160GB
iPhone 3G 16GB Black
ilostthegame.org



[ Reply to This | # ]
High-resolution bookmark icons in iOS 4
Authored by: ljharb on Jul 06, '10 03:32:03PM
The original specification is for a 57x57 pixel icon - borders applied on the iPhone itself make it 59x60 - but the original image must be 57x57.

StackOverflow tells me that the iPhone 4 should be 114x114, and the iPad 72x72.

http://stackoverflow.com/questions/2997437/what-size-should-apple-touch-icon-png-be-for-ipad-and-iphone-4

[ Reply to This | # ]